diff --git a/assets/css/styles.scss b/assets/css/styles.scss index 05e894ed2..7aa80149a 100644 --- a/assets/css/styles.scss +++ b/assets/css/styles.scss @@ -5,6 +5,8 @@ --err-color: #393939; } +$responsiveWidth: 720px; + ::selection { background-color: var(--ac-color); color: var(--bg-color); @@ -70,6 +72,18 @@ footer { justify-content: space-between; } +@media(max-width: $responsiveWidth){ + header { + display: block; + text-align: center; + + nav { + display: inline-flex; + margin-top: 20px; + } + } +} + nav { a:not(:last-of-type) { margin-right: 15px; @@ -210,7 +224,7 @@ ol li { flex-grow: 1; } -@media (max-width: 720px) { +@media (max-width: $responsiveWidth) { ul, ol { diff --git a/layouts/default.vue b/layouts/default.vue index d3f92bedc..9b9fd5f12 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -11,6 +11,12 @@ @@ -47,16 +53,21 @@ max-width: 1200px; } - header { padding-right: 0; } - nav { + svg { + vertical-align: sub; + } + a { display: inline-block; position: relative; padding: 8px 16px; + fill: white; + color: white; &.nuxt-link-exact-active { color: black; + fill: black; &:before { width: 100%; height: 100% } } diff --git a/pages/settings.vue b/pages/settings.vue new file mode 100644 index 000000000..af9fa97fa --- /dev/null +++ b/pages/settings.vue @@ -0,0 +1,3 @@ + \ No newline at end of file