Refactor list styles
Add blockquote styles
This commit is contained in:
@@ -39,28 +39,41 @@
|
|||||||
|
|
||||||
.content ul,
|
.content ul,
|
||||||
.content ol {
|
.content ol {
|
||||||
|
counter-reset: li;
|
||||||
margin-bottom: var(--space-sm);
|
margin-bottom: var(--space-sm);
|
||||||
padding-left: var(--space-sm);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.content ul li,
|
.content ul li,
|
||||||
.content ol li {
|
.content ol li {
|
||||||
|
counter-increment: li;
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 0 0 var(--space-xs) var(--space-sm);
|
margin-bottom: var(--space-xs);
|
||||||
|
padding-left: var(--space-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.content ul li:before,
|
||||||
|
.content ol li:before {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content ul li:before {
|
.content ul li:before {
|
||||||
content: '';
|
content: "";
|
||||||
position: absolute;
|
|
||||||
left: calc(var(--space-xxs) - (var(--bullet-size) / 2));
|
|
||||||
top: calc(var(--base-line-height) / 2 * 1rem);
|
top: calc(var(--base-line-height) / 2 * 1rem);
|
||||||
background-color: var(--color-dark-blue);
|
background-color: var(--color-light-blue);
|
||||||
width: var(--bullet-size);
|
width: var(--bullet-size);
|
||||||
height: var(--bullet-size);
|
height: var(--bullet-size);
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.content ol li:before {
|
||||||
|
content: counter(li) ".";
|
||||||
|
top: 0;
|
||||||
|
color: var(--color-light-blue);
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
.content a {
|
.content a {
|
||||||
color: var(--color-light-blue);
|
color: var(--color-light-blue);
|
||||||
transition: box-shadow var(--transition-md) ease-out;
|
transition: box-shadow var(--transition-md) ease-out;
|
||||||
@@ -124,6 +137,12 @@
|
|||||||
margin: var(--space-sm) 0 0;
|
margin: var(--space-sm) 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.content .wp-block-quote {
|
||||||
|
border-left: var(--space-xxs) solid var(--color-light-blue);
|
||||||
|
margin-bottom: var(--space-sm);
|
||||||
|
padding: var(--space-sm) var(--space-md);
|
||||||
|
}
|
||||||
|
|
||||||
.content table {
|
.content table {
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
table-layout: fixed;
|
table-layout: fixed;
|
||||||
|
|||||||
@@ -68,7 +68,7 @@
|
|||||||
--body-font-family: 'Open Sans', sans-serif;
|
--body-font-family: 'Open Sans', sans-serif;
|
||||||
--link-focus: 0 0.1rem 0 0 var(--color-light-blue);
|
--link-focus: 0 0.1rem 0 0 var(--color-light-blue);
|
||||||
--image-focus: 0 0 0 0.2rem #fff, 0 0 0 0.4rem var(--color-light-blue);
|
--image-focus: 0 0 0 0.2rem #fff, 0 0 0 0.4rem var(--color-light-blue);
|
||||||
--bullet-size: 0.334rem;
|
--bullet-size: 0.45rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@custom-media --viewport-sm (min-width: 30rem);
|
@custom-media --viewport-sm (min-width: 30rem);
|
||||||
|
|||||||
Reference in New Issue
Block a user