trotFunky
e08a46af3a
Implement a way for admins to introduce new weeks and set them as the last active one. The last active week is the last one that is accessible to players, and will also prevent the graph from being displayed. Implement arrows for navigating between the weeks in the HTML.
104 lines
1.6 KiB
CSS
104 lines
1.6 KiB
CSS
.top_bar {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
margin-right: 2em;
|
|
}
|
|
|
|
.page_body {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
}
|
|
|
|
.truth_list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 50vw;
|
|
padding-left: 1eM;
|
|
}
|
|
|
|
.individual_truth {
|
|
padding-bottom: 2em;
|
|
}
|
|
|
|
.editor {
|
|
width: calc(100% - 1.25em); /* The width is calculated *inside* the padding, so adjust for it. */
|
|
height: 6eM;
|
|
font-size: large;
|
|
padding: 0.5em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.graph {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-content: center;
|
|
margin-right: 2vw;
|
|
width: 45vw;
|
|
height: auto;
|
|
}
|
|
|
|
.graph > div {
|
|
width: 100%;
|
|
height: 80vh;
|
|
position: sticky;
|
|
top: 25%;
|
|
}
|
|
|
|
.week_change:link, .week_change:visited {
|
|
color: black;
|
|
text-decoration: none;
|
|
transition: all .2s ease-in-out;
|
|
}
|
|
|
|
.week_change:hover, .week_change:focus {
|
|
color: mediumpurple;
|
|
text-shadow: 0 2px 2px slategray;
|
|
}
|
|
|
|
.week_change_hidden {
|
|
padding-left: 0.5eM;
|
|
padding-right: 0.5eM;
|
|
}
|
|
|
|
@media (orientation: portrait) {
|
|
.truth_list {
|
|
width: 60vw;
|
|
}
|
|
|
|
.graph {
|
|
width: 35vw;
|
|
}
|
|
}
|
|
|
|
/* Global styling */
|
|
|
|
hr {
|
|
border: none;
|
|
border-top: 2px solid #9ec5fe;
|
|
color: #9ec5fe;
|
|
overflow: visible;
|
|
text-align: center;
|
|
height: 5px;
|
|
width: 100%;
|
|
}
|
|
|
|
blockquote {
|
|
border-left: 2px solid #9ec5fe;
|
|
padding-left: 1eM;
|
|
margin-left: 1.5eM
|
|
}
|
|
|
|
blockquote > blockquote {
|
|
margin-left: 0.5em;
|
|
}
|
|
|
|
body {
|
|
margin-bottom: 10eM;
|
|
}
|
|
|
|
body > h2 {
|
|
padding-left: 0.25eM;
|
|
}
|