diff --git a/base/static/css/main.css b/base/static/css/main.css index c329a18..74e4488 100644 --- a/base/static/css/main.css +++ b/base/static/css/main.css @@ -17,7 +17,7 @@ form a[role="button"] { width: 100%; } -i.owner { +i.owner, .gold { color: var(--pico-color-amber-200); } @@ -25,7 +25,7 @@ i.owner { display: none; } -a.group { +a.group, a.running { text-decoration: none; } @@ -77,11 +77,6 @@ article.message { } #hero { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; background: radial-gradient( circle 50vh at calc(100vw - 4rem) 50%, var(--pico-primary-background), @@ -90,18 +85,41 @@ article.message { color-mix(in hsl, var(--pico-primary-background) 30%, var(--pico-background-color)) 60%, color-mix(in hsl, var(--pico-primary-background) 10%, var(--pico-background-color)) 80%, var(--pico-background-color)); - display: grid; - align-items: center; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + height: 100%; + overflow-y: auto; padding: 4rem; - .big-logo { - font-size: 8rem; + main { + display: contents; } - - h1 { - font-size: 4rem; + section { + max-width: 20rem; } } +.full-page { + height: 100%; + display: grid; + grid-template-rows: 1fr; + align-items: center; + margin-bottom: 4rem; + + &.r { + -ms-grid-column-align: end; + } + .big-logo { + font-size: 8rem; + } + + h1 { + font-size: 4rem; + } +} + h1, h2, @@ -116,3 +134,91 @@ h6, i.i { margin-right: .5em; } +i.hl, .me { + color: var(--pico-primary); +} + +footer { + text-align: center; + font-weight: 350; +} + +td.c, th.c { + text-align: center; + + input { + margin: 0; + } +} + +table select { + margin-bottom: 0; +} + +.podium { + > :first-child { + font-weight: 900; + font-size: 1.25em; + &::marker { + color: var(--pico-color-amber-200); + } + } + > :nth-child(2) { + font-weight: 800; + font-size: 1.1em; + &::marker { + color: var(--pico-color-grey-300); + } + } + > :nth-child(3) { + font-weight: 600; + font-size: 1.1em; + &::marker { + color: var(--pico-color-sand-300); + } + } + .score { + margin-left: .5em; + } +} + + +.score { + font-weight: 900; + color: var(--pico-color-zinc-500); +} +.correct { + .score, i { + color: var(--pico-color-lime-200);} +} +.wrong { + .score, i { + color: var(--pico-color-red-500);} +} + +table.results, table.musics { + white-space: nowrap; +} +.sc i { + margin-right: .5em; +} + +@media (width < 576px) { + [role="group"] { + display: grid; + & > :first-child { + border-radius: var(--pico-border-radius) var(--pico-border-radius) 0 0 !important; + } + & > :not(:first-child) { + margin-left: 0 !important; + margin-top: calc(var(--pico-border-width) * -1); + } + & > :last-child { + border-radius: 0 0 var(--pico-border-radius) var(--pico-border-radius) !important; + } + } +} + +.brand-name { + color: var(--pico-primary); +} diff --git a/base/static/favicon/apple-touch-icon.png b/base/static/favicon/apple-touch-icon.png new file mode 100644 index 0000000..abb8a48 Binary files /dev/null and b/base/static/favicon/apple-touch-icon.png differ diff --git a/base/static/favicon/favicon-96x96.png b/base/static/favicon/favicon-96x96.png new file mode 100644 index 0000000..beab288 Binary files /dev/null and b/base/static/favicon/favicon-96x96.png differ diff --git a/base/static/favicon/favicon.ico b/base/static/favicon/favicon.ico new file mode 100644 index 0000000..178d60c Binary files /dev/null and b/base/static/favicon/favicon.ico differ diff --git a/base/static/favicon/favicon.svg b/base/static/favicon/favicon.svg new file mode 100644 index 0000000..63c10e0 --- /dev/null +++ b/base/static/favicon/favicon.svg @@ -0,0 +1,25 @@ + + diff --git a/base/static/favicon/site.webmanifest b/base/static/favicon/site.webmanifest new file mode 100644 index 0000000..af6d059 --- /dev/null +++ b/base/static/favicon/site.webmanifest @@ -0,0 +1,21 @@ +{ + "name": "MyWebSite", + "short_name": "MySite", + "icons": [ + { + "src": "/web-app-manifest-192x192.png", + "sizes": "192x192", + "type": "image/png", + "purpose": "maskable" + }, + { + "src": "/web-app-manifest-512x512.png", + "sizes": "512x512", + "type": "image/png", + "purpose": "maskable" + } + ], + "theme_color": "#aa40bf", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/base/static/favicon/web-app-manifest-192x192.png b/base/static/favicon/web-app-manifest-192x192.png new file mode 100644 index 0000000..f7f97da Binary files /dev/null and b/base/static/favicon/web-app-manifest-192x192.png differ diff --git a/base/static/favicon/web-app-manifest-512x512.png b/base/static/favicon/web-app-manifest-512x512.png new file mode 100644 index 0000000..9e4e381 Binary files /dev/null and b/base/static/favicon/web-app-manifest-512x512.png differ diff --git a/base/templates/auth/user_confirm_delete.html b/base/templates/auth/user_confirm_delete.html new file mode 100644 index 0000000..8840f15 --- /dev/null +++ b/base/templates/auth/user_confirm_delete.html @@ -0,0 +1,25 @@ +{% extends "base.html" %} +{% block content %} + +{% endblock content %} diff --git a/base/templates/auth/user_form.html b/base/templates/auth/user_form.html index 257d1dc..c895f16 100644 --- a/base/templates/auth/user_form.html +++ b/base/templates/auth/user_form.html @@ -1,6 +1,24 @@ {% extends "base.html" %} {% load form %} {% block content %} -