diff options
Diffstat (limited to 'plugins/jetpack/_inc/build/admin.dops-style.css')
| -rw-r--r-- | plugins/jetpack/_inc/build/admin.dops-style.css | 598 |
1 files changed, 335 insertions, 263 deletions
diff --git a/plugins/jetpack/_inc/build/admin.dops-style.css b/plugins/jetpack/_inc/build/admin.dops-style.css index c400242e..5df35c28 100644 --- a/plugins/jetpack/_inc/build/admin.dops-style.css +++ b/plugins/jetpack/_inc/build/admin.dops-style.css @@ -1,9 +1,9 @@ .dops-button { background: white; - border-color: #c8d7e1; + border-color: #d5d5d5; border-style: solid; border-width: 1px 1px 2px; - color: #2e4453; + color: #414141; cursor: pointer; display: inline-block; margin: 0; @@ -20,16 +20,17 @@ border-radius: 4px; padding: 7px 14px 9px; -webkit-appearance: none; - appearance: none; } + -moz-appearance: none; + appearance: none; } .dops-button:hover { - border-color: #a8bece; - color: #2e4453; } + border-color: #bbbbbb; + color: #414141; } .dops-button:active { border-width: 2px 1px 1px; } .dops-button[disabled], .dops-button:disabled { - color: #e9eff3; + color: #eeeeee; background: white; - border-color: #e9eff3; + border-color: #eeeeee; cursor: default; } .dops-button[disabled]:active, .dops-button:disabled:active { border-width: 1px 1px 2px; } @@ -39,12 +40,12 @@ box-shadow: 0 0 0 2px #78dcfa; } .dops-button.is-compact { padding: 7px; - color: #668eaa; + color: #888888; font-size: 11px; line-height: 1; text-transform: uppercase; } .dops-button.is-compact:disabled { - color: #e9eff3; } + color: #eeeeee; } .dops-button.is-compact .gridicon { top: 4px; margin-top: -8px; } @@ -75,7 +76,8 @@ border-color: #8cc9e2; color: white; } .dops-button.is-primary.is-compact { - color: white; } + color: white; + white-space: nowrap; } .dops-button.is-scary { color: #d94f4f; } @@ -85,7 +87,7 @@ box-shadow: 0 0 0 2px #eba3a3; } .dops-button.is-scary[disabled], .dops-button.is-scary:disabled { color: #f4cdcd; - border-color: #e9eff3; } + border-color: #eeeeee; } .dops-button.is-primary.is-scary { background: #d94f4f; @@ -99,11 +101,11 @@ .dops-button.is-borderless { border: none; - color: #668eaa; + color: #888888; padding-left: 0; padding-right: 0; } .dops-button.is-borderless:hover { - color: #2e4453; } + color: #414141; } .dops-button.is-borderless:focus { box-shadow: none; } .dops-accessible-focus .dops-button.is-borderless:focus { @@ -113,7 +115,7 @@ height: 24px; top: 6px; } .dops-button.is-borderless[disabled], .dops-button.is-borderless:disabled { - color: #e9eff3; + color: #eeeeee; background: white; cursor: default; } .dops-button.is-borderless[disabled]:active, .dops-button.is-borderless:disabled:active { @@ -131,6 +133,7 @@ width: 18px; height: 18px; top: 5px; } + .dops-button-group .dops-button { border-left-width: 0; border-radius: 0; } @@ -160,16 +163,18 @@ .dops-section-header .dops-button-group .dops-button { margin-right: 0; } + .dops-count { display: inline-block; padding: 0.0625rem 0.375rem; - border: solid 1px #87a6bc; + border: solid 1px #a2a2a2; border-radius: 0.75rem; font-size: 0.6875rem; font-weight: 600; line-height: 0.875rem; - color: #87a6bc; + color: #a2a2a2; text-align: center; } + /** * Select Dropdown */ @@ -178,10 +183,10 @@ .dops-select-dropdown.is-compact { height: 28px; } .dops-select-dropdown.is-disabled .dops-select-dropdown__header { - background: #f3f6f8; - border-color: #e9eff3; - color: #a8bece; - -webkit-text-fill-color: #a8bece; } + background: #f6f6f6; + border-color: #eeeeee; + color: #bbbbbb; + -webkit-text-fill-color: #bbbbbb; } .dops-select-dropdown__container { position: relative; @@ -207,7 +212,7 @@ .dops-select-dropdown__header { padding: 11px 44px 11px 16px; border-style: solid; - border-color: #c8d7e1; + border-color: #d5d5d5; border-width: 1px 1px 2px; border-radius: 4px; background-color: white; @@ -215,7 +220,7 @@ font-weight: 600; line-height: 18px; height: 18px; - color: #2e4453; + color: #414141; transition: background-color 0.2s ease; cursor: pointer; } .dops-select-dropdown__header::after { @@ -224,19 +229,19 @@ display: inline-block; vertical-align: middle; font: normal 16px/1 'Dashicons'; - content: '\F347'; + content: '\f347'; position: absolute; right: 13px; top: 12px; display: block; line-height: 18px; - color: rgba(135, 166, 188, 0.5); } + color: rgba(162, 162, 162, 0.5); } .is-compact .dops-select-dropdown__header::after { right: 4px; top: 4px; } .is-compact .dops-select-dropdown__header { padding: 7px; - color: #668eaa; + color: #888888; font-size: 11px; line-height: 1; text-transform: uppercase; } @@ -247,14 +252,14 @@ .dops-select-dropdown.is-open .dops-select-dropdown__header { border-radius: 4px 4px 0 0; box-shadow: none; - background-color: #f3f6f8; } + background-color: #f6f6f6; } .dops-select-dropdown.is-open .dops-select-dropdown__header::after { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; font: normal 16px/1 'Dashicons'; - content: '\F343'; } + content: '\f343'; } .dops-select-dropdown__header .dops-count { margin-left: 8px; } @@ -272,11 +277,11 @@ list-style: none; margin: -2px 0 0 0; background-color: white; - border: 1px solid #c8d7e1; + border: 1px solid #d5d5d5; border-radius: 0 0 4px 4px; } .dops-accessible-focus .dops-select-dropdown__options { border: solid 1px #0087be; - border-top-color: #c8d7e1; } + border-top-color: #d5d5d5; } .dops-select-dropdown.is-open .dops-select-dropdown__options { visibility: visible; height: auto; } @@ -294,7 +299,7 @@ font-size: 14px; font-weight: 400; line-height: 18px; - color: #2e4453; + color: #414141; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; @@ -304,13 +309,13 @@ font-weight: 700; opacity: 0; } .dops-select-dropdown__item:visited { - color: #2e4453; } + color: #414141; } .dops-select-dropdown__item.is-selected { background-color: #00aadc; color: white; } .dops-select-dropdown__item.is-disabled { background-color: white; - color: #87a6bc; + color: #a2a2a2; cursor: default; opacity: .5; } .notouch .dops-select-dropdown__item:hover { @@ -336,19 +341,20 @@ border-color: inherit; } .dops-select-dropdown__separator { - border-top: 1px solid #c8d7e1; + border-top: 1px solid #d5d5d5; display: block; margin: 8px 0; } .dops-select-dropdown__label { display: block; - color: #a8bece; + color: #bbbbbb; margin-top: 5px; line-height: 20px; } .dops-select-dropdown__label label { font-size: 12px; text-transform: uppercase; padding: 0px 16px 0px 16px; } + @keyframes rotate-spinner__right { 0% { transform: rotate(0deg); } @@ -376,7 +382,7 @@ .dops-spinner.is-fallback { position: relative; border-radius: 100%; - background-color: #c8d7e1; } + background-color: #d5d5d5; } .dops-spinner.is-fallback::before, .dops-spinner.is-fallback::after { content: ''; position: absolute; @@ -397,7 +403,7 @@ display: block; } .dops-spinner__border { - fill: #c8d7e1; } + fill: #d5d5d5; } .dops-spinner__progress { animation: 3s linear infinite; @@ -441,6 +447,7 @@ .dops-spinner__progress.is-right, .dops-spinner.is-fallback .dops-spinner__progress.is-right::before { animation-name: rotate-spinner__right; } + .gridicon { fill: currentColor; } .gridicon.needs-offset g { @@ -452,6 +459,7 @@ .gridicon.needs-offset-y g { transform: translate(0, 1px); /* only nudges vertically */ } + /** * @component Search */ @@ -483,9 +491,9 @@ .dops-search .dops-search__close-icon:focus { outline: dotted 1px #0087be; } .dops-search .dops-search__open-icon:hover { - color: #3d596d; } + color: #555555; } .dops-search .dops-search__close-icon { - color: #3d596d; + color: #555555; opacity: 0; transition: opacity .2s ease-in; } .accessible-focus .dops-search.has-focus { @@ -518,7 +526,8 @@ border-radius: inherit; height: 100%; background: white; - appearance: none; + -moz-appearance: none; + appearance: none; box-sizing: border-box; padding: 0px; -webkit-appearance: none; } @@ -531,7 +540,7 @@ .dops-search.is-open { width: 100%; } .dops-search.is-open .dops-search__open-icon { - color: #3d596d; } + color: #555555; } .dops-search.is-open .dops-search__close-icon { display: inline-block; } .dops-search.is-open .dops-search__input, @@ -551,7 +560,6 @@ position: absolute; -webkit-touch-callout: none; -webkit-user-select: none; - -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; @@ -573,7 +581,6 @@ position: absolute; -webkit-touch-callout: none; -webkit-user-select: none; - -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; @@ -621,6 +628,7 @@ .animating.dops-search-opening .dops-search input { opacity: 1; } + /** * Section Nav */ @@ -631,12 +639,12 @@ margin: 0 0 17px 0; background: white; box-sizing: border-box; - box-shadow: 0 0 0 1px rgba(200, 215, 225, 0.5), 0 1px 2px #e9eff3; } + box-shadow: 0 0 0 1px rgba(213, 213, 213, 0.5), 0 1px 2px #eeeeee; } .dops-section-nav.is-empty .dops-section-nav__panel { visibility: hidden; } @media (max-width: 480px) { .dops-section-nav.is-open { - box-shadow: 0 0 0 1px #87a6bc, 0 2px 4px #c8d7e1; } } + box-shadow: 0 0 0 1px #a2a2a2, 0 2px 4px #d5d5d5; } } @media (min-width: 481px) { .dops-section-nav.has-pinned-items { padding-right: 60px; } } @@ -652,7 +660,7 @@ padding: 15px; font-size: 14px; line-height: 16px; - color: #2e4453; + color: #414141; font-weight: 600; cursor: pointer; } .dops-section-nav__mobile-header:after { @@ -661,16 +669,16 @@ display: inline-block; vertical-align: middle; font: normal 16px/1 'Dashicons'; - content: '\F347'; + content: '\f347'; line-height: 16px; - color: rgba(135, 166, 188, 0.5); } + color: rgba(162, 162, 162, 0.5); } .dops-section-nav.is-open .dops-section-nav__mobile-header:after { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; font: normal 16px/1 'Dashicons'; - content: '\F343'; } + content: '\f343'; } .dops-section-nav.has-pinned-items .dops-section-nav__mobile-header { padding-right: 50px; } .dops-section-nav.has-pinned-items .dops-section-nav__mobile-header:after { @@ -688,7 +696,7 @@ .dops-section-nav__mobile-header-text small { margin-left: 5px; font-size: 11px; - color: #87a6bc; + color: #a2a2a2; font-weight: 600; text-transform: uppercase; } .dops-section-nav.has-pinned-items .dops-section-nav__mobile-header-text { @@ -701,8 +709,8 @@ @media (max-width: 480px) { .dops-section-nav.is-open .dops-section-nav__panel { padding-bottom: 15px; - border-top: solid 1px #c8d7e1; - background: linear-gradient(to bottom, #f3f6f8 0%, white 4px); } } + border-top: solid 1px #d5d5d5; + background: linear-gradient(to bottom, #f6f6f6 0%, white 4px); } } @media (min-width: 481px) { .dops-section-nav__panel { display: flex; @@ -715,7 +723,7 @@ position: relative; margin-top: 16px; padding-top: 16px; - border-top: solid 1px #c8d7e1; } + border-top: solid 1px #d5d5d5; } .dops-section-nav-group:first-child { padding-top: 0; border-top: none; } @@ -739,14 +747,14 @@ margin-top: 24px; } .dops-section-nav__hr { - background: #e9eff3; } + background: #eeeeee; } .dops-section-nav-group__label { display: none; margin-bottom: 8px; padding: 0 15px; font-size: 11px; - color: #87a6bc; + color: #a2a2a2; font-weight: 600; text-transform: uppercase; line-height: 12px; } @@ -793,7 +801,7 @@ border-top: none; text-align: center; } .dops-section-nav-tab.is-selected { - border-bottom-color: #2e4453; } } + border-bottom-color: #414141; } } .dops-section-nav-tab__link, .dops-section-nav-tab__text { @@ -810,13 +818,13 @@ font-size: 14px; font-weight: 600; line-height: 18px; - color: #2e4453; + color: #414141; cursor: pointer; } .dops-section-nav-tab__link:visited { - color: #2e4453; } + color: #414141; } .dops-section-nav-tab__link[disabled], .notouch .dops-section-nav-tab__link[disabled]:hover { - color: #e9eff3; + color: #eeeeee; cursor: default; } .is-selected .dops-section-nav-tab__link { color: white; @@ -825,7 +833,7 @@ outline: none; box-shadow: none; } .dops-accessible-focus .dops-section-nav-tab__link:focus { - outline: solid #87a6bc 1px; } + outline: solid #a2a2a2 1px; } .is-external .dops-section-nav-tab__link:after { font-size: 18px; padding-left: 2px; } @@ -843,12 +851,12 @@ .dops-section-nav-tab__link:visited { color: #0087be; } .is-selected .dops-section-nav-tab__link { - color: #2e4453; + color: #414141; background-color: transparent; } .is-selected .dops-section-nav-tab__link:after { display: none; } .notouch .is-selected .dops-section-nav-tab__link:hover { - color: #2e4453; } } + color: #414141; } } .dops-section-nav-tab__text { display: block; @@ -879,22 +887,74 @@ @media (max-width: 480px) { .dops-section-nav .dops-search.is-pinned { height: 46px; } } + +#jp-plugin-container { + min-height: 100vh; } + +/* Card */ +.dops-card { + display: block; + position: relative; + margin: 0 auto 10px auto; + padding: 16px; + box-sizing: border-box; + background: white; + box-shadow: 0 0 0 1px rgba(213, 213, 213, 0.5), 0 1px 2px #eeeeee; } + .dops-card:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; } + @media (min-width: 481px) { + .dops-card { + margin-bottom: 16px; + padding: 24px; } } + .dops-card.is-compact { + margin-bottom: 1px; } + @media (min-width: 481px) { + .dops-card.is-compact { + margin-bottom: 1px; + padding: 16px 24px; } } + .dops-card.is-card-link { + padding-right: 48px; } + +.dops-card__link-indicator { + color: #d5d5d5; + display: block; + height: 100%; + position: absolute; + top: 0; + right: 16px; } + +a.dops-card:hover .dops-card__link-indicator { + color: #bbbbbb; } + +a.dops-card:focus { + outline: 0; } + a.dops-card:focus .dops-card__link-indicator { + color: tint(#00aadc, 20%); } + .dops-text-input.dops-text-input { box-sizing: border-box; margin: 0; padding: 7px 14px; width: 100%; - color: #2e4453; + color: #414141; font-size: 16px; line-height: 1.5; - border: 1px solid #c8d7e1; + border: 1px solid #d5d5d5; background-color: white; transition: all .15s ease-in-out; box-shadow: none; } + .dops-text-input.dops-text-input:-ms-input-placeholder { + color: #a2a2a2; } + .dops-text-input.dops-text-input::-ms-input-placeholder { + color: #a2a2a2; } .dops-text-input.dops-text-input::placeholder { - color: #87a6bc; } + color: #a2a2a2; } .dops-text-input.dops-text-input:hover { - border-color: #a8bece; } + border-color: #bbbbbb; } .dops-text-input.dops-text-input:focus { border-color: #0087be; outline: none; @@ -902,14 +962,18 @@ .dops-text-input.dops-text-input:focus::-ms-clear { display: none; } .dops-text-input.dops-text-input:disabled { - background: #f3f6f8; - border-color: #e9eff3; - color: #a8bece; - -webkit-text-fill-color: #a8bece; } + background: #f6f6f6; + border-color: #eeeeee; + color: #bbbbbb; + -webkit-text-fill-color: #bbbbbb; } .dops-text-input.dops-text-input:disabled:hover { cursor: default; } + .dops-text-input.dops-text-input:disabled:-ms-input-placeholder { + color: #bbbbbb; } + .dops-text-input.dops-text-input:disabled::-ms-input-placeholder { + color: #bbbbbb; } .dops-text-input.dops-text-input:disabled::placeholder { - color: #a8bece; } + color: #bbbbbb; } .dops-text-input.dops-text-input { -webkit-appearance: none; } @@ -929,6 +993,7 @@ box-shadow: 0 0 0 2px #f9e2e2; } .dops-text-input.dops-text-input:focus.is-error:hover { box-shadow: 0 0 0 2px #f0b8b8; } + /** * "popover" theme for `component/tip`. */ @@ -941,13 +1006,13 @@ right: auto /*rtl:ignore*/; } .dops-popover .dops-popover__inner { background-color: white; - border: 1px solid #c8d7e1; + border: 1px solid #d5d5d5; border-radius: 4px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1), 0 0 56px rgba(0, 0, 0, 0.075); text-align: center; position: relative; } .dops-popover .dops-popover__arrow { - border: 10px dashed #c8d7e1; + border: 10px dashed #d5d5d5; height: 0; line-height: 0; position: absolute; @@ -1087,7 +1152,7 @@ background: inherit; border: none; border-radius: 0; - color: #2e4453; + color: #414141; cursor: pointer; display: block; font-size: 14px; @@ -1115,13 +1180,14 @@ .dops-popover__menu-item.has-icon { padding-left: 42px; } .dops-popover__menu-item .gridicon { - color: #a8bece; + color: #bbbbbb; vertical-align: bottom; margin-right: 8px; } .dops-popover__hr { margin: 8px 0; - background: #e9eff3; } + background: #eeeeee; } + .form-toggle[type="checkbox"] { display: none; } @@ -1170,10 +1236,10 @@ box-shadow: 0 0 0 2px #78dcfa; } .form-toggle + .form-toggle__label .form-toggle__switch { - background: #a8bece; } + background: #bbbbbb; } .form-toggle:not(:disabled) + .form-toggle__label:hover .form-toggle__switch { - background: #c8d7e1; } + background: #d5d5d5; } .form-toggle:checked + .form-toggle__label .form-toggle__switch { background: #00aadc; } @@ -1191,7 +1257,7 @@ background: #00aadc; } .form-toggle.is-toggling:checked + .form-toggle__label .form-toggle__switch { - background: #c8d7e1; } + background: #d5d5d5; } .form-toggle.is-compact + .form-toggle__label .form-toggle__switch { border-radius: 8px; @@ -1203,52 +1269,7 @@ .form-toggle.is-compact:checked + .form-toggle__label .form-toggle__switch:after { left: 8px; } -#jp-plugin-container { - min-height: 100vh; } - -/* Card */ -.dops-card { - display: block; - position: relative; - margin: 0 auto 10px auto; - padding: 16px; - box-sizing: border-box; - background: white; - box-shadow: 0 0 0 1px rgba(200, 215, 225, 0.5), 0 1px 2px #e9eff3; } - .dops-card:after { - content: "."; - display: block; - height: 0; - clear: both; - visibility: hidden; } - @media (min-width: 481px) { - .dops-card { - margin-bottom: 16px; - padding: 24px; } } - .dops-card.is-compact { - margin-bottom: 1px; } - @media (min-width: 481px) { - .dops-card.is-compact { - margin-bottom: 1px; - padding: 16px 24px; } } - .dops-card.is-card-link { - padding-right: 48px; } - -.dops-card__link-indicator { - color: #c8d7e1; - display: block; - height: 100%; - position: absolute; - top: 0; - right: 16px; } - -a.dops-card:hover .dops-card__link-indicator { - color: #a8bece; } -a.dops-card:focus { - outline: 0; } - a.dops-card:focus .dops-card__link-indicator { - color: tint(#00aadc, 20%); } .dops-section-header.dops-card { display: flex; flex-wrap: wrap; @@ -1266,7 +1287,7 @@ a.dops-card:focus { min-width: 0; line-height: 1.75rem; position: relative; - color: #2e4453; + color: #414141; font-size: 0.875rem; } .dops-section-header__label .dops-count { margin-left: 0.5rem; } @@ -1285,7 +1306,6 @@ a.dops-card:focus { position: absolute; -webkit-touch-callout: none; -webkit-user-select: none; - -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; @@ -1315,6 +1335,7 @@ a.dops-card:focus { margin-right: 0.5rem; } .section-header__actions .button:last-child { margin-right: 0; } + #jp-plugin-container { min-height: 100vh; } @@ -1331,7 +1352,7 @@ a.dops-card:focus { margin-bottom: 24px; box-sizing: border-box; animation: appear .3s ease-in-out; - background: #2e4453; + background: #414141; color: white; border-radius: 3px; line-height: 1.5; } @@ -1349,7 +1370,7 @@ a.dops-card:focus { overflow: hidden; } .dops-notice__icon-wrapper { - background: #537994; + background: #747474; color: white; display: flex; align-items: baseline; @@ -1418,7 +1439,7 @@ a.dops-card:focus { width: 24px; height: 24px; } } .dops-notice .dops-notice__dismiss { - color: #a8bece; } + color: #bbbbbb; } .dops-notice .dops-notice__dismiss:hover, .dops-notice .dops-notice__dismiss:focus { color: white; } @@ -1428,7 +1449,7 @@ a.dops-notice__action { font-weight: 400; text-decoration: none; white-space: nowrap; - color: #a8bece; + color: #bbbbbb; padding: 13px; display: flex; align-items: center; } @@ -1445,7 +1466,7 @@ a.dops-notice__action { width: 24px; height: 24px; } } a.dops-notice__action:visited { - color: #a8bece; } + color: #bbbbbb; } a.dops-notice__action:hover { color: white; } a.dops-notice__action .gridicon { @@ -1503,6 +1524,7 @@ a.dops-notice__action { height: 14px; vertical-align: sub; opacity: 1; } + .dops-plan-icon { width: inherit; height: inherit; @@ -1527,40 +1549,40 @@ a.dops-notice__action { fill: #f0b849; } .dops-plan-icon__personal .dops-plan-icon__personal-1 { - fill: #87a6bc; } + fill: #a2a2a2; } .dops-plan-icon__personal .dops-plan-icon__personal-2 { - fill: #c8d7e1; } + fill: #d5d5d5; } .dops-plan-icon__personal .dops-plan-icon__personal-3 { fill: white; } .dops-plan-icon__personal .dops-plan-icon__personal-4 { - fill: #668eaa; } + fill: #888888; } .dops-plan-icon__personal .dops-plan-icon__personal-5 { - fill: #4f748e; } + fill: #6f6f6f; } .dops-plan-icon__premium .dops-plan-icon__premium-0 { fill: #4ab866; } .dops-plan-icon__premium .dops-plan-icon__premium-1 { - fill: #87a6bc; } + fill: #a2a2a2; } .dops-plan-icon__premium .dops-plan-icon__premium-2 { - fill: #4f748e; } + fill: #6f6f6f; } .dops-plan-icon__premium .dops-plan-icon__premium-3 { fill: white; } .dops-plan-icon__premium .dops-plan-icon__premium-4 { - fill: #c8d7e1; } + fill: #d5d5d5; } .dops-plan-icon__premium .dops-plan-icon__premium-5 { - fill: #4f748e; } + fill: #6f6f6f; } .dops-plan-icon__premium .dops-plan-icon__premium-6 { - fill: #3d596d; } + fill: #555555; } .dops-plan-icon__business .dops-plan-icon__business-0 { fill: #855DA6; } @@ -1569,16 +1591,38 @@ a.dops-notice__action { fill: white; } .dops-plan-icon__business .dops-plan-icon__business-2 { - fill: #e9eff3; } + fill: #eeeeee; } .dops-plan-icon__business .dops-plan-icon__business-3 { fill: #0087be; } .dops-plan-icon__business .dops-plan-icon__business-4 { fill: #005082; } + +@charset "UTF-8"; #jp-plugin-container { min-height: 100vh; } +/* +The MIT License (MIT) + +Copyright © 2011–2015 thoughtbot, inc. + +Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated +documentation files (the “Software”), to deal in the Software without restriction, including without limitation the +rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit +persons to whom the Software is furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all copies or substantial +portions of the Software. + +THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE +WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR +OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + +https://github.com/thoughtbot/bourbon +*/ .dops-banner.dops-card { border-left: 3px solid; display: flex; @@ -1594,6 +1638,12 @@ a.dops-notice__action { color: #0087be; } .dops-banner.dops-card .dops-banner__icon-circle { background-color: #0087be; } + .dops-banner.dops-card.is-jetpack-info { + border-left-color: #00BE28; } + .dops-banner.dops-card.is-jetpack-info .dops-banner__icon { + color: #00BE28; } + .dops-banner.dops-card.is-jetpack-info .dops-banner__icon-circle { + background-color: #00BE28; } .dops-banner.dops-card.is-upgrade-personal { border-left-color: #f0b849; } .dops-banner.dops-card.is-upgrade-personal .dops-banner__icon { @@ -1619,7 +1669,7 @@ a.dops-notice__action { .dops-banner.dops-card:hover { transition: all 100ms ease-in-out; } .dops-banner.dops-card:hover.is-card-link { - box-shadow: 0 0 0 1px #87a6bc, 0 2px 4px #c8d7e1; } + box-shadow: 0 0 0 1px #a2a2a2, 0 2px 4px #d5d5d5; } .dops-banner.dops-card:hover .dops-card__link-indicator { color: #005082; } @media (min-width: 481px) { @@ -1684,7 +1734,7 @@ a.dops-notice__action { .dops-banner__info .dops-banner__title, .dops-banner__info .dops-banner__description, .dops-banner__info .dops-banner__list { - color: #2e4453; } + color: #414141; } .dops-banner__info .dops-banner__title { font-size: 14px; font-weight: 500; } @@ -1698,7 +1748,7 @@ a.dops-notice__action { .dops-banner__info .dops-banner__list li { margin: 6px 0; } .dops-banner__info .dops-banner__list li .gridicon { - color: #87a6bc; + color: #a2a2a2; display: none; } @media (min-width: 481px) { .dops-banner__info { @@ -1721,7 +1771,7 @@ a.dops-notice__action { margin-bottom: 0; } .dops-banner__action .dops-banner__prices .dops-plan-price.is-discounted, .dops-banner__action .dops-banner__prices .dops-plan-price.is-discounted .dops-plan-price__currency-symbol { - color: #2e4453; } + color: #414141; } .has-call-to-action .dops-banner__action .dops-banner__prices .dops-plan-price { margin-bottom: 8px; } @media (min-width: 481px) { @@ -1734,18 +1784,20 @@ a.dops-notice__action { .dops-banner__action .dops-banner__prices { justify-content: flex-end; text-align: right; } } + .module-overridden-banner.dops-banner.is-compact { margin-bottom: 0; } .module-overridden-banner.dops-banner .dops-banner__description a { text-decoration: underline; } + .dops-info-popover-button { background: transparent; border: none; - color: #668eaa; + color: #888888; padding: 0; } .dops-info-popover-button:hover { - color: #2e4453; } + color: #414141; } .dops-info-popover-button:focus { box-shadow: none; } .dops-accessible-focus .dops-info-popover-button:focus { @@ -1753,24 +1805,26 @@ a.dops-notice__action { .dops-info-popover .gridicon { cursor: pointer; - color: #b8cad7; } + color: #c8c8c8; } .dops-info-popover .gridicon:hover { - color: #2e4453; } + color: #414141; } .dops-info-popover.is_active .gridicon { - color: #2e4453; } + color: #414141; } .dops-popover.dops-info-popover__tooltip .dops-popover__inner { - color: #4f748e; + color: #6f6f6f; font-size: 13px; max-width: 220px; padding: 16px; text-align: left; } + .dops-external-link .gridicons-external { color: currentColor; margin-left: 0.5rem; top: 0.125rem; position: relative; } + #jp-plugin-container { min-height: 100vh; } @@ -1792,7 +1846,8 @@ a.dops-notice__action { display: block; margin-top: 0.875rem; padding-top: 0.75rem; - border-top: 1px solid rgba(135, 166, 188, 0.5); } + border-top: 1px solid rgba(162, 162, 162, 0.5); } + @keyframes appear { 0% { opacity: 0; } @@ -1827,7 +1882,7 @@ a.dops-notice__action { .dops-foldable-card__header.has-border .dops-foldable-card__summary_expanded { margin-right: 48px; } .dops-foldable-card__header.has-border .dops-foldable-card__expand { - border-left: 1px #f3f6f8 solid; } + border-left: 1px #f6f6f6 solid; } .dops-foldable-card.is-compact .dops-foldable-card__header { padding: 8px 16px; min-height: 40px; } @@ -1877,7 +1932,7 @@ button.dops-foldable-card__action { .dops-foldable-card__expand { width: 48px; } .dops-foldable-card__expand .gridicon { - fill: #87a6bc; + fill: #a2a2a2; display: flex; align-items: center; width: 100%; @@ -1886,7 +1941,7 @@ button.dops-foldable-card__action { .dops-foldable-card.is-expanded .dops-foldable-card__expand .gridicon { transform: rotate(180deg); } .dops-foldable-card__expand .gridicon:hover { - fill: #87a6bc; } + fill: #a2a2a2; } .dops-foldable-card__expand:focus .gridicon, .dops-foldable-card__expand:hover .gridicon { fill: #00aadc; } @@ -1898,14 +1953,14 @@ button.dops-foldable-card__action { margin-top: 0.125rem; margin-bottom: 0.125rem; font-size: 0.875rem; - color: #4f748e; } + color: #6f6f6f; } .dops-foldable-card__content { display: none; } .dops-foldable-card.is-expanded .dops-foldable-card__content { display: block; padding: 16px; - border-top: 1px solid #f3f6f8; } + border-top: 1px solid #f6f6f6; } .dops-foldable-card.is-compact .dops-foldable-card.is-expanded .dops-foldable-card__content { padding: 8px; } .dops-foldable-card.is-expanded .dops-foldable-card__content p:first-child { @@ -1916,7 +1971,7 @@ button.dops-foldable-card__action { .dops-foldable-card__summary, .dops-foldable-card__summary_expanded { margin-right: 40px; - color: #87a6bc; + color: #a2a2a2; font-size: 12px; transition: opacity 0.2s linear; display: inline-block; } @@ -1942,6 +1997,7 @@ button.dops-foldable-card__action { display: none; } .dops-foldable-card.is-expanded .dops-foldable-card__summary_expanded { display: inline-block; } + #jp-plugin-container { min-height: 100vh; } @@ -1960,23 +2016,28 @@ button.dops-foldable-card__action { .form-input-validation .gridicon { float: left; margin-left: -34px; } + .dops-textarea { box-sizing: border-box; margin: 0; padding: 0.4375rem 0.875rem; min-height: 5.75rem; width: 100%; - color: #2e4453; + color: #414141; font-size: 1rem; line-height: 1.5; - border: 1px solid #c8d7e1; + border: 1px solid #d5d5d5; background-color: white; transition: all .15s ease-in-out; box-shadow: none; } + .dops-textarea:-ms-input-placeholder { + color: #a2a2a2; } + .dops-textarea::-ms-input-placeholder { + color: #a2a2a2; } .dops-textarea::placeholder { - color: #87a6bc; } + color: #a2a2a2; } .dops-textarea:hover { - border-color: #a8bece; } + border-color: #bbbbbb; } .dops-textarea:focus { border-color: #0087be; outline: none; @@ -1984,14 +2045,19 @@ button.dops-foldable-card__action { .dops-textarea:focus::-ms-clear { display: none; } .dops-textarea:disabled { - background: #f3f6f8; - border-color: #e9eff3; - color: #a8bece; - -webkit-text-fill-color: #a8bece; } + background: #f6f6f6; + border-color: #eeeeee; + color: #bbbbbb; + -webkit-text-fill-color: #bbbbbb; } .dops-textarea:disabled:hover { cursor: default; } + .dops-textarea:disabled:-ms-input-placeholder { + color: #bbbbbb; } + .dops-textarea:disabled::-ms-input-placeholder { + color: #bbbbbb; } .dops-textarea:disabled::placeholder { - color: #a8bece; } + color: #bbbbbb; } + .dops-clipboard-button-input { position: relative; display: block; } @@ -2007,7 +2073,6 @@ button.dops-foldable-card__action { position: absolute; -webkit-touch-callout: none; -webkit-user-select: none; - -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; @@ -2022,87 +2087,12 @@ button.dops-foldable-card__action { right: calc( 100% + 1px); } .dops-clipboard-button-input .dops-clipboard-button:focus::before { right: calc( 100% + 3px); } -#jp-plugin-container { - min-height: 100vh; } - -/* This hack is used to prevent the body from scrolling when the modal is showing */ -body.dops-modal-showing { - overflow: hidden; } - -.dops-modal-wrapper { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 1050; - display: block; - overflow-x: hidden; - overflow-y: auto; - text-align: center; - -webkit-overflow-scrolling: touch; - outline: 0; - transition: opacity .15s linear; - background-color: rgba(0, 0, 0, 0.5); - cursor: pointer; } - .dops-modal-wrapper:before { - content: ''; - display: inline-block; - height: 100%; - vertical-align: middle; } - .dops-modal-wrapper .dops-modal { - position: relative; - display: inline-block; - margin: 0 0; - width: 100%; - max-width: 550px; - vertical-align: middle; - text-align: left; - background-color: #fff; - transition: all 0.5s; - z-index: 100; - clear: both; - cursor: default; } - @media (min-width: 481px) { - .dops-modal-wrapper .dops-modal { - margin: 0 auto; - height: auto; - border-radius: 5px; - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); } } -@charset "UTF-8"; -/* -The MIT License (MIT) - -Copyright © 2011–2015 thoughtbot, inc. - -Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated -documentation files (the “Software”), to deal in the Software without restriction, including without limitation the -rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit -persons to whom the Software is furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all copies or substantial -portions of the Software. -THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE -WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR -COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR -OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. - -https://github.com/thoughtbot/bourbon -*/ -.jp-jetpack-connect__button { - background: #00BE28; - border-color: #00a523; - color: white; } - .jp-jetpack-connect__button:hover, .jp-jetpack-connect__button:focus { - background: #00a523; - border-color: #008b1d; - color: white; } .dops-tooltip.dops-popover .dops-popover__arrow { border-width: 6px; } .dops-tooltip.dops-popover.is-bottom-right .dops-popover__arrow, .dops-tooltip.dops-popover.is-bottom-left .dops-popover__arrow, .dops-tooltip.dops-popover.is-bottom .dops-popover__arrow { - border-bottom-color: #3d596d; + border-bottom-color: #555555; top: 4px; right: 10px; } .dops-tooltip.dops-popover.is-bottom-right .dops-popover__arrow::before, .dops-tooltip.dops-popover.is-bottom-left .dops-popover__arrow::before, .dops-tooltip.dops-popover.is-bottom .dops-popover__arrow::before { @@ -2118,7 +2108,7 @@ https://github.com/thoughtbot/bourbon border-bottom-color: #4ab866; } .dops-tooltip.dops-popover.is-top .dops-popover__arrow, .dops-tooltip.dops-popover.is-top-left .dops-popover__arrow, .dops-tooltip.dops-popover.is-top-right .dops-popover__arrow { - border-top-color: #3d596d; + border-top-color: #555555; bottom: 4px; right: 10px; } .dops-tooltip.dops-popover.is-top .dops-popover__arrow::before, .dops-tooltip.dops-popover.is-top-left .dops-popover__arrow::before, .dops-tooltip.dops-popover.is-top-right .dops-popover__arrow::before { @@ -2151,18 +2141,18 @@ https://github.com/thoughtbot/bourbon .dops-tooltip.dops-popover.is-left .dops-popover__arrow { margin-right: 4px; - border-left-color: #3d596d; } + border-left-color: #555555; } .dops-tooltip.dops-popover.is-right .dops-popover__arrow { margin-left: 4px; - border-right-color: #3d596d; } + border-right-color: #555555; } .dops-tooltip.dops-popover .dops-popover__inner { border: 0px; box-shadow: none; border-radius: 2px; color: white; - background: #3d596d; + background: #555555; font-size: 12px; padding: 6px 10px; text-align: left; } @@ -2187,7 +2177,8 @@ https://github.com/thoughtbot/bourbon .dops-tooltip__hr { margin: 8px 0; - background: #87a6bc; } + background: #a2a2a2; } + #jp-plugin-container { min-height: 100vh; } @@ -2209,7 +2200,7 @@ https://github.com/thoughtbot/bourbon top: 0; width: 100%; height: 1px; - border-top: 1px solid #e9eff3; } + border-top: 1px solid #eeeeee; } .dops-chart__bar-marker { z-index: 1; @@ -2217,7 +2208,7 @@ https://github.com/thoughtbot/bourbon top: 0; width: 100%; height: 1px; - border-top: 1px solid rgba(233, 239, 243, 0.1); } + border-top: 1px solid rgba(238, 238, 238, 0.1); } .dops-chart__bar-marker.is-fifty, .dops-chart__y-axis-label.is-fifty, @@ -2235,7 +2226,7 @@ https://github.com/thoughtbot/bourbon height: 200px; padding: 0 20px 0 10px; font-size: 11px; - color: #668eaa; + color: #888888; margin-bottom: 30px; } .dops-chart__y-axis-label { @@ -2252,7 +2243,7 @@ https://github.com/thoughtbot/bourbon font-size: 0; padding: 5px 0; min-height: 18px; - color: #3d596d; } + color: #555555; } .dops-chart__x-axis-label { position: absolute; @@ -2270,8 +2261,8 @@ https://github.com/thoughtbot/bourbon margin-left: -.5px; width: 1px; height: 5px; - background: #f3f6f8; - background-image: linear-gradient(to bottom, #f3f6f8 0%, #c8d7e1 100%); } + background: #f6f6f6; + background-image: linear-gradient(to bottom, #f6f6f6 0%, #d5d5d5 100%); } .dops-chart__bars { position: relative; @@ -2292,10 +2283,10 @@ https://github.com/thoughtbot/bourbon -ms-flex-shrink: 1; flex-shrink: 1; } .dops-chart__bar.is-weekend { - background-color: rgba(233, 239, 243, 0.5); } + background-color: rgba(238, 238, 238, 0.5); } .dops-chart__bar:hover { cursor: pointer; - background-color: rgba(233, 239, 243, 0.3); } + background-color: rgba(238, 238, 238, 0.3); } .dops-chart__bar.is-selected { cursor: default; background-color: rgba(240, 130, 30, 0.1); } @@ -2326,7 +2317,7 @@ https://github.com/thoughtbot/bourbon z-index: 1; width: 100%; height: 40px; - background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(233, 239, 243, 0.5)); } + background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(238, 238, 238, 0.5)); } .dops-chart__bar:hover .dops-chart__bar-section.is-ghost::after { display: none; } @@ -2350,7 +2341,7 @@ https://github.com/thoughtbot/bourbon .dops-chart__legend .dops-chart__legend-options { float: right; - color: #537994; + color: #747474; list-style-type: none; margin: 0; font-size: 11px; @@ -2423,7 +2414,7 @@ https://github.com/thoughtbot/bourbon font-size: 14px; line-height: 1.4285; animation: appear .3s ease-in-out; - box-shadow: 0 0 0 1px rgba(200, 215, 225, 0.5), 0 1px 2px #e9eff3; } + box-shadow: 0 0 0 1px rgba(213, 213, 213, 0.5), 0 1px 2px #eeeeee; } @media (min-width: 661px) { .dops-chart__empty_notice { padding: 13px 48px; @@ -2434,7 +2425,7 @@ https://github.com/thoughtbot/bourbon display: inline-block; vertical-align: middle; font: normal 16px/1 'Noticons'; - content: '\F456'; + content: '\f456'; position: absolute; top: 23px; left: 20px; @@ -2472,7 +2463,7 @@ https://github.com/thoughtbot/bourbon text-align: right; float: right; min-width: 22px; - color: #c8d7e1; } + color: #d5d5d5; } .dops-chart__tooltip .dops-popover__inner ul li .label { display: block; overflow: hidden; @@ -2511,14 +2502,14 @@ https://github.com/thoughtbot/bourbon margin-bottom: 2px; text-transform: uppercase; font-weight: bold; - border-bottom: 1px solid #426177; + border-bottom: 1px solid #5d5d5d; padding-bottom: 2px; } .dops-chart__tooltip .dops-module-content-list-item.is-published-item { height: 19px; } .dops-chart__tooltip .dops-module-content-list-item.is-published-item .label { text-transform: none; - color: #c8d7e1; + color: #d5d5d5; overflow: hidden; letter-spacing: 0; height: 19px; } @@ -2533,6 +2524,85 @@ https://github.com/thoughtbot/bourbon width: 30px; height: 24px; display: block; } + +#jp-plugin-container { + min-height: 100vh; } + +/* This hack is used to prevent the body from scrolling when the modal is showing */ +body.dops-modal-showing { + overflow: hidden; } + +.dops-modal-wrapper { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1050; + display: block; + overflow-x: hidden; + overflow-y: auto; + text-align: center; + -webkit-overflow-scrolling: touch; + outline: 0; + transition: opacity .15s linear; + background-color: rgba(0, 0, 0, 0.5); + cursor: pointer; } + .dops-modal-wrapper:before { + content: ''; + display: inline-block; + height: 100%; + vertical-align: middle; } + .dops-modal-wrapper .dops-modal { + position: relative; + display: inline-block; + margin: 0 0; + width: 100%; + max-width: 550px; + vertical-align: middle; + text-align: left; + background-color: #fff; + transition: all 0.5s; + z-index: 100; + clear: both; + cursor: default; } + @media (min-width: 481px) { + .dops-modal-wrapper .dops-modal { + margin: 0 auto; + height: auto; + border-radius: 5px; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); } } + +@charset "UTF-8"; +/* +The MIT License (MIT) + +Copyright © 2011–2015 thoughtbot, inc. + +Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated +documentation files (the “Software”), to deal in the Software without restriction, including without limitation the +rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit +persons to whom the Software is furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all copies or substantial +portions of the Software. + +THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE +WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR +OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + +https://github.com/thoughtbot/bourbon +*/ +.jp-jetpack-connect__button { + background: #00BE28; + border-color: #00a523; + color: white; } + .jp-jetpack-connect__button:hover, .jp-jetpack-connect__button:focus { + background: #00a523; + border-color: #008b1d; + color: white; } + .notices-list { overflow: hidden; } .notices-list.is-pinned { @@ -2547,6 +2617,7 @@ https://github.com/thoughtbot/bourbon height: 71px; width: 100%; display: block; } + @keyframes appear { 0% { opacity: 0; } @@ -2607,3 +2678,4 @@ https://github.com/thoughtbot/bourbon @media (min-width: 661px) { .global-notices .dops-notice__dismiss { padding: 13px 16px 0; } } + |