From cce26864ade6929d98f2db620ed80c3a7614eef0 Mon Sep 17 00:00:00 2001 From: NeskireDK <10115530+NeskireDK@users.noreply.github.com> Date: Wed, 12 Aug 2026 17:46:37 +0200 Subject: [PATCH] ArikTube headline brand: logo + red accent theme Header/homepage brand text becomes 'ArikTube' with an inline play-button logo. Everything else keeps the Invidious name -- this fork extends Invidious, it does not rebrand it. Blue accents (rgb 0,182,240 / #075A9E / #008bec) become a red scheme (#cc0000 fills, #ff5252 dark-theme text, red seekbar). Co-Authored-By: Claude Fable 5 --- assets/css/default.css | 28 ++++++++++++------------- assets/css/embed.css | 2 +- assets/css/player.css | 6 +++--- src/invidious/views/search_homepage.ecr | 2 +- src/invidious/views/template.ecr | 2 +- 5 files changed, 20 insertions(+), 20 deletions(-) diff --git a/assets/css/default.css b/assets/css/default.css index 919d64c32..b0781d917 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -91,7 +91,7 @@ button.simulated_a { } body a.channel-owner { - background-color: #008bec; + background-color: #cc0000; color: #fff; border-radius: 9px; padding: 1px 6px; @@ -340,7 +340,7 @@ input[type="search"]::-webkit-search-cancel-button { } .searchbar #searchbutton:hover { - color: rgb(0, 182, 240); + color: rgb(204, 0, 0); } .user-field { @@ -541,7 +541,7 @@ span > select { .light-theme summary:focus, .light-theme .simulated_a:hover, .light-theme .simulated_a:active { - color: #075A9E !important; + color: #990000 !important; } .light-theme .pure-button-primary:hover, @@ -549,8 +549,8 @@ span > select { .light-theme .pure-button-secondary:hover, .light-theme .pure-button-secondary:focus { color: #fff !important; - border-color: rgba(0, 182, 240, 0.75) !important; - background-color: rgba(0, 182, 240, 0.75) !important; + border-color: rgba(204, 0, 0, 0.75) !important; + background-color: rgba(204, 0, 0, 0.75) !important; } .light-theme .pure-button-secondary:not(.low-profile) { @@ -586,7 +586,7 @@ span > select { .no-theme summary:focus, .no-theme .simulated_a:hover, .no-theme .simulated_a:active { - color: #075A9E !important; + color: #990000 !important; } .no-theme .pure-button-primary:hover, @@ -594,8 +594,8 @@ span > select { .no-theme .pure-button-secondary:hover, .no-theme .pure-button-secondary:focus { color: #fff !important; - border-color: rgba(0, 182, 240, 0.75) !important; - background-color: rgba(0, 182, 240, 0.75) !important; + border-color: rgba(204, 0, 0, 0.75) !important; + background-color: rgba(204, 0, 0, 0.75) !important; } .no-theme .pure-button-secondary:not(.low-profile) { @@ -644,7 +644,7 @@ span > select { .dark-theme summary:focus, .dark-theme .simulated_a:hover, .dark-theme .simulated_a:active { - color: rgb(0, 182, 240); + color: rgb(255, 82, 82); } .dark-theme .pure-button-primary:hover, @@ -652,8 +652,8 @@ span > select { .dark-theme .pure-button-secondary:hover, .dark-theme .pure-button-secondary:focus { color: #fff !important; - border-color: rgb(0, 182, 240) !important; - background-color: rgba(0, 182, 240, 1) !important; + border-color: rgb(204, 0, 0) !important; + background-color: rgba(204, 0, 0, 1) !important; } .dark-theme .pure-button-secondary { @@ -704,7 +704,7 @@ body.dark-theme { .no-theme a:focus, .no-theme .simulated_a:hover, .no-theme .simulated_a:active { - color: rgb(0, 182, 240); + color: rgb(255, 82, 82); } .no-theme .pure-button-primary:hover, @@ -712,8 +712,8 @@ body.dark-theme { .no-theme .pure-button-secondary:hover, .no-theme .pure-button-secondary:focus { color: #fff !important; - border-color: rgb(0, 182, 240) !important; - background-color: rgba(0, 182, 240, 1) !important; + border-color: rgb(204, 0, 0) !important; + background-color: rgba(204, 0, 0, 1) !important; } .no-theme .pure-button-secondary { diff --git a/assets/css/embed.css b/assets/css/embed.css index cbafcfeae..dc39d09d8 100644 --- a/assets/css/embed.css +++ b/assets/css/embed.css @@ -23,5 +23,5 @@ .watch-on-invidious > a:hover, .watch-on-invidious > a:focus { - color: rgba(0, 182, 240, 1);; + color: rgba(255, 82, 82, 1);; } diff --git a/assets/css/player.css b/assets/css/player.css index d95549ac7..2887bc191 100644 --- a/assets/css/player.css +++ b/assets/css/player.css @@ -156,7 +156,7 @@ ul.vjs-menu-content::-webkit-scrollbar { .vjs-menu li.vjs-selected, .vjs-menu li.vjs-selected:focus, .vjs-menu li.vjs-selected:hover { - background-color: rgba(0, 182, 240, 0.75); + background-color: rgba(204, 0, 0, 0.75); } /* Progress Bar */ @@ -171,11 +171,11 @@ ul.vjs-menu-content::-webkit-scrollbar { .video-js .vjs-slider:hover, .video-js button:hover { - color: rgba(0, 182, 240, 1); + color: rgba(255, 82, 82, 1); } .video-js.player-style-invidious .vjs-play-progress { - background-color: rgba(0, 182, 240, 1); + background-color: rgba(255, 0, 0, 1); } /* Overlay */ diff --git a/src/invidious/views/search_homepage.ecr b/src/invidious/views/search_homepage.ecr index 911526d14..c5aac25c2 100644 --- a/src/invidious/views/search_homepage.ecr +++ b/src/invidious/views/search_homepage.ecr @@ -10,7 +10,7 @@
diff --git a/src/invidious/views/template.ecr b/src/invidious/views/template.ecr index 82d15958e..d93a4ea68 100644 --- a/src/invidious/views/template.ecr +++ b/src/invidious/views/template.ecr @@ -33,7 +33,7 @@
<% if navbar_search %>
- Invidious + ArikTube
<% autofocus = false %><%= rendered "components/search_box" %>