514 lines
15 KiB
CSS
514 lines
15 KiB
CSS
|
||
/**
|
||
* All of the CSS for your public-facing functionality should be
|
||
* included in this file.
|
||
*/
|
||
/**
|
||
* Environment for all styles (variables, additions, etc).
|
||
*/
|
||
/*--------------------------------------------------------------*/
|
||
/* Modules */
|
||
/*--------------------------------------------------------------*/
|
||
/**
|
||
* All of the CSS for your public-facing functionality should be
|
||
* included in this file.
|
||
*/
|
||
/**
|
||
* Environment for all styles (variables, additions, etc).
|
||
*/
|
||
/*--------------------------------------------------------------*/
|
||
/*--------------------------------------------------------------*/
|
||
.is-style-cnvs-heading-numbered {
|
||
--cnvs-heading-numbered-background: #ced4da;
|
||
--cnvs-heading-numbered-color: white;
|
||
--cnvs-heading-numbered-border-radius: 50rem;
|
||
}
|
||
|
||
/*--------------------------------------------------------------*/
|
||
.content,
|
||
.entry-content {
|
||
counter-reset: h2;
|
||
}
|
||
|
||
.content h2,
|
||
.entry-content h2 {
|
||
counter-reset: h3;
|
||
}
|
||
|
||
.content h3,
|
||
.entry-content h3 {
|
||
counter-reset: h4;
|
||
}
|
||
|
||
.content h4,
|
||
.entry-content h4 {
|
||
counter-reset: h5;
|
||
}
|
||
|
||
.content h5,
|
||
.entry-content h5 {
|
||
counter-reset: h6;
|
||
}
|
||
|
||
.is-style-cnvs-heading-numbered {
|
||
display: -webkit-box;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-webkit-box-align: start;
|
||
-ms-flex-align: start;
|
||
align-items: flex-start;
|
||
}
|
||
|
||
.is-style-cnvs-heading-numbered:before {
|
||
margin-left: 0.5em;
|
||
}
|
||
|
||
h2.is-style-cnvs-heading-numbered:before {
|
||
display: -webkit-box;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-webkit-box-pack: center;
|
||
-ms-flex-pack: center;
|
||
justify-content: center;
|
||
-webkit-box-align: center;
|
||
-ms-flex-align: center;
|
||
align-items: center;
|
||
padding-right: 0.15em;
|
||
padding-left: 0.15em;
|
||
height: 1.25em;
|
||
-webkit-box-flex: 0;
|
||
-ms-flex: 0 0 1.25em;
|
||
flex: 0 0 1.25em;
|
||
border-radius: var(--cnvs-heading-numbered-border-radius);
|
||
background: var(--cnvs-heading-numbered-background);
|
||
color: var(--cnvs-heading-numbered-color);
|
||
counter-increment: h2;
|
||
content: counter(h2);
|
||
}
|
||
|
||
h3.is-style-cnvs-heading-numbered:before {
|
||
counter-increment: h3;
|
||
content: counter(h3);
|
||
}
|
||
|
||
h2.is-style-cnvs-heading-numbered ~ h3.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h2) "." counter(h3);
|
||
}
|
||
|
||
h4.is-style-cnvs-heading-numbered:before {
|
||
counter-increment: h4;
|
||
content: counter(h4);
|
||
}
|
||
|
||
h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h3) "." counter(h4);
|
||
}
|
||
|
||
h2.is-style-cnvs-heading-numbered ~ h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h2) "." counter(h3) "." counter(h4);
|
||
}
|
||
|
||
h5.is-style-cnvs-heading-numbered:before {
|
||
counter-increment: h5;
|
||
content: counter(h5);
|
||
}
|
||
|
||
h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h4) "." counter(h5);
|
||
}
|
||
|
||
h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h3) "." counter(h4) "." counter(h5);
|
||
}
|
||
|
||
h2.is-style-cnvs-heading-numbered ~ h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5);
|
||
}
|
||
|
||
h6.is-style-cnvs-heading-numbered:before {
|
||
counter-increment: h6;
|
||
content: counter(h6);
|
||
}
|
||
|
||
h5.is-style-cnvs-heading-numbered ~ h6.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h5) "." counter(h6);
|
||
}
|
||
|
||
h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered ~ h6.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h4) "." counter(h5) "." counter(h6);
|
||
}
|
||
|
||
h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered ~ h6.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h3) "." counter(h4) "." counter(h5) "." counter(h6);
|
||
}
|
||
|
||
h2.is-style-cnvs-heading-numbered ~ h3.is-style-cnvs-heading-numbered ~ h4.is-style-cnvs-heading-numbered ~ h5.is-style-cnvs-heading-numbered ~ h6.is-style-cnvs-heading-numbered:before {
|
||
content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6);
|
||
}
|
||
|
||
/**
|
||
* All of the CSS for your public-facing functionality should be
|
||
* included in this file.
|
||
*/
|
||
/**
|
||
* Environment for all styles (variables, additions, etc).
|
||
*/
|
||
/*--------------------------------------------------------------*/
|
||
/*--------------------------------------------------------------*/
|
||
[class*="is-style-cnvs-list-styled"] {
|
||
--cnvs-list-styled-line-height: 1.5;
|
||
--cnvs-list-styled-font-size: 1rem;
|
||
--cnvs-list-styled-children-font-size: 0.875rem;
|
||
--cnvs-list-styled-ul-box-background: #ced4da;
|
||
--cnvs-list-styled-ul-box-border-radius: 0;
|
||
--cnvs-list-styled-ul-positive-box-color: #28a745;
|
||
--cnvs-list-styled-ul-negative-box-color: #dc3545;
|
||
--cnvs-list-styled-ol-box-color: #495057;
|
||
--cnvs-list-styled-ol-box-font-size: 0.875rem;
|
||
--cnvs-list-styled-ol-box-font-weight: 600;
|
||
--cnvs-list-styled-ol-box-background-color: #e9ecef;
|
||
--cnvs-list-styled-ol-box-border-radius: 50%;
|
||
--cnvs-list-styled-ol-positive-box-background-color: #28a745;
|
||
--cnvs-list-styled-ol-negative-box-background-color: #dc3545;
|
||
--cnvs-list-styled-ol-positive-box-color: #fff;
|
||
--cnvs-list-styled-ol-negative-box-color: #fff;
|
||
}
|
||
|
||
/*--------------------------------------------------------------*/
|
||
.is-style-cnvs-list-styled,
|
||
.is-style-cnvs-list-styled-positive,
|
||
.is-style-cnvs-list-styled-negative {
|
||
line-height: var(--cnvs-list-styled-line-height);
|
||
list-style: none;
|
||
font-size: var(--cnvs-list-styled-font-size);
|
||
}
|
||
|
||
.is-style-cnvs-list-styled:not(:first-child),
|
||
.is-style-cnvs-list-styled-positive:not(:first-child),
|
||
.is-style-cnvs-list-styled-negative:not(:first-child) {
|
||
margin-top: 1.5rem;
|
||
}
|
||
|
||
.is-style-cnvs-list-styled:not(:last-child),
|
||
.is-style-cnvs-list-styled-positive:not(:last-child),
|
||
.is-style-cnvs-list-styled-negative:not(:last-child) {
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
|
||
.is-style-cnvs-list-styled li:not(:first-child),
|
||
.is-style-cnvs-list-styled-positive li:not(:first-child),
|
||
.is-style-cnvs-list-styled-negative li:not(:first-child) {
|
||
margin-top: 0.5rem;
|
||
}
|
||
|
||
.is-style-cnvs-list-styled > li,
|
||
.is-style-cnvs-list-styled-positive > li,
|
||
.is-style-cnvs-list-styled-negative > li {
|
||
position: relative;
|
||
padding-right: 2.5rem;
|
||
}
|
||
|
||
.is-style-cnvs-list-styled > li:before,
|
||
.is-style-cnvs-list-styled-positive > li:before,
|
||
.is-style-cnvs-list-styled-negative > li:before {
|
||
display: -webkit-box;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
-webkit-box-align: center;
|
||
-ms-flex-align: center;
|
||
align-items: center;
|
||
-webkit-box-pack: center;
|
||
-ms-flex-pack: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled,
|
||
ol.is-style-cnvs-list-styled-positive,
|
||
ol.is-style-cnvs-list-styled-negative {
|
||
counter-reset: ol;
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled > li:before,
|
||
ol.is-style-cnvs-list-styled-positive > li:before,
|
||
ol.is-style-cnvs-list-styled-negative > li:before {
|
||
width: 1.5rem;
|
||
height: 1.5rem;
|
||
content: counter(ol);
|
||
counter-increment: ol;
|
||
color: var(--cnvs-list-styled-ol-box-color);
|
||
font-size: var(--cnvs-list-styled-ol-box-font-size);
|
||
font-weight: var(--cnvs-list-styled-ol-box-font-weight);
|
||
background-color: var(--cnvs-list-styled-ol-box-background-color);
|
||
border-radius: var(--cnvs-list-styled-ol-box-border-radius);
|
||
line-height: 1;
|
||
}
|
||
|
||
ul.is-style-cnvs-list-styled > li:before {
|
||
content: '';
|
||
width: 0.25rem;
|
||
height: 0.25rem;
|
||
margin-top: 0.75rem;
|
||
right: 1rem;
|
||
background: var(--cnvs-list-styled-ul-box-background);
|
||
border-radius: var(--cnvs-list-styled-ul-box-border-radius);
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled ul,
|
||
ol.is-style-cnvs-list-styled ol,
|
||
ul.is-style-cnvs-list-styled ol,
|
||
ul.is-style-cnvs-list-styled ul {
|
||
margin-top: 0.5rem;
|
||
margin-bottom: 0.5rem;
|
||
padding-right: 0;
|
||
font-size: var(--cnvs-list-styled-children-font-size);
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled ul > li:not(:first-child),
|
||
ol.is-style-cnvs-list-styled ol > li:not(:first-child),
|
||
ul.is-style-cnvs-list-styled ol > li:not(:first-child),
|
||
ul.is-style-cnvs-list-styled ul > li:not(:first-child) {
|
||
margin-top: 0.25rem;
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled-positive > li:before {
|
||
background-color: var(--cnvs-list-styled-ol-positive-box-background-color);
|
||
color: var(--cnvs-list-styled-ol-positive-box-color);
|
||
}
|
||
|
||
ol.is-style-cnvs-list-styled-negative > li:before {
|
||
background-color: var(--cnvs-list-styled-ol-negative-box-background-color);
|
||
color: var(--cnvs-list-styled-ol-negative-box-color);
|
||
}
|
||
|
||
ul.is-style-cnvs-list-styled-positive > li:before,
|
||
ul.is-style-cnvs-list-styled-negative > li:before {
|
||
width: 1.5rem;
|
||
font-family: 'canvas-icons';
|
||
}
|
||
|
||
ul.is-style-cnvs-list-styled-positive > li:before {
|
||
content: "\e912";
|
||
color: var(--cnvs-list-styled-ul-positive-box-color);
|
||
}
|
||
|
||
ul.is-style-cnvs-list-styled-negative > li:before {
|
||
content: "\e913";
|
||
color: var(--cnvs-list-styled-ul-negative-box-color);
|
||
}
|
||
|
||
/**
|
||
* All of the CSS for your public-facing functionality should be
|
||
* included in this file.
|
||
*/
|
||
/**
|
||
* Environment for all styles (variables, additions, etc).
|
||
*/
|
||
/*--------------------------------------------------------------*/
|
||
/*--------------------------------------------------------------*/
|
||
.has-drop-cap {
|
||
--cnvs-drop-cap-color: black;
|
||
--cnvs-drop-cap-font-size: 2.5rem;
|
||
--cnvs-drop-cap-dark-background: black;
|
||
--cnvs-drop-cap-dark-color: #fff;
|
||
--cnvs-drop-cap-light-background: #f8f9fa;
|
||
--cnvs-drop-cap-light-color: inherit;
|
||
--cnvs-drop-cap-bordered-width: 1px;
|
||
--cnvs-drop-cap-bordered-color: #dee2e6;
|
||
}
|
||
|
||
.is-style-cnvs-paragraph-callout {
|
||
--cnvs-callout-font-size: 1.25rem;
|
||
--cnvs-callout-font-weight: 600;
|
||
}
|
||
|
||
/*--------------------------------------------------------------*/
|
||
.content .has-drop-cap.is-cnvs-dropcap-simple:after,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bordered:after,
|
||
.content .has-drop-cap.is-cnvs-dropcap-border-right:after,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-light:after,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-dark:after,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-simple:after,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bordered:after,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-border-right:after,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-light:after,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-dark:after {
|
||
content: "";
|
||
display: table;
|
||
clear: both;
|
||
padding-top: 14px;
|
||
}
|
||
|
||
.content .has-drop-cap.is-cnvs-dropcap-simple:first-letter,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bordered:first-letter,
|
||
.content .has-drop-cap.is-cnvs-dropcap-border-right:first-letter,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-light:first-letter,
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-dark:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-simple:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bordered:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-border-right:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-light:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-dark:first-letter {
|
||
display: block;
|
||
float: right;
|
||
margin-top: 0.5rem;
|
||
margin-left: 2rem;
|
||
margin-bottom: 1rem;
|
||
color: var(--cnvs-drop-cap-color);
|
||
font-size: var(--cnvs-drop-cap-font-size);
|
||
line-height: 1;
|
||
text-align: center;
|
||
}
|
||
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-dark:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-dark:first-letter {
|
||
padding: 0.5rem 1rem;
|
||
background: var(--cnvs-drop-cap-dark-background);
|
||
color: var(--cnvs-drop-cap-dark-color);
|
||
}
|
||
|
||
.content .has-drop-cap.is-cnvs-dropcap-bg-light:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bg-light:first-letter {
|
||
padding: 0.5rem 1rem;
|
||
background: var(--cnvs-drop-cap-light-background);
|
||
color: var(--cnvs-drop-cap-light-color);
|
||
}
|
||
|
||
.content .has-drop-cap.is-cnvs-dropcap-bordered:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-bordered:first-letter {
|
||
margin-top: 0.25rem;
|
||
padding: 0.5rem 1rem;
|
||
border: var(--cnvs-drop-cap-bordered-width) solid var(--cnvs-drop-cap-bordered-color);
|
||
}
|
||
|
||
.content .has-drop-cap.is-cnvs-dropcap-border-right:first-letter,
|
||
.entry-content .has-drop-cap.is-cnvs-dropcap-border-right:first-letter {
|
||
padding-left: 2rem;
|
||
border-left: var(--cnvs-drop-cap-bordered-width) solid var(--cnvs-drop-cap-bordered-color);
|
||
border-radius: 0;
|
||
}
|
||
|
||
.content .is-style-cnvs-paragraph-callout,
|
||
.entry-content .is-style-cnvs-paragraph-callout {
|
||
font-size: var(--cnvs-callout-font-size);
|
||
font-weight: var(--cnvs-callout-font-weight);
|
||
}
|
||
|
||
/**
|
||
* All of the CSS for your public-facing functionality should be
|
||
* included in this file.
|
||
*/
|
||
/**
|
||
* Environment for all styles (variables, additions, etc).
|
||
*/
|
||
/*--------------------------------------------------------------*/
|
||
/*--------------------------------------------------------------*/
|
||
.wp-block-separator {
|
||
--cnvs-wp-block-separator-color: #dee2e6;
|
||
}
|
||
|
||
/*--------------------------------------------------------------*/
|
||
.content .wp-block-separator:not(.has-text-color),
|
||
.entry-content .wp-block-separator:not(.has-text-color) {
|
||
color: var(--cnvs-wp-block-separator-color);
|
||
}
|
||
|
||
.content .wp-block-separator.is-style-cnvs-separator-double, .content .wp-block-separator.is-style-cnvs-separator-dotted, .content .wp-block-separator.is-style-cnvs-separator-dashed,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-double,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dotted,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dashed {
|
||
position: relative;
|
||
display: block;
|
||
height: 10px;
|
||
background-color: transparent !important;
|
||
border-bottom: none !important;
|
||
}
|
||
|
||
.content .wp-block-separator.is-style-cnvs-separator-double:after, .content .wp-block-separator.is-style-cnvs-separator-dotted:after, .content .wp-block-separator.is-style-cnvs-separator-dashed:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-double:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dotted:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dashed:after {
|
||
content: '';
|
||
display: block;
|
||
position: absolute;
|
||
top: 50%;
|
||
right: 0;
|
||
left: 0;
|
||
margin-top: -1px;
|
||
border-bottom: 2px solid;
|
||
}
|
||
|
||
.content .wp-block-separator.is-style-cnvs-separator-double:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-double:after {
|
||
border-bottom-width: 4px !important;
|
||
border-bottom-style: double !important;
|
||
margin-top: -2px;
|
||
}
|
||
|
||
.content .wp-block-separator.is-style-cnvs-separator-dotted:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dotted:after {
|
||
border-bottom-style: dotted !important;
|
||
}
|
||
|
||
.content .wp-block-separator.is-style-cnvs-separator-dashed:after,
|
||
.entry-content .wp-block-separator.is-style-cnvs-separator-dashed:after {
|
||
border-bottom-style: dashed !important;
|
||
}
|
||
|
||
.amp-wp-article-content [class^="cnvs-icon-"],
|
||
.amp-wp-article-content [class*=" cnvs-icon-"] {
|
||
font-style: normal;
|
||
font-weight: normal;
|
||
font-variant: normal;
|
||
text-transform: none;
|
||
line-height: 1;
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
}
|
||
|
||
.amp-wp-article-content .cnvs-icon-like:before {
|
||
content: '♡';
|
||
}
|
||
|
||
.amp-wp-article-content .cnvs-icon-comment:before {
|
||
content: '⚆';
|
||
}
|
||
|
||
.amp-wp-article-content .cnvs-alert {
|
||
border-right: #ced4da 2px solid;
|
||
position: relative;
|
||
padding: 0.5rem 1rem;
|
||
margin-bottom: 1rem;
|
||
background: #f8f9fa;
|
||
font-size: 0.875rem;
|
||
}
|
||
|
||
.amp-wp-article-content .cnvs-alert .cnvs-close {
|
||
display: none;
|
||
}
|
||
|
||
.amp-wp-article-content .cnvs-button {
|
||
background: black;
|
||
display: inline-block;
|
||
font-weight: 400;
|
||
text-align: center;
|
||
white-space: nowrap;
|
||
vertical-align: middle;
|
||
padding: 0.5rem 0.75rem;
|
||
font-size: 1rem;
|
||
line-height: 1.5;
|
||
border-radius: 0.5rem;
|
||
text-decoration: none;
|
||
color: #fff;
|
||
}
|
||
|
||
.amp-wp-article-content ul.is-style-cnvs-list-styled-positive > li:before {
|
||
content: '✓';
|
||
}
|
||
|
||
.amp-wp-article-content ul.is-style-cnvs-list-styled-negative > li:before {
|
||
content: '×';
|
||
}
|