ds-site/Resources/Public/Css/elements.css

100 lines
1.5 KiB
CSS
Raw Normal View History

/* Elements */
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--ds-font-family-sans-serif);
letter-spacing: 2px;
word-spacing: 2px;
font-weight: 300;
line-height: 2.8rem;
margin: 0;
padding-top: calc(var(--ds-spacer) * 3);
padding-bottom: calc(var(--ds-spacer) * 1);
}
h1 small a,
h2 small a,
h3 small a,
h4 small a,
h5 small a,
h6 small a {
display: none;
color: var(--ds-gray-500);
}
h1 &:hover small a ,
h2 &:hover small a ,
h3 &:hover small a ,
h4 &:hover small a ,
h5 &:hover small a ,
h6 &:hover small a {
display: inline;
}
p {
line-height: 1.5em;
margin-top: 0;
margin-bottom: 1rem;
}
figure {
text-align: center;
padding: var(--ds-spacer);
}
figure figcaption {
text-align: start;
padding-top: var(--ds-spacer);
}
strong {
color: var(--ds-white);
}
blockquote {
border: none;
border-left: dashed calc(var(--ds-spacer) / 4);
padding: var(--ds-spacer);
margin-top: calc(var(--ds-spacer) * 2);
border-color: var(--ds-white);
}
blockquote &:before {
content: "Quote";
}
img {
max-width: 100%;
height: auto;
}
ul {
padding-inline-start: 20px;
list-style-type: square;
}
ol {
padding-inline-start: 50px;
list-style-type: decimal-leading-zero;
}
li {
padding-bottom: calc(var(--ds-spacer) / 2);
padding-top: calc(var(--ds-spacer) / 2);
}
a,
a:visited {
color: var(--ds-blue-dark);
text-decoration: underline;
}
a:hover {
color: var(--ds-blue);
text-decoration: underline;
}
video {
max-width: 100%;
}