diff --git a/styles/sass/style.scss b/styles/sass/style.scss index a1be5d2..e9e3da7 100644 --- a/styles/sass/style.scss +++ b/styles/sass/style.scss @@ -43,11 +43,19 @@ input[type=number] { #content { width: 100%; height: 100%; - display: flex; - flex-direction: column; + + display: grid; + grid-template-areas: + "nav nav" + "challenge submissions"; + grid-template-columns: 30em auto; + grid-template-rows: min-content auto; + overflow: hidden; nav { + grid-area: nav; + --bg: #{$fg}; --fg: #{$bg}; background: var(--bg); @@ -98,16 +106,12 @@ input[type=number] { } } - & > div:first-of-type { - display: flex; - height: 100%; - & > :first-child { - min-width: 40em; - padding: 1em; - } - & > * { - overflow: scroll; - } + & > div { + overflow: scroll; + } + + #challenge { + padding: 1em; } } @@ -116,9 +120,8 @@ input[type=number] { } #submissions { - display: flex; - flex-direction: column; - height: calc(100% - 2em); + grid-area: submissions; + background: rgba(0, 0, 0, 0.125); $gap: 0.5em; padding: $gap; diff --git a/templates/index.html.tera b/templates/index.html.tera index 7272dd5..0242ca7 100644 --- a/templates/index.html.tera +++ b/templates/index.html.tera @@ -64,92 +64,90 @@ -
- {%- for word in subline -%} - {%- if word.dictionary -%} - - {%- endif -%} - {% for segment in word.text -%} - {{ segment.kanji }} - {%- endfor -%} - {%- if word.dictionary -%} - - {%- endif -%} - {%- endfor -%} -
- {% endfor %} - {% endfor %} -- Translation - {% if content.translation.author %}by {{ content.translation.author }}{% endif %} - {% if content.translation.site %} via - {% if content.translation.site.link %} - {{ content.translation.site.name }} - {% else %} - {{ content.translation.site.name }} - {% endif %} - {%- endif -%} -
- {%- endif -%} - {%- if content.suggester -%} -This challenge was suggested by {{ content.suggester }} using the -h suggest
command.
+ {%- for word in subline -%} + {%- if word.dictionary -%} + + {%- endif -%} + {% for segment in word.text -%} + {{ segment.kanji }} + {%- endfor -%} + {%- if word.dictionary -%} + + {%- endif -%} + {%- endfor -%} +
{% endfor %} -+ Translation + {% if content.translation.author %}by {{ content.translation.author }}{% endif %} + {% if content.translation.site %} via + {% if content.translation.site.link %} + {{ content.translation.site.name }} + {% else %} + {{ content.translation.site.name }} + {% endif %} + {%- endif -%} +
+ {%- endif -%} + {%- if content.suggester -%} +This challenge was suggested by {{ content.suggester }} using the -h suggest
command.