| @@ -1,55 +1,50 @@ | ||
| 1 | -@charset "UTF-8"; | |
| 2 | -/* | |
| 3 | -The MIT License (MIT) | |
| 4 | - | |
| 5 | -Copyright © 2011–2015 thoughtbot, inc. | |
| 6 | - | |
| 7 | -Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated | |
| 8 | -documentation files (the “Software”), to deal in the Software without restriction, including without limitation the | |
| 9 | -rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit | |
| 10 | -persons to whom the Software is furnished to do so, subject to the following conditions: | |
| 11 | - | |
| 12 | -The above copyright notice and this permission notice shall be included in all copies or substantial | |
| 13 | -portions of the Software. | |
| 14 | - | |
| 15 | -THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE | |
| 16 | -WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR | |
| 17 | -COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR | |
| 18 | -OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. | |
| 19 | - | |
| 20 | -https://github.com/thoughtbot/bourbon | |
| 21 | -*/ | |
| 1 | +/** | |
| 2 | + * $gray color functions: | |
| 3 | + * | |
| 4 | + * color.adjust( $gray, $lightness: 10% ) | |
| 5 | + * color.adjust( $gray, $lightness: 20% ) | |
| 6 | + * color.adjust( $gray, $lightness: 30% ) | |
| 7 | + * color.adjust( $gray, $lightness: -10% ) | |
| 8 | + * color.adjust( $gray, $lightness: -20% ) | |
| 9 | + * color.adjust( $gray, $lightness: -30% ) | |
| 10 | + * | |
| 11 | + * See wordpress.com/design-handbook/colors/ for more info. | |
| 12 | + */ | |
| 22 | 13 | :root { |
| 23 | 14 | --font-title-large: 36px; |
| 24 | 15 | --font-title-small: 24px; |
| 25 | 16 | --font-body: 16px; |
| 26 | 17 | --font-label: 12px; |
| 27 | - --jp-black: #000000; | |
| 18 | + --jp-black: #000; | |
| 28 | 19 | --jp-black-80: #2c3338; |
| 29 | - --jp-white: #ffffff; | |
| 20 | + --jp-white: #fff; | |
| 30 | 21 | --jp-white-off: #f9f9f6; |
| 31 | 22 | --jp-gray: #dcdcde; |
| 32 | - --jp-gray-0: #F6F7F7; | |
| 23 | + --jp-gray-0: #f6f7f7; | |
| 33 | 24 | --jp-gray-5: #dcdcde; |
| 34 | 25 | --jp-gray-10: #c3c4c7; |
| 35 | - --jp-gray-20: #A7AAAD; | |
| 26 | + --jp-gray-20: #a7aaad; | |
| 36 | 27 | --jp-gray-30: #8c8f94; |
| 37 | - --jp-gray-40: #787C82; | |
| 28 | + --jp-gray-40: #787c82; | |
| 38 | 29 | --jp-gray-50: #646970; |
| 39 | - --jp-gray-60: #50575E; | |
| 30 | + --jp-gray-60: #50575e; | |
| 40 | 31 | --jp-gray-70: #3c434a; |
| 41 | - --jp-gray-80: #2C3338; | |
| 32 | + --jp-gray-80: #2c3338; | |
| 42 | 33 | --jp-gray-90: #1d2327; |
| 43 | 34 | --jp-gray-100: #101517; |
| 44 | 35 | --jp-gray-off: #e2e2df; |
| 36 | + --jp-yellow-5: #f5e6b3; | |
| 45 | 37 | --jp-yellow-10: #f2cf75; |
| 46 | - --jp-red-0: #F7EBEC; | |
| 47 | - --jp-red-50: #D63638; | |
| 48 | - --jp-red-60: #B32D2E; | |
| 49 | - --jp-red-80: #8A2424; | |
| 38 | + --jp-yellow-40: #c08c00; | |
| 39 | + --jp-orange-20: #faa754; | |
| 40 | + --jp-blue-5: #ced9f2; | |
| 41 | + --jp-red-0: #f7ebec; | |
| 42 | + --jp-red-50: #d63638; | |
| 43 | + --jp-red-60: #b32d2e; | |
| 44 | + --jp-red-80: #8a2424; | |
| 50 | 45 | --jp-red: #d63639; |
| 51 | - --jp-pink: #C9356E; | |
| 46 | + --jp-pink: #c9356e; | |
| 52 | 47 | --jp-green-0: #f0f2eb; |
| 53 | 48 | --jp-green-5: #d0e6b8; |
| 54 | 49 | --jp-green-10: #9dd977; |
| 55 | 50 | --jp-green-20: #64ca43; |
| @@ -61,11 +56,13 @@ | ||
| 61 | 56 | --jp-green-80: #004515; |
| 62 | 57 | --jp-green-90: #003010; |
| 63 | 58 | --jp-green-100: #001c09; |
| 64 | 59 | --jp-green: #069e08; |
| 60 | + --jp-green-mint: #d3f6d5; | |
| 65 | 61 | --jp-green-primary: var(--jp-green-40); |
| 66 | 62 | --jp-green-secondary: var(--jp-green-30); |
| 67 | 63 | --jp-border-radius: 4px; |
| 64 | + --jp-border-radius-rna: 8px; | |
| 68 | 65 | --jp-menu-border-height: 1px; |
| 69 | 66 | --jp-underline-thickness: 2px; |
| 70 | 67 | --jp-modal-padding-large: 32px; |
| 71 | 68 | --jp-modal-padding: 24px; |
| @@ -75,11 +72,8 @@ | ||
| 75 | 72 | --jp-button-radius: 4px; |
| 76 | 73 | --jp-gap: 16px; |
| 77 | 74 | } |
| 78 | 75 | |
| 79 | -#jetpack_summary_widget { | |
| 80 | - /* Widget settings */ | |
| 81 | -} | |
| 82 | 76 | #jetpack_summary_widget * { |
| 83 | 77 | box-sizing: border-box; |
| 84 | 78 | } |
| 85 | 79 | #jetpack_summary_widget h2.hndle span { |
| @@ -90,17 +84,22 @@ | ||
| 90 | 84 | padding: 0 0.4em; |
| 91 | 85 | } |
| 92 | 86 | #jetpack_summary_widget h2.hndle svg { |
| 93 | 87 | height: 20px; |
| 94 | - margin: 0.15em 0.5em 0 0; | |
| 88 | + margin-block: 0.15em 0; | |
| 89 | + margin-inline-start: 0.5em; | |
| 90 | + margin-inline-end: 0; | |
| 95 | 91 | } |
| 96 | 92 | #jetpack_summary_widget pre.stats-widget-error { |
| 97 | 93 | overflow: scroll; |
| 98 | 94 | } |
| 99 | -#jetpack_summary_widget .js-toggle-stats_dashboard_widget_control .toggle-indicator:before { | |
| 95 | +#jetpack_summary_widget { | |
| 96 | + /* Widget settings */ | |
| 97 | +} | |
| 98 | +#jetpack_summary_widget .js-toggle-stats_dashboard_widget_control .toggle-indicator::before { | |
| 100 | 99 | content: "\f111"; |
| 101 | 100 | display: inline-block; |
| 102 | - font: normal 20px/1 dashicons; | |
| 101 | + font: 400 20px/1 dashicons; | |
| 103 | 102 | } |
| 104 | 103 | #jetpack_summary_widget .inside { |
| 105 | 104 | margin: 0; |
| 106 | 105 | padding: 0; |
| @@ -110,15 +109,14 @@ | ||
| 110 | 109 | padding: 0 10px; |
| 111 | 110 | overflow: hidden; |
| 112 | 111 | } |
| 113 | 112 | #jetpack_summary_widget .inside #stats_dashboard_widget_control .button-primary { |
| 114 | - float: left; | |
| 113 | + float: inline-end; | |
| 115 | 114 | } |
| 116 | 115 | #jetpack_summary_widget .inside #dashboard_stats { |
| 117 | 116 | box-sizing: border-box; |
| 118 | 117 | width: 100%; |
| 119 | 118 | padding: 0 10px; |
| 120 | - /* Widget graph contents */ | |
| 121 | 119 | } |
| 122 | 120 | #jetpack_summary_widget .inside #dashboard_stats.is-loading { |
| 123 | 121 | display: none; |
| 124 | 122 | } |
| @@ -127,8 +125,11 @@ | ||
| 127 | 125 | } |
| 128 | 126 | #jetpack_summary_widget .inside #dashboard_stats #stats-graph { |
| 129 | 127 | margin: 0; |
| 130 | 128 | } |
| 129 | +#jetpack_summary_widget .inside #dashboard_stats { | |
| 130 | + /* Widget graph contents */ | |
| 131 | +} | |
| 131 | 132 | #jetpack_summary_widget .inside #dashboard_stats #stat-chart { |
| 132 | 133 | background: none !important; |
| 133 | 134 | } |
| 134 | 135 | #jetpack_summary_widget .inside #dashboard_stats #stats-info { |
| @@ -151,10 +152,13 @@ | ||
| 151 | 152 | margin: 0 0 0.5em 0; |
| 152 | 153 | } |
| 153 | 154 | #jetpack_summary_widget .inside #dashboard_stats #stats-info p { |
| 154 | 155 | margin: 0 0 0.25em; |
| 155 | - color: #999; | |
| 156 | + color: var(--jp-gray-40); | |
| 156 | 157 | } |
| 158 | +#jetpack_summary_widget .inside #dashboard_stats #stats-info p.nothing { | |
| 159 | + color: var(--jp-gray-60); | |
| 160 | +} | |
| 157 | 161 | #jetpack_summary_widget .inside #dashboard_stats #stats-info p.widget-loading { |
| 158 | 162 | margin: 1em 0 0; |
| 159 | 163 | color: #333; |
| 160 | 164 | } |
| @@ -175,13 +179,22 @@ | ||
| 175 | 179 | box-shadow: 0 4px 40px 0 rgba(0, 0, 0, 0.04); |
| 176 | 180 | padding: 1em 1.5em 1em 1.5em; |
| 177 | 181 | overflow: hidden; |
| 178 | 182 | display: grid; |
| 179 | - gap: 1em 1em; | |
| 180 | - grid-template-areas: "header header" "posts searches"; | |
| 183 | + row-gap: 1em; | |
| 184 | + grid-template-areas: "header" "content"; | |
| 185 | + grid-template-rows: min-content min-content; | |
| 186 | +} | |
| 187 | +#jetpack_summary_widget .stats-info-content { | |
| 188 | + grid-area: content; | |
| 189 | + display: grid; | |
| 190 | + grid-template-areas: "posts searches"; | |
| 181 | 191 | grid-template-columns: 1fr 1fr; |
| 182 | - grid-template-rows: min-content min-content; | |
| 192 | + column-gap: 1em; | |
| 183 | 193 | } |
| 194 | +#jetpack_summary_widget .stats-info-content .stats-section { | |
| 195 | + min-width: 0; | |
| 196 | +} | |
| 184 | 197 | #jetpack_summary_widget #stats-info .stats-info-header { |
| 185 | 198 | grid-area: header; |
| 186 | 199 | display: flex; |
| 187 | 200 | justify-content: space-between; |
| @@ -258,35 +271,8 @@ | ||
| 258 | 271 | } |
| 259 | 272 | #jetpack_summary_widget .wpcom-connect .actions small a { |
| 260 | 273 | color: #999; |
| 261 | 274 | } |
| 262 | -#jetpack_summary_widget .button-jetpack { | |
| 263 | - background: #069e08; | |
| 264 | - border-color: #046d06; | |
| 265 | - color: white; | |
| 266 | - box-shadow: inset 0 1px 0 #09e80c, 0 1px 0 rgba(0, 0, 0, 0.15); | |
| 267 | -} | |
| 268 | -#jetpack_summary_widget .button-jetpack:hover, #jetpack_summary_widget .button-jetpack:focus { | |
| 269 | - background: #058507; | |
| 270 | - border-color: #035404; | |
| 271 | - color: white; | |
| 272 | - box-shadow: inset 0 1px 0 #08cf0a; | |
| 273 | -} | |
| 274 | -#jetpack_summary_widget .button-jetpack:focus { | |
| 275 | - box-shadow: inset 0 1px 0 #08cf0a, 0 0 0 1px #4f94d4, 0 0 2px 1px rgba(30, 140, 190, 0.8); | |
| 276 | -} | |
| 277 | -#jetpack_summary_widget .button-jetpack:active { | |
| 278 | - background: #046d06; | |
| 279 | - border-color: #035404; | |
| 280 | - color: white; | |
| 281 | - box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 0 1px #4f94d4, 0 0 2px 1px rgba(30, 140, 190, 0.8); | |
| 282 | -} | |
| 283 | -#jetpack_summary_widget .button-jetpack[disabled], #jetpack_summary_widget .button-jetpack:disabled, #jetpack_summary_widget .button-jetpack.button-primary-disabled, #jetpack_summary_widget .button-jetpack.disabled { | |
| 284 | - color: #c7d1c7 !important; | |
| 285 | - background: #057706 !important; | |
| 286 | - border-color: #035404 !important; | |
| 287 | - text-shadow: none !important; | |
| 288 | -} | |
| 289 | 275 | #jetpack_summary_widget footer { |
| 290 | 276 | background: var(--jp-white-off); |
| 291 | 277 | overflow: hidden; |
| 292 | 278 | } |
| @@ -305,9 +291,9 @@ | ||
| 305 | 291 | padding: 1em 1.5em 1em 1.5em; |
| 306 | 292 | } |
| 307 | 293 | #jetpack_summary_widget footer h3 { |
| 308 | 294 | font-size: 1em; |
| 309 | - font-weight: normal; | |
| 295 | + font-weight: 400; | |
| 310 | 296 | margin: 0 0 0.25em 0; |
| 311 | 297 | padding: 0; |
| 312 | 298 | } |
| 313 | 299 | #jetpack_summary_widget footer p.blocked-count { |
| @@ -312,9 +298,9 @@ | ||
| 312 | 298 | } |
| 313 | 299 | #jetpack_summary_widget footer p.blocked-count { |
| 314 | 300 | margin-top: 0; |
| 315 | 301 | margin-bottom: 6px; |
| 316 | - margin-left: 8px; | |
| 302 | + margin-inline-end: 8px; | |
| 317 | 303 | font-weight: 500; |
| 318 | 304 | font-size: 2rem; |
| 319 | 305 | display: inline-block; |
| 320 | 306 | padding: 0 4px; |
| @@ -330,17 +316,22 @@ | ||
| 330 | 316 | padding: 0; |
| 331 | 317 | text-align: center; |
| 332 | 318 | } |
| 333 | 319 | #jetpack_summary_widget footer .footer-links { |
| 334 | - margin: 0 1.5em 1.5em 0; | |
| 320 | + margin-block: 0 1.5em; | |
| 321 | + margin-inline-start: 1.5em; | |
| 322 | + margin-inline-end: 0; | |
| 335 | 323 | } |
| 336 | 324 | #jetpack_summary_widget footer .footer-links svg { |
| 337 | 325 | height: 20px; |
| 338 | 326 | } |
| 339 | 327 | #jetpack_summary_widget footer .footer-links span { |
| 340 | - float: left; | |
| 328 | + float: inline-end; | |
| 341 | 329 | } |
| 342 | -#jetpack_summary_widget footer .button-jetpack { | |
| 330 | +#jetpack_summary_widget footer .button { | |
| 331 | + background: var(--jp-black); | |
| 332 | + border-color: var(--jp-black); | |
| 333 | + color: var(--jp-white); | |
| 343 | 334 | margin-top: 8px; |
| 344 | 335 | } |
| 345 | 336 | |
| 346 | 337 | /* Hide the widget title's SVG in the Screen Options tab */ |
