(Abstract colours; don't use serif fonts.) |
(Open first interview upon page load.) |
||
Line 42: | Line 42: | ||
object-fit: contain; | object-fit: contain; | ||
opacity: 0.4; | opacity: 0.4; | ||
+ | } | ||
+ | |||
+ | .button-frame > div:first-child > img { | ||
+ | opacity: 1; | ||
} | } | ||
Line 66: | Line 70: | ||
#background > section, #interviews > section { | #background > section, #interviews > section { | ||
display: none; | display: none; | ||
+ | } | ||
+ | |||
+ | #background > section:first-child, #interviews > section:first-child { | ||
+ | display: block; | ||
} | } |
Revision as of 00:42, 2 November 2017
.interviewee {
color: var(--dark-text-color);
}
.interviewer {
color: var(--medium-text-color); font-weigth: bold;
}
.quoteLeft {
background-color: var(--dark-background-color); color: var(--light-text-color); float: left; font-size: large; margin: 10px 20px 10px 0; padding: 10px 20px; text-align: unset; width: 25%;
}
.quoteRight {
background-color: var(--dark-background-color); color: var(--light-text-color); float: right; font-size: large; margin: 10px 0px 10px 20px; padding: 10px 20px; text-align: unset; width: 25%;
}
.button-frame {
cursor: pointer; display: block; flex: 0 1 0; min-height: 150px; min-width: 150px;
}
.button-frame > img{
max-height: 150px; object-fit: contain; opacity: 0.4;
}
.button-frame > div:first-child > img {
opacity: 1;
}
.button-frame:hover > img {
opacity: 1;
}
- portraits {
align-items: center; display: flex; flex-flow: row wrap; justify-content: space-around;
}
- portraits > figure {
flex: 0 1 auto; width: 30%; margin: 0 10px; overflow: hidden; padding: 0; min-width: 200px;
}
- background > section, #interviews > section {
display: none;
}
- background > section:first-child, #interviews > section:first-child {
display: block;
}