Added "Tako" theme (#5546)

* Added "Ninomae" theme

Based on the lovely Ninomae Ina'nis, for Arkon and Flat

* Use updated colors from Ghostbear

Adapted after feedback

Co-Authored-By: Andreas <[email protected]>

* Tweak the Ninomae theme further

* Sort themes alphabetically

- Sorts themes alphabetically.
- Use the same capital word system in colors.xml for themes.xml as well.
- Rename AMOLED theme to AMOLED mode in theme.xml and color.xml references.

* More tweaks

* Style incognito bar

Uses a dark purple which looks super clean instead of a washed out gray

This sets the groundwork for other themes too

* Tweak final onPrimary color

* Rename Ninomae to Tako

RIP

Co-authored-by: Andreas <[email protected]>

app/src/main/java/eu/kanade/tachiyomi/data/preference/PreferenceValues.kt

@@ -27,8 +27,9 @@ object PreferenceValues {
         GREEN_APPLE(R.string.theme_greenapple),
         MIDNIGHT_DUSK(R.string.theme_midnightdusk),
         STRAWBERRY_DAIQUIRI(R.string.theme_strawberrydaiquiri),
-        YOTSUBA(R.string.theme_yotsuba),
+        TAKO(R.string.theme_tako),
         YINYANG(R.string.theme_yinyang),
+        YOTSUBA(R.string.theme_yotsuba),
 
         // Deprecated
         DARK_BLUE(null),

app/src/main/java/eu/kanade/tachiyomi/ui/base/activity/BaseThemedActivity.kt

@@ -53,12 +53,15 @@ abstract class BaseThemedActivity : AppCompatActivity() {
                 PreferenceValues.AppTheme.STRAWBERRY_DAIQUIRI -> {
                     resIds += R.style.Theme_Tachiyomi_StrawberryDaiquiri
                 }
-                PreferenceValues.AppTheme.YOTSUBA -> {
-                    resIds += R.style.Theme_Tachiyomi_Yotsuba
+                PreferenceValues.AppTheme.TAKO -> {
+                    resIds += R.style.Theme_Tachiyomi_Tako
                 }
                 PreferenceValues.AppTheme.YINYANG -> {
                     resIds += R.style.Theme_Tachiyomi_YinYang
                 }
+                PreferenceValues.AppTheme.YOTSUBA -> {
+                    resIds += R.style.Theme_Tachiyomi_Yotsuba
+                }
                 else -> {
                     resIds += R.style.Theme_Tachiyomi
                 }

app/src/main/res/layout-sw720dp/main_activity.xml

@@ -52,7 +52,7 @@
             android:id="@+id/incognito_mode"
             android:layout_width="0dp"
             android:layout_height="wrap_content"
-            android:background="@color/md_grey_800"
+            android:background="?attr/incognitoBackgroundColor"
             android:visibility="gone"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"

app/src/main/res/layout/main_activity.xml

@@ -47,7 +47,7 @@
             android:id="@+id/incognito_mode"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:background="@color/md_grey_800"
+            android:background="?attr/incognitoBackgroundColor"
             android:visibility="gone"
             tools:visibility="visible">
 

app/src/main/res/layout/main_activity_toolbar.xml

@@ -40,7 +40,7 @@
         android:id="@+id/incognito_mode"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:background="@color/md_grey_800"
+        android:background="?attr/incognitoBackgroundColor"
         android:visibility="gone"
         tools:visibility="visible">
 

app/src/main/res/values-night/colors.xml

@@ -14,7 +14,18 @@
     <color name="color_on_primary_greenapple">@color/md_black_1000</color>
     <color name="ripple_colored_greenapple">#1F48E484</color>
 
-    <!-- Yin Yang Theme -->
+    <!-- Tako Theme -->
+    <color name="accent_tako">#F3B375</color>
+    <color name="color_on_primary_tako">#242431</color>
+    <color name="tertiary_tako">@color/color_on_primary_tako</color>
+    <color name="color_on_tertiary_tako">@color/accent_tako</color>
+    <color name="ripple_colored_tako">#1FF3B375</color>
+    <color name="surface_tako">#2A2A3C</color>
+    <color name="background_tako">#21212E</color>
+    <color name="incognito_background_tako">#17171C</color>
+    <color name="filter_tako">@color/accent_tako</color>
+
+    <!-- Yin & Yang Theme -->
     <color name="accent_yinyang">#FFFFFF</color>
     <color name="color_on_secondary_yinyang">#000000</color>
     <color name="ripple_colored_yinyang">#777777</color>

app/src/main/res/values-night/themes.xml

@@ -1,17 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
 
-    <!--== AMOLED theme overlay ==-->
-    <style name="ThemeOverlay.Tachiyomi.Amoled" parent="">
-        <item name="colorSurface">@color/surface_amoled</item>
-        <item name="android:colorBackground">@color/background_amoled</item>
-        <item name="android:divider">@color/divider_amoled</item>
-        <item name="colorFilterActive">@color/filter_dark</item>
-    </style>
-
-    <!--== Midnight Dusk theme ==-->
+    <!--== Midnight Dusk Theme ==-->
     <style name="Theme.Tachiyomi.MidnightDusk">
-        <!-- Theme colors -->
+        <!-- Theme Colors -->
         <item name="colorPrimary">@color/accent_midnightdusk</item>
         <item name="colorTertiary">@color/md_blue_A400</item>
         <item name="colorControlHighlight">@color/ripple_colored_midnightdusk</item>
@@ -19,4 +11,15 @@
         <item name="android:colorBackground">@color/background_midnightdusk</item>
     </style>
 
+    <!--== AMOLED Mode Overlay ==-->
+    <style name="ThemeOverlay.Tachiyomi.Amoled" parent="">
+        <!-- Theme Colors -->
+        <item name="colorSurface">@color/surface_amoled</item>
+        <item name="android:colorBackground">@color/background_amoled</item>
+        <item name="android:divider">@color/divider_amoled</item>
+
+        <!-- Custom Attributes-->
+        <item name="colorFilterActive">@color/filter_dark</item>
+    </style>
+
 </resources>

app/src/main/res/values/attrs.xml

@@ -32,6 +32,9 @@
 
     <attr name="lightSystemBarsOnPrimary" format="reference|boolean"/>
 
+    <!-- Custom color for incognito mode bar -->
+    <attr name="incognitoBackgroundColor" format="reference|integer"/>
+
     <!-- Setting chip color values for specific themes -->
     <attr name="chipTextColor" format="reference|integer"/>
 

app/src/main/res/values/colors.xml

@@ -13,32 +13,43 @@
     <color name="accent_blue">#54759E</color>
     <color name="ripple_colored_blue">#1F54759E</color>
 
-    <!-- Strawberry Daiquiri Theme -->
-    <color name="accent_strawberry">#ED4A65</color>
-    <color name="ripple_colored_strawberry">#1FED4A65</color>
-
-    <!-- Yotsuba Theme -->
-    <color name="accent_yotsuba">#FC8C5C</color>
-    <color name="ripple_colored_yotsuba">#1FFC8C5C</color>
-
     <!-- Green Apple Theme -->
     <color name="accent_greenapple">#188140</color>
     <color name="color_on_primary_greenapple">@color/md_white_1000</color>
     <color name="ripple_colored_greenapple">#1F188140</color>
 
-    <!-- Yin Yang Theme -->
-    <color name="accent_yinyang">#000000</color>
-    <color name="color_on_secondary_yinyang">#FFFFFF</color>
-    <color name="ripple_colored_yinyang">#999999</color>
-    <color name="chip_text_yinyang">#000000</color>
-
     <!-- Midnight Dusk Theme -->
     <color name="accent_midnightdusk">#F02475</color>
     <color name="background_midnightdusk">#16151D</color>
     <color name="surface_midnightdusk">#201F27</color>
     <color name="ripple_colored_midnightdusk">#1FF02475</color>
 
-    <!-- AMOLED Theme -->
+    <!-- Strawberry Daiquiri Theme -->
+    <color name="accent_strawberry">#ED4A65</color>
+    <color name="ripple_colored_strawberry">#1FED4A65</color>
+
+    <!-- Tako Theme -->
+    <color name="accent_tako">#66577E</color>
+    <color name="color_on_primary_tako">#F3B375</color>
+    <color name="tertiary_tako">@color/color_on_primary_tako</color>
+    <color name="color_on_tertiary_tako">#574360</color>
+    <color name="ripple_colored_tako">#1F66577E</color>
+    <color name="surface_tako">#F7F5FF</color>
+    <color name="background_tako">#F2EDF7</color>
+    <color name="incognito_background_tako">@color/accent_tako</color>
+    <color name="filter_tako">#F29940</color>
+
+    <!-- Yin & Yang Theme -->
+    <color name="accent_yinyang">#000000</color>
+    <color name="color_on_secondary_yinyang">#FFFFFF</color>
+    <color name="ripple_colored_yinyang">#999999</color>
+    <color name="chip_text_yinyang">#000000</color>
+
+    <!-- Yotsuba Theme -->
+    <color name="accent_yotsuba">#FC8C5C</color>
+    <color name="ripple_colored_yotsuba">#1FFC8C5C</color>
+
+    <!-- AMOLED Mode -->
     <color name="divider_amoled">@android:color/transparent</color>
     <color name="surface_amoled">#000001</color>
     <color name="background_amoled">#000000</color>
@@ -88,7 +99,7 @@
 
     <color name="green">#47a84a</color>
 
-    <!-- Navigation overlay colors -->
+    <!-- Navigation Overlay Colors -->
     <color name="navigation_next">#CB84E296</color>
     <color name="navigation_prev">#CCFF7733</color>
     <color name="navigation_menu">#CC95818D</color>

app/src/main/res/values/strings.xml

@@ -148,12 +148,13 @@
     <string name="theme_dark">On</string>
     <string name="pref_app_theme">App theme</string>
     <string name="theme_default">Default</string>
-    <string name="theme_strawberrydaiquiri">Strawberry Daiquiri</string>
-    <string name="theme_yotsuba">Yotsuba</string>
     <string name="theme_blue">Blue</string>
     <string name="theme_greenapple">Green Apple</string>
-    <string name="theme_yinyang">Yin &amp; Yang</string>
     <string name="theme_midnightdusk">Midnight Dusk</string>
+    <string name="theme_strawberrydaiquiri">Strawberry Daiquiri</string>
+    <string name="theme_tako">Tako</string>
+    <string name="theme_yinyang">Yin &amp; Yang</string>
+    <string name="theme_yotsuba">Yotsuba</string>
     <string name="pref_dark_theme_pure_black">Pure black dark mode</string>
     <string name="pref_start_screen">Start screen</string>
     <string name="pref_language">Language</string>

app/src/main/res/values/themes.xml

@@ -5,12 +5,12 @@
     <!-- Base Theme -->
     <!--============-->
 
-    <!--== Theme base ==-->
+    <!--== Theme Base ==-->
     <style name="Base.Theme.Tachiyomi" parent="Theme.MaterialComponents.DayNight.NoActionBar">
         <!-- Disallow "Force dark theme" -->
         <item name="android:forceDarkAllowed" tools:targetApi="Q">false</item>
 
-        <!-- Theme colors -->
+        <!-- Theme Colors -->
         <item name="colorPrimary">@color/accent_default</item>
         <item name="colorPrimaryVariant">?attr/colorPrimary</item>
         <item name="colorOnPrimary">@color/md_white_1000</item>
@@ -30,7 +30,7 @@
         <item name="colorControlHighlight">@color/ripple_colored_default</item>
         <item name="rippleColorToolbar">?attr/colorControlHighlight</item>
 
-        <!-- Handles RTL text -->
+        <!-- Handles RTL Text -->
         <item name="android:textAlignment">gravity</item>
         <item name="android:textDirection">locale</item>
 
@@ -53,6 +53,7 @@
         <item name="toolbarNavigationButtonStyle">@style/Widget.Tachiyomi.Toolbar.Button.Navigation</item>
         <item name="preferenceTheme">@style/PreferenceThemeOverlay</item>
         <item name="bottomSheetDialogTheme">@style/ThemeOverlay.Tachiyomi.BottomSheetDialog</item>
+        <item name="incognitoBackgroundColor">@color/md_grey_800</item>
         <item name="chipStyle">@style/Widget.Tachiyomi.Chip.Action</item>
         <item name="chipTextColor">?android:attr/textColorPrimary</item>
         <item name="chipBackgroundColor">?attr/colorControlHighlight</item>
@@ -71,43 +72,63 @@
         <item name="colorFilterActive">@color/filter_light</item>
     </style>
 
+    <!--== Default Theme ==-->
     <style name="Theme.Tachiyomi" parent="Base.Theme.Tachiyomi" />
 
+    <!--== Blue Theme ==-->
     <style name="Theme.Tachiyomi.Blue">
-        <!-- Theme colors -->
+        <!-- Theme Colors -->
         <item name="colorPrimary">@color/accent_blue</item>
         <item name="colorControlHighlight">@color/ripple_colored_blue</item>
     </style>
 
-    <!--== Strawberry Daiquiri theme ==-->
-    <style name="Theme.Tachiyomi.StrawberryDaiquiri">
-        <!-- Theme colors -->
-        <item name="colorPrimary">@color/accent_strawberry</item>
+    <!--== Green Apple Theme ==-->
+    <style name="Theme.Tachiyomi.GreenApple">
+        <!-- Theme Colors -->
+        <item name="colorPrimary">@color/accent_greenapple</item>
+        <item name="colorOnPrimary">@color/color_on_primary_greenapple</item>
         <item name="colorTertiary">@color/md_blue_A400</item>
-        <item name="colorControlHighlight">@color/ripple_colored_strawberry</item>
+        <item name="colorControlHighlight">@color/ripple_colored_greenapple</item>
+        <item name="lightSystemBarsOnPrimary">true</item>
     </style>
 
-    <!--== Yotsuba theme ==-->
-    <style name="Theme.Tachiyomi.Yotsuba">
-        <!-- Theme colors -->
-        <item name="colorPrimary">@color/accent_yotsuba</item>
+    <!--== Midnight Dusk Theme ==-->
+    <style name="Theme.Tachiyomi.MidnightDusk">
+        <!-- Theme Colors -->
+        <item name="colorPrimary">@color/accent_midnightdusk</item>
         <item name="colorTertiary">@color/md_blue_A400</item>
-        <item name="colorControlHighlight">@color/ripple_colored_yotsuba</item>
+        <item name="colorControlHighlight">@color/ripple_colored_midnightdusk</item>
     </style>
 
-    <!--== Green Apple theme ==-->
-    <style name="Theme.Tachiyomi.GreenApple">
-        <!-- Theme colors -->
-        <item name="colorPrimary">@color/accent_greenapple</item>
-        <item name="colorOnPrimary">@color/color_on_primary_greenapple</item>
+    <!--== Strawberry Daiquiri Theme ==-->
+    <style name="Theme.Tachiyomi.StrawberryDaiquiri">
+        <!-- Theme Colors -->
+        <item name="colorPrimary">@color/accent_strawberry</item>
         <item name="colorTertiary">@color/md_blue_A400</item>
-        <item name="colorControlHighlight">@color/ripple_colored_greenapple</item>
-        <item name="lightSystemBarsOnPrimary">true</item>
+        <item name="colorControlHighlight">@color/ripple_colored_strawberry</item>
     </style>
 
-    <!--== Yin Yang theme ==-->
+    <!--== Tako Theme ==-->
+    <style name="Theme.Tachiyomi.Tako">
+        <!-- Theme Colors -->
+        <item name="colorPrimary">@color/accent_tako</item>
+        <item name="colorOnPrimary">@color/color_on_primary_tako</item>
+        <item name="colorTertiary">@color/tertiary_tako</item>
+        <item name="colorOnTertiary">@color/color_on_tertiary_tako</item>
+        <item name="colorControlHighlight">@color/ripple_colored_tako</item>
+        <item name="colorSurface">@color/surface_tako</item>
+        <item name="android:colorBackground">@color/background_tako</item>
+
+        <!-- Themes -->
+        <item name="incognitoBackgroundColor">@color/incognito_background_tako</item>
+
+        <!-- Custom Attributes-->
+        <item name="colorFilterActive">@color/filter_tako</item>
+    </style>
+
+    <!--== Yin & Yang Theme ==-->
     <style name="Theme.Tachiyomi.YinYang">
-        <!-- Theme colors -->
+        <!-- Theme Colors -->
         <item name="colorPrimary">@color/accent_yinyang</item>
         <item name="colorOnPrimary">@color/color_on_secondary_yinyang</item>
         <item name="colorOnSecondary">@color/color_on_secondary_yinyang</item>
@@ -120,18 +141,18 @@
         <item name="chipBackgroundColor">@color/accent_yinyang</item>
     </style>
 
-    <!--== Midnight Dusk theme ==-->
-    <style name="Theme.Tachiyomi.MidnightDusk">
-        <!-- Theme colors -->
-        <item name="colorPrimary">@color/accent_midnightdusk</item>
+    <!--== Yotsuba Theme ==-->
+    <style name="Theme.Tachiyomi.Yotsuba">
+        <!-- Theme Colors -->
+        <item name="colorPrimary">@color/accent_yotsuba</item>
         <item name="colorTertiary">@color/md_blue_A400</item>
-        <item name="colorControlHighlight">@color/ripple_colored_midnightdusk</item>
+        <item name="colorControlHighlight">@color/ripple_colored_yotsuba</item>
     </style>
 
-    <!--== AMOLED theme overlay ==-->
+    <!--== AMOLED Mode Overlay ==-->
     <style name="ThemeOverlay.Tachiyomi.Amoled" parent="" />
 
-    <!--== Colored bars (toolbar-navbar-navrail) theme overlay ==-->
+    <!--== Colored Bars (toolbar-navbar-navrail) Mode Overlay ==-->
     <style name="ThemeOverlay.Tachiyomi.ColoredBars" parent="">
         <item name="colorToolbar">?attr/colorPrimary</item>
         <item name="colorOnToolbar">?attr/colorOnPrimary</item>
@@ -160,7 +181,7 @@
     <!-- Launch Screen -->
     <!--===============-->
 
-    <!--== Splash theme ==-->
+    <!--== Splash Theme ==-->
     <style name="Theme.Splash" parent="Theme.Tachiyomi">
         <item name="android:windowBackground">@drawable/splash_background</item>
         <item name="android:statusBarColor">@android:color/transparent</item>