ru-se.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

_editor.scss (3235B)


      1 /**
      2 * Editor Post Title
      3 * - Needs a special styles
      4 */
      5 
      6 // Post title style
      7 .wp-block.editor-post-title__block {
      8 	border-bottom: 3px solid var(--global--color-border);
      9 	padding-bottom: calc(2 * var(--global--spacing-vertical));
     10 	margin-bottom: calc(3 * var(--global--spacing-vertical));
     11 	max-width: var(--responsive--alignwide-width);
     12 
     13 	.editor-post-title__input {
     14 		color: var(--global--color-secondary);
     15 		font-family: var(--heading--font-family);
     16 		font-size: var(--global--font-size-page-title);
     17 		font-weight: var(--heading--font-weight-page-title);
     18 		line-height: var(--heading--line-height-h1);
     19 	}
     20 }
     21 
     22 // Editor UI font styles
     23 .wp-block.block-editor-default-block-appender > textarea {
     24 	font-family: var(--global--font-secondary);
     25 	font-size: var(--global--font-size-md);
     26 }
     27 
     28 // Gutenberg text color options
     29 .has-primary-color[class] {
     30 	color: var(--global--color-primary);
     31 }
     32 
     33 .has-secondary-color[class] {
     34 	color: var(--global--color-secondary);
     35 }
     36 
     37 // Gutenberg background-color options
     38 .has-background {
     39 
     40 	a,
     41 	p,
     42 	h1,
     43 	h2,
     44 	h3,
     45 	h4,
     46 	h5,
     47 	h6 {
     48 		color: currentColor;
     49 	}
     50 }
     51 
     52 .has-primary-background-color[class] {
     53 	background-color: var(--global--color-primary);
     54 	color: var(--global--color-background);
     55 }
     56 
     57 .has-secondary-background-color[class] {
     58 	background-color: var(--global--color-secondary);
     59 	color: var(--global--color-background);
     60 }
     61 
     62 .has-white-background-color[class] {
     63 	background-color: var(--global--color-white);
     64 	color: var(--global--color-secondary);
     65 }
     66 
     67 .has-black-background-color[class] {
     68 	background-color: var(--global--color-black);
     69 	color: var(--global--color-primary);
     70 }
     71 
     72 // Spacing Overrides
     73 [data-block] {
     74 	margin-top: var(--global--spacing-vertical);
     75 	margin-bottom: var(--global--spacing-vertical);
     76 }
     77 
     78 // Block Alignments
     79 .wp-block {
     80 
     81 	// Gutenberg injects a rule that limits the max width of .wp-block to 580px
     82 	// This line overrides it to use the responsive spacing rules for default width content
     83 	max-width: var(--responsive--aligndefault-width);
     84 
     85 	// Use the theme's max-width for wide alignment.
     86 	&[data-align="wide"],
     87 	&.alignwide {
     88 		max-width: var(--responsive--alignwide-width);
     89 	}
     90 
     91 	&[data-align="full"],
     92 	&.alignfull {
     93 		max-width: none;
     94 	}
     95 }
     96 
     97 .alignleft {
     98 	margin: 0;
     99 	margin-right: var(--global--spacing-horizontal);
    100 }
    101 
    102 .alignright {
    103 	margin: 0;
    104 	margin-left: var(--global--spacing-horizontal);
    105 }
    106 
    107 // Drop cap
    108 .has-drop-cap:not(:focus)::first-letter {
    109 	font-family: var(--heading--font-family);
    110 	font-weight: var(--heading--font-weight);
    111 	line-height: 0.66;
    112 	text-transform: uppercase;
    113 	font-style: normal;
    114 	float: left;
    115 	margin: 0.1em 0.1em 0 0;
    116 	font-size: calc(1.2 * var(--heading--font-size-h1));
    117 }
    118 
    119 @media only screen and (min-width: 482px) {
    120 
    121 	.wp-block[data-align="left"] > * {
    122 		max-width: 290px;
    123 		margin-right: var(--global--spacing-horizontal);
    124 	}
    125 
    126 	.wp-block[data-align="right"] > * {
    127 		max-width: 290px;
    128 		margin-left: var(--global--spacing-horizontal);
    129 	}
    130 }
    131 
    132 // Remove the border of blockquotes inside the classic block.
    133 .wp-block-freeform.block-library-rich-text__tinymce blockquote {
    134 	border: none;
    135 }
    136 
    137 // Adjust the position of the quote symbol for blockquotes inside the classic block.
    138 .wp-block-freeform.block-library-rich-text__tinymce blockquote:before {
    139 	left: 5px;
    140 }