You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
1.1 KiB
CSS
99 lines
1.1 KiB
CSS
body {
|
|
font-size: 1.75rem;
|
|
font-family: serif;
|
|
}
|
|
|
|
|
|
pre {
|
|
font-size: 1.4rem;
|
|
}
|
|
|
|
nav, nav * {
|
|
font-size: 1rem !important;
|
|
background-color: #ff8d00;
|
|
color: white!important;
|
|
}
|
|
|
|
|
|
header.project--header {
|
|
background-color: #ff8d00;
|
|
|
|
}
|
|
|
|
a {
|
|
color: #ff8d00;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
a:after {
|
|
content: '';
|
|
}
|
|
|
|
|
|
h2, h3 {
|
|
font-size: 2.5rem;
|
|
}
|
|
|
|
|
|
main.project--content {
|
|
display: block;
|
|
}
|
|
|
|
main.project--content > * {
|
|
display: block;
|
|
margin-inline: auto;
|
|
max-width: 80ch;
|
|
}
|
|
|
|
video, img {
|
|
max-height: 80vh;
|
|
max-width: 100%;
|
|
object-fit: contain;
|
|
}
|
|
|
|
#svg-container {
|
|
|
|
position: fixed;
|
|
z-index: 200;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
|
|
pointer-events: none;
|
|
|
|
}
|
|
|
|
.drawing {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
pointer-events: all;
|
|
}
|
|
|
|
.drawing:hover {
|
|
rotate: 1turn;
|
|
transition: rotate 0.5s ease-out;
|
|
}
|
|
|
|
@keyframes grow {
|
|
0% {
|
|
scale: 0.1;
|
|
}
|
|
100% {
|
|
scale: 1;
|
|
}
|
|
}
|
|
|
|
.destination svg path {
|
|
/* This section calls the slideInFromLeft animation we defined above */
|
|
animation: 1s cubic-bezier(0.68, -0.6, 0.32, 1.6) 0s 1 grow;
|
|
}
|
|
|