mirror of
https://github.com/TomHodson/tomhodson.github.com.git
synced 2025-06-26 10:01:18 +02:00
133 lines
2.4 KiB
SCSS
133 lines
2.4 KiB
SCSS
|
|
// Make figures looks nice
|
|
figure {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin-inline-start: 0em;
|
|
margin-inline-end: 0em;
|
|
|
|
max-width: 900px;
|
|
|
|
// border-bottom: solid #222 1px;
|
|
padding-bottom: 1em;
|
|
|
|
// border-top: solid #222 1px;
|
|
// padding-top: 1em;
|
|
}
|
|
|
|
//clamp the size of the images on the blog roll
|
|
figure.blogroll > img, figure.blogroll > svg {
|
|
max-height: 300px;
|
|
}
|
|
|
|
figure > img, figure > svg {
|
|
max-width: 90% !important;
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
figcaption {
|
|
// font-style: italic;
|
|
// font-size: 0.9em;
|
|
max-width: 90%;
|
|
}
|
|
|
|
// For the table of contents, should probably put this in a container
|
|
|
|
//For the animation that plays in the nav as you scroll
|
|
nav.page-table-of-contents a {
|
|
transition: all 200ms ease-in-out;
|
|
color: #000;
|
|
font-weight:normal;
|
|
}
|
|
|
|
nav.page-table-of-contents li.active > a {
|
|
color: #000!important;
|
|
font-weight:bold;
|
|
}
|
|
|
|
// modify the spacing of the various levels
|
|
li {
|
|
margin-bottom: 0.2em;
|
|
}
|
|
|
|
main > ul > li {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
main > ul > ul > li {
|
|
margin-top: 0.5em;
|
|
}
|
|
|
|
// Pull the citations a little closer in to the previous word
|
|
span.citation {
|
|
margin-left: -1em;
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: darkblue;
|
|
}
|
|
}
|
|
|
|
// Mess with the formatting of the bibliography
|
|
div.csl-entry {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
div.csl-entry a {
|
|
// text-decoration: none;
|
|
text-decoration: none;
|
|
color: darkblue;
|
|
}
|
|
|
|
div.csl-entry div {
|
|
display: inline;
|
|
}
|
|
|
|
header li {
|
|
list-style: none;
|
|
a {
|
|
text-decoration: none;
|
|
margin-bottom: 0.5em;
|
|
display:block;
|
|
|
|
}
|
|
}
|
|
|
|
nav.overall-table-of-contents > ul {
|
|
padding-inline-start: 0px;
|
|
|
|
|
|
> li {
|
|
list-style: none;
|
|
margin-top: 1em;
|
|
}
|
|
}
|
|
|
|
// Page header
|
|
div#page-header {
|
|
//make the header sticky, I don't really like how this looks but it's fun to play with
|
|
// position: sticky;
|
|
// top: 0px;
|
|
// background: white;
|
|
// z-index: 10;
|
|
// width: 100%;
|
|
p { margin-block-end: 0px;}
|
|
}
|
|
|
|
|
|
@media
|
|
only screen and (max-width: $horizontal_breakpoint),
|
|
only screen and (max-height: $vertical_breakpoint)
|
|
{
|
|
|
|
//make the figures go to 100% and use italics to denote the figure captions
|
|
figure > img, figure > svg {
|
|
max-width: 100% !important;
|
|
}
|
|
|
|
figcaption {
|
|
font-style: italic;
|
|
width: 100%;
|
|
}
|
|
}
|