gutenberg-editor-style.css (8229B)
1 :root { 2 --appside-main-color-one: #500ade; 3 --appside-secondary-color: #111d5c; 4 --appside-heading-color: #1c144e; 5 --appside-paragraph-color: #666; 6 --appside-heading-font: 'Poppins', sans-serif; 7 --appside-body-font: 'Poppins', sans-serif; 8 } 9 10 /* Main column width */ 11 .wp-block { 12 max-width: 765px; 13 } 14 15 /* Width of "wide" blocks */ 16 .wp-block[data-align="wide"] { 17 max-width: 765px; 18 } 19 20 /* Width of "full-wide" blocks */ 21 .wp-block[data-align="full"] { 22 max-width: 765px; 23 margin: 0 auto; 24 } 25 26 .block-editor-block-list__layout .block-editor-block-list__block[data-align=full] { 27 margin-left: auto; 28 margin-right: auto; 29 padding: 0; 30 } 31 32 .editor-post-title__block .editor-post-title__input { 33 font-size: 50px; 34 line-height: 60px; 35 font-weight: 700; 36 margin-bottom: 30px; 37 word-break: break-word; 38 font-family: var(--appside-heading-font); 39 } 40 41 42 .wp-block-quote { 43 background-color: #fff; 44 border: 1px solid #f2f2f2; 45 border-left: 5px solid var(--appside-main-color-one) !important; 46 padding: 22px 30px 24px 30px; 47 font-size: 16px; 48 line-height: 26px; 49 margin: 25px 0; 50 quotes: "“" "”"; 51 position: relative; 52 z-index: 0; 53 font-family: var(--appside-body-font); 54 } 55 56 .wp-block-quote:before { 57 position: absolute; 58 left: 30px; 59 top: 30px; 60 font-family: 'fontawesome'; 61 content: "\f10d"; 62 font-size: 35px; 63 line-height: 1; 64 display: inline-block; 65 float: left; 66 margin-right: 20px; 67 color: var(--appside-main-color-one); 68 z-index: -1; 69 } 70 71 .wp-block-quote p { 72 margin-left: 60px; 73 } 74 75 .wp-block-quote cite, 76 .wp-block-quote__citation { 77 display: block; 78 font-size: 18px; 79 font-weight: 500; 80 line-height: 26px; 81 margin-top: 20px; 82 margin-left: 60px; 83 font-family: var(--appside-heading-font); 84 } 85 86 87 .editor-styles-wrapper ul li, 88 .editor-styles-wrapper ol li, 89 .wp-block-freeform.block-library-rich-text__tinymce a, 90 .block-editor-rich-text__editable a { 91 color: var(--appside-paragraph-color); 92 } 93 94 .block-editor-block-list__layout .block-editor-block-list__block[data-align=full] > .block-editor-block-list__block-edit figure { 95 width: 730px; 96 margin: 0 auto; 97 } 98 99 .wp-block-button__link { 100 background-color: var(--appside-main-color-one); 101 border: none; 102 border-radius: 28px; 103 box-shadow: none; 104 color: inherit; 105 cursor: pointer; 106 display: inline-block; 107 font-size: 16px; 108 margin: 0; 109 padding: 12px 24px; 110 text-align: center; 111 text-decoration: none; 112 overflow-wrap: break-word; 113 color: #fff !important; 114 transition: all 500ms; 115 } 116 117 .wp-block-button__link:hover { 118 background-color: var(--appside-secondary-color); 119 } 120 121 .alignleft { 122 float: left; 123 clear: both; 124 margin-right: 20px; 125 } 126 127 .wp-block-cover-image .wp-block-cover-image-text, 128 .wp-block-cover-image .wp-block-cover-text, 129 .wp-block-cover-image h2, 130 .wp-block-cover .wp-block-cover-image-text, 131 .wp-block-cover .wp-block-cover-text, 132 .wp-block-cover h2 { 133 color: #fff; 134 font-size: 2em; 135 line-height: 1.25; 136 z-index: 1; 137 margin-bottom: 0; 138 max-width: 610px; 139 padding: 14px; 140 text-align: center; 141 } 142 143 .has-small-font-size { 144 font-size: 12px; 145 line-height: 22px; 146 } 147 148 .has-regular-font-size { 149 font-size: 16px; 150 line-height: 26px; 151 } 152 153 .has-large-font-size { 154 font-size: 20px; 155 line-height: 30px; 156 } 157 158 .has-pale-pink-background-color { 159 background-color: #f78da7; 160 } 161 162 .has-blue-background-color { 163 background-color: rgb(89, 186, 204); 164 } 165 166 .has-green-background-color { 167 background-color: rgb(88, 173, 105); 168 } 169 170 .has-orange-background-color { 171 background-color: rgb(255, 188, 73); 172 } 173 174 .has-red-background-color { 175 background-color: rgb(226, 87, 76); 176 } 177 178 .wp-block-cover a, .wp-block-cover-image a { 179 color: #fff; 180 } 181 182 .wp-block-gallery.alignfull { 183 max-width: 730px; 184 margin: 0 auto; 185 } 186 187 .wp-block-gallery.alignfull figure { 188 max-width: 100%; 189 } 190 191 .wp-block-quote[style*="text-align:right"], 192 .wp-block-quote[style*="text-align: right"] { 193 border-left: 1px solid #f1f1f1 !important; 194 border-right: 5px solid var(--appside-main-color-one) !important; 195 } 196 197 .wp-block-quote[style*="text-align:right"]:before, 198 .wp-block-quote[style*="text-align: right"]:before { 199 position: absolute; 200 right: 10px; 201 top: 30px; 202 font-family: 'fontawesome'; 203 content: "\f10e"; 204 font-size: 35px; 205 line-height: 1; 206 display: inline-block; 207 float: left; 208 margin-right: 20px; 209 color: var(--appside-main-color-one); 210 z-index: -1; 211 212 } 213 214 .wp-block-quote[style*="text-align:right"], 215 .wp-block-quote[style*="text-align: right"] { 216 padding-right: 90px; 217 } 218 219 .wp-block-pullquote .wp-block-pullquote__citation { 220 display: block; 221 font-size: 16px; 222 font-weight: 500; 223 line-height: 26px; 224 margin-top: 20px; 225 } 226 227 .wp-block-file .wp-block-file__button:hover { 228 opacity: .8; 229 } 230 231 .wp-block-media-text.has-media-on-the-right figure { 232 width: 100%; 233 max-width: 100%; 234 } 235 236 .wp-block-media-text.has-media-on-the-right { 237 max-width: 730px; 238 margin-left: 60px; 239 } 240 241 .wp-block-latest-comments { 242 margin: 0; 243 padding: 0; 244 list-style: none; 245 } 246 247 .wp-block-latest-comments li:before { 248 display: none; 249 } 250 .wp-block-latest-posts { 251 margin: 0 !important; 252 padding: 0 !important; 253 list-style: none; 254 list-style-type: none !important; 255 } 256 257 .wp-block-latest-posts li a { 258 font-size: 18px; 259 line-height: 28px; 260 color: var(--appside-heading-color); 261 } 262 263 .wp-block-latest-posts li { 264 margin-bottom: 15px; 265 } 266 .wp-block-table table { 267 width: auto; 268 } 269 .wp-block-table td, 270 .wp-block-table th { 271 border: 1px solid #e3e3e3; 272 } 273 .editor-styles-wrapper .block-library-list ol, 274 .editor-styles-wrapper .block-library-list ul{ 275 padding-left: 0px; 276 } 277 278 .editor-styles-wrapper h1, 279 .editor-styles-wrapper h2, 280 .editor-styles-wrapper h3, 281 .editor-styles-wrapper h4, 282 .editor-styles-wrapper h5, 283 .editor-styles-wrapper h6{ 284 margin-top: 0 !important; 285 margin-bottom: .5rem !important;; 286 } 287 288 .wp-block-freeform.block-library-rich-text__tinymce blockquote{ 289 border-left-color: var(--appside-main-color-one); 290 } 291 .wp-block-freeform.block-library-rich-text__tinymce blockquote p { 292 font-style: italic; 293 font-size: 18px; 294 } 295 dl dd { 296 margin-left: 20px; 297 } 298 dl dt{ 299 font-weight: 700; 300 } 301 dt{ 302 color: var(--appside-paragraph-color); 303 } 304 .wp-block-freeform.block-library-rich-text__tinymce ol, 305 .wp-block-freeform.block-library-rich-text__tinymce ul { 306 margin: 0; 307 padding: 0; 308 padding-left: 20px; 309 } 310 311 .editor-styles-wrapper ul li ul li ul, 312 .editor-styles-wrapper ol li ul li ul{ 313 list-style-type: square; 314 } 315 .wp-block-freeform.block-library-rich-text__tinymce code { 316 background: transparent; 317 } 318 kbd { 319 background-color: #000; 320 color: #fff; 321 font-size: 16px; 322 border-radius: 3px; 323 line-height: 26px; 324 } 325 326 .mce-item-table, 327 .mce-item-table td, 328 .mce-item-table th, 329 .mce-item-table caption { 330 text-align: left; 331 border: 1px solid #e3e3e3 !important; 332 padding: 8px; 333 color: var(--appside-secondary-color); 334 } 335 .mce-content-body table { 336 border-collapse: collapse; 337 width: 100%; 338 margin-bottom: 10px; 339 } 340 .wp-block-freeform.block-library-rich-text__tinymce dl.wp-caption *, 341 .wp-block-freeform.block-library-rich-text__tinymce dl.wp-caption{ 342 margin-right: 10px; 343 } 344 .wp-block-freeform.block-library-rich-text__tinymce.mce-edit-focus { 345 font-family: var(--appside-body-font); 346 } 347 .wp-block-freeform.block-library-rich-text__tinymce dl.wp-caption .wp-caption-dd { 348 text-align: center; 349 color: var(--appside-paragraph-color); 350 font-family: var(--appside-body-font); 351 } 352 .edit-post-meta-boxes-area #poststuff h2.hndle, 353 .edit-post-meta-boxes-area #poststuff h2.hndle span { 354 font-size: 20px; 355 line-height: 30px; 356 } 357 .csf-field .csf-title h4 { 358 font-size: 16px !important; 359 } 360 .wp-block-freeform.block-library-rich-text__tinymce dl.wp-caption.alignright img { 361 margin-left: 10px; 362 } 363 .is-style-outline .wp-block-button__link { 364 background-color: transparent; 365 border: 1px solid; 366 color: #000 !important; 367 } 368 .is-style-outline .wp-block-button__link:hover{ 369 background-color:var(--appside-main-color-one); 370 color: #fff !important; 371 } 372 .wp-block-table { 373 width: auto; 374 }