diff --git a/assets/css/application.css b/assets/css/application.css index 2f6aea6de..136e8b301 100644 --- a/assets/css/application.css +++ b/assets/css/application.css @@ -42,9 +42,11 @@ @import "views/comments"; @import "views/commissions"; @import "views/communications"; +@import "views/derpibooru"; @import "views/duplicates"; @import "views/filters"; @import "views/galleries"; +@import "views/game"; @import "views/images"; @import "views/notifications"; @import "views/pages"; diff --git a/assets/css/themes/dark-gray.css b/assets/css/themes/dark-gray.css index 8d4271d16..74f7c43f9 100644 --- a/assets/css/themes/dark-gray.css +++ b/assets/css/themes/dark-gray.css @@ -74,5 +74,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #888888; + --logo-color: #9194a5; } diff --git a/assets/css/themes/dark-green.css b/assets/css/themes/dark-green.css index dfe68453c..e443dc3f1 100644 --- a/assets/css/themes/dark-green.css +++ b/assets/css/themes/dark-green.css @@ -74,5 +74,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #333333; + --logo-color: #0fc84d; } diff --git a/assets/css/themes/dark-orange.css b/assets/css/themes/dark-orange.css index 2233c1459..bd1614165 100644 --- a/assets/css/themes/dark-orange.css +++ b/assets/css/themes/dark-orange.css @@ -75,4 +75,5 @@ $image-overlay-background-color: #000000; :root { --comment-color: #b099dd; + --logo-color: #fb6115; } diff --git a/assets/css/themes/dark-pink.css b/assets/css/themes/dark-pink.css index 22b6dcc4d..51b572745 100644 --- a/assets/css/themes/dark-pink.css +++ b/assets/css/themes/dark-pink.css @@ -74,5 +74,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #555555; + --logo-color: #e357c5; } diff --git a/assets/css/themes/dark-purple.css b/assets/css/themes/dark-purple.css index f38a900f1..f1774cd27 100644 --- a/assets/css/themes/dark-purple.css +++ b/assets/css/themes/dark-purple.css @@ -75,5 +75,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #666666; + --logo-color: #9a91d9; } diff --git a/assets/css/themes/dark-red.css b/assets/css/themes/dark-red.css index d3a8b01b3..9df43d522 100644 --- a/assets/css/themes/dark-red.css +++ b/assets/css/themes/dark-red.css @@ -76,5 +76,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #777777; + --logo-color: #ff8080; } diff --git a/assets/css/themes/dark-teal.css b/assets/css/themes/dark-teal.css index d2ea675bf..66bd3ca3a 100644 --- a/assets/css/themes/dark-teal.css +++ b/assets/css/themes/dark-teal.css @@ -74,5 +74,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #222222; + --logo-color: #49d1ca; } diff --git a/assets/css/themes/dark-yellow.css b/assets/css/themes/dark-yellow.css index e0abbbfc9..2184efb30 100644 --- a/assets/css/themes/dark-yellow.css +++ b/assets/css/themes/dark-yellow.css @@ -74,5 +74,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #999999; + --logo-color: #fbc115; } diff --git a/assets/css/themes/light-gray.css b/assets/css/themes/light-gray.css index d9baef398..a481ef907 100644 --- a/assets/css/themes/light-gray.css +++ b/assets/css/themes/light-gray.css @@ -67,4 +67,5 @@ $image-overlay-background-color: #000000; --media-box-color: hsl(from $base-color h calc(s - 26) calc(l + 20)); --media-box-hover-color: hsl(from $base-color h calc(s - 20) calc(l + 14)); --background-odd-color: #eaeaea; + --logo-color: #d4d7e9; } diff --git a/assets/css/themes/light-green.css b/assets/css/themes/light-green.css index db20e9b1f..e50c3fa32 100644 --- a/assets/css/themes/light-green.css +++ b/assets/css/themes/light-green.css @@ -58,4 +58,5 @@ $image-overlay-background-color: #000000; :root { --comment-color: #9273d0; --background-odd-color: #e6f3ea; + --logo-color: #0ef059; } diff --git a/assets/css/themes/light-orange.css b/assets/css/themes/light-orange.css index 39eba45b7..80080a43f 100644 --- a/assets/css/themes/light-orange.css +++ b/assets/css/themes/light-orange.css @@ -56,4 +56,5 @@ $image-overlay-background-color: #000000; :root { --comment-color: #9273d0; + --logo-color: #ffad98; } diff --git a/assets/css/themes/light-pink.css b/assets/css/themes/light-pink.css index a8c8be719..ab9ab6e11 100644 --- a/assets/css/themes/light-pink.css +++ b/assets/css/themes/light-pink.css @@ -55,5 +55,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #dddddd; + --logo-color: #f6b0c7; } diff --git a/assets/css/themes/light-purple.css b/assets/css/themes/light-purple.css index cef3cddfc..20647cf87 100644 --- a/assets/css/themes/light-purple.css +++ b/assets/css/themes/light-purple.css @@ -55,5 +55,5 @@ $image-overlay-background-color: #000000; */ :root { - --keep: #eeeeee; + --logo-color: #b6a0f3; } diff --git a/assets/css/themes/light-red.css b/assets/css/themes/light-red.css index 27dbc32f1..919a882d2 100644 --- a/assets/css/themes/light-red.css +++ b/assets/css/themes/light-red.css @@ -57,4 +57,5 @@ $image-overlay-background-color: #000000; :root { --header-admin-color: hsl(from $foreground-color h s calc(l + 60)); --header-admin-hover-color: hsl(from $foreground-color h s calc(l + 50)); + --logo-color: #ff8080; } diff --git a/assets/css/themes/light-teal.css b/assets/css/themes/light-teal.css index 9189f03f0..156428955 100644 --- a/assets/css/themes/light-teal.css +++ b/assets/css/themes/light-teal.css @@ -56,4 +56,5 @@ $image-overlay-background-color: #000000; :root { --background-odd-color: #e2f1f1; + --logo-color: #a0f3ef; } diff --git a/assets/css/themes/light-yellow.css b/assets/css/themes/light-yellow.css index 683116fb0..cc8ff7338 100644 --- a/assets/css/themes/light-yellow.css +++ b/assets/css/themes/light-yellow.css @@ -57,4 +57,5 @@ $image-overlay-background-color: #000000; :root { --comment-color: #9273d0; --background-odd-color: #f5efde; + --logo-color: #fbc115; } diff --git a/assets/css/views/derpibooru.css b/assets/css/views/derpibooru.css new file mode 100644 index 000000000..c970f7d42 --- /dev/null +++ b/assets/css/views/derpibooru.css @@ -0,0 +1,21 @@ +/* + * This file contains Derpibooru-specific branding changes + * You probably do not want to copy it in your fork. + * + * This will all be unnecessary in the debranding update anyway, + * but for now, we have to hack around :3 + */ + +:root { + --logo-color: #73d6ed; +} + +i.favicon-home { + position: relative; + top: 2px; + background-image: unset !important; + background-color: var(--logo-color); + -webkit-mask-image: url("/favicon.svg"); + mask-image: url("/favicon.svg"); + mask-size: contain; +} diff --git a/assets/css/views/_game.scss b/assets/css/views/game.css similarity index 80% rename from assets/css/views/_game.scss rename to assets/css/views/game.css index 16b9f302d..0342a579b 100644 --- a/assets/css/views/_game.scss +++ b/assets/css/views/game.css @@ -1,15 +1,8 @@ -// Hi, brave soul who reads this. -// I've written this file like you see mostly -// because this is how redesign is written. -// This file is... terrible tbh. -// Redesign is much better. :root { --border-radius: 0.25rem; - --team1-color: #38407c; --team2-color: #dc591a; --middle-color: #7a4a55; - --bar-outline-color: #665773; } @@ -60,18 +53,19 @@ grid-template-columns: auto auto; } -.game__title--team1 { +.game__title--team1, +.game__title--team2 { display: flex; flex-direction: row; line-height: 2rem; +} - & > span { - font-size: 16px; - } +.game__title--team1 > span, +.game__title--team2 > span { + font-size: 16px; } .game__title--team2 { - @extend .game__title--team1; margin-left: auto; } @@ -100,12 +94,7 @@ } .game__progress_bar { - background: linear-gradient( - 90deg, - var(--team1-color) 0%, - var(--middle-color) 50%, - var(--team2-color) 100% - ); + background: linear-gradient(90deg, var(--team1-color) 0%, var(--middle-color) 50%, var(--team2-color) 100%); height: 1rem; width: 100%; } diff --git a/assets/css/views/profiles.css b/assets/css/views/profiles.css index 66f43a2ad..5aabcb64a 100644 --- a/assets/css/views/profiles.css +++ b/assets/css/views/profiles.css @@ -136,5 +136,5 @@ td.table--stats__sparkline { } .staff-title-muted { - color: #777; -} \ No newline at end of file + color: #777777; +} diff --git a/assets/static/android-chrome-192x192.png b/assets/static/android-chrome-192x192.png new file mode 100644 index 000000000..3f8cc79af Binary files /dev/null and b/assets/static/android-chrome-192x192.png differ diff --git a/assets/static/android-chrome-512x512.png b/assets/static/android-chrome-512x512.png new file mode 100644 index 000000000..cd2548160 Binary files /dev/null and b/assets/static/android-chrome-512x512.png differ diff --git a/assets/static/apple-touch-icon.png b/assets/static/apple-touch-icon.png new file mode 100644 index 000000000..7217ea2be Binary files /dev/null and b/assets/static/apple-touch-icon.png differ diff --git a/assets/static/favicon-16x16.png b/assets/static/favicon-16x16.png new file mode 100644 index 000000000..f014f5864 Binary files /dev/null and b/assets/static/favicon-16x16.png differ diff --git a/assets/static/favicon-32x32.png b/assets/static/favicon-32x32.png new file mode 100644 index 000000000..81d89a14d Binary files /dev/null and b/assets/static/favicon-32x32.png differ diff --git a/assets/static/favicon.ico b/assets/static/favicon.ico index 3d11304a1..94538ede5 100644 Binary files a/assets/static/favicon.ico and b/assets/static/favicon.ico differ diff --git a/assets/static/favicon.svg b/assets/static/favicon.svg index 78295dddd..2dec1d7b1 100644 --- a/assets/static/favicon.svg +++ b/assets/static/favicon.svg @@ -1,2 +1,2 @@ - - + + diff --git a/lib/philomena/users/user.ex b/lib/philomena/users/user.ex index 90e00c30a..452ce9b59 100644 --- a/lib/philomena/users/user.ex +++ b/lib/philomena/users/user.ex @@ -611,7 +611,7 @@ defmodule Philomena.Users.User do do: user.otp_backup_codes |> Enum.reject(&Password.verify_pass(token, &1)) def theme_colors do - ~W(red orange yellow blue green purple teal pink gray) + ~W(red orange yellow green blue purple teal pink gray) end def theme_names do