personal_site/_sass/thesis_styles.scss
2023-11-09 17:12:34 +00:00

147 lines
2.6 KiB
SCSS

h1.thesis-title {
font-size: 3em !important;
}
main h1, h2, h3 {
font-family: "Source Serif Pro", serif;
font-weight: 300;
font-size: 2.2em !important;
}
// Make figures looks nice
figure {
display: flex;
flex-direction: column;
align-items: center;
margin-inline-start: 0em;
margin-inline-end: 0em;
max-width: 900px !important;
// border-bottom: solid #222 1px;
padding-bottom: 1em;
// border-top: solid #222 1px;
// padding-top: 1em;
}
figure > img, figure > svg {
max-width: 90% !important;
margin-bottom: 2em;
}
figcaption {
// font-style: italic;
// font-size: 0.9em;
max-width: 90%;
}
nav.page-table-of-contents > ul > li:first-child {
display: none;
}
//For the animation that plays in the nav as you scroll
nav.page-table-of-contents {
li li {font-size: 0.9em}
ul {
padding-inline-start: 6px;
}
a {
transition: all 200ms ease-in-out;
color: #000;
font-weight:normal;
}
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%;
}
}