From 44073e72fdb5d253f48b6f0bb0755da89f7e4ae1 Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Fri, 17 Nov 2017 02:17:36 +0200
Subject: Update theme editor to have 4 colors, rewrite the color setter,
 change a LOT of base16 assignments for better consistency.

---
 src/components/timeline/timeline.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

(limited to 'src/components/timeline/timeline.vue')

diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 18e27c71..ad741e3b 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -1,16 +1,16 @@
 <template>
   <div class="timeline panel panel-default" v-if="viewing == 'statuses'">
-    <div class="panel-heading timeline-heading base01-background base04">
+    <div class="panel-heading timeline-heading base02-background base04">
       <div class="title">
         {{title}}
       </div>
-      <button @click.prevent="showNewStatuses" class="base05 base01-background loadmore-button" v-if="timeline.newStatusCount > 0 && !timelineError">
+      <button @click.prevent="showNewStatuses" class="base05 base02-background loadmore-button" v-if="timeline.newStatusCount > 0 && !timelineError">
         {{$t('timeline.show_new')}} ({{timeline.newStatusCount}})
       </button>
       <div @click.prevent class="base06 error  loadmore-text" v-if="timelineError">
         {{$t('timeline.error_fetching')}}
       </div>
-      <div @click.prevent class="base04 base01-background loadmore-text" v-if="!timeline.newStatusCount > 0 && !timelineError">
+      <div @click.prevent class="base04 base02-background loadmore-text" v-if="!timeline.newStatusCount > 0 && !timelineError">
         {{$t('timeline.up_to_date')}}
       </div>
     </div>
@@ -18,14 +18,14 @@
       <div class="timeline">
         <status-or-conversation v-for="status in timeline.visibleStatuses" :key="status.id" v-bind:statusoid="status"></status-or-conversation>
         <a href="#" v-on:click.prevent='fetchOlderStatuses()' v-if="!timeline.loading">
-          <div class="base01-background base03-border new-status-notification text-center">{{$t('timeline.load_older')}}</div>
+          <div class="base02-background base03-border new-status-notification text-center">{{$t('timeline.load_older')}}</div>
         </a>
-          <div class="base01-background base03-border new-status-notification text-center" v-else>...</div>
+          <div class="base02-background base03-border new-status-notification text-center" v-else>...</div>
       </div>
     </div>
   </div>
   <div class="timeline panel panel-default" v-else-if="viewing == 'followers'">
-    <div class="panel-heading timeline-heading base01-background base04">
+    <div class="panel-heading timeline-heading base02-background base04">
       <div class="title">
         {{$t('user_card.followers')}}
       </div>
@@ -37,7 +37,7 @@
     </div>
   </div>
   <div class="timeline panel panel-default" v-else-if="viewing == 'friends'">
-    <div class="panel-heading timeline-heading base01-background base04">
+    <div class="panel-heading timeline-heading base02-background base04">
       <div class="title">
         {{$t('user_card.followees')}}
       </div>
-- 
cgit v1.2.3-70-g09d2


From a7500410ff17fbf742336d065a1dfedf87df587b Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Sat, 18 Nov 2017 17:41:43 +0200
Subject: Fix color inputs to wrap on mobile, fix timeline background color to
 not clash with panel headings.

---
 src/components/style_switcher/style_switcher.vue | 5 +++--
 src/components/timeline/timeline.vue             | 6 +++---
 2 files changed, 6 insertions(+), 5 deletions(-)

(limited to 'src/components/timeline/timeline.vue')

diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue
index 30dfdf8d..f92f7299 100644
--- a/src/components/style_switcher/style_switcher.vue
+++ b/src/components/style_switcher/style_switcher.vue
@@ -49,16 +49,17 @@
 
  .color-container {
    display: flex;
+   flex-wrap: wrap;
  }
 
  .color-item {
-   max-width: 7em;
+   max-width: 9em;
    display:flex;
    flex-wrap:wrap;
  }
 
  .theme-color-in {
-   max-width: 6em;
+   max-width: 8em;
    border-radius: 2px;
    border: 0;
    padding: 5px;
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index ad741e3b..0e2ed92c 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -14,7 +14,7 @@
         {{$t('timeline.up_to_date')}}
       </div>
     </div>
-    <div class="panel-body base02-background">
+    <div class="panel-body base01-background">
       <div class="timeline">
         <status-or-conversation v-for="status in timeline.visibleStatuses" :key="status.id" v-bind:statusoid="status"></status-or-conversation>
         <a href="#" v-on:click.prevent='fetchOlderStatuses()' v-if="!timeline.loading">
@@ -30,7 +30,7 @@
         {{$t('user_card.followers')}}
       </div>
     </div>
-    <div class="panel-body base02-background">
+    <div class="panel-body base01-background">
       <div class="timeline">
         <user-card v-for="follower in followers" :user="follower" :showFollows="false"></user-card>
       </div>
@@ -42,7 +42,7 @@
         {{$t('user_card.followees')}}
       </div>
     </div>
-    <div class="panel-body base02-background">
+    <div class="panel-body base01-background">
       <div class="timeline">
         <user-card v-for="friend in friends" :user="friend" :showFollows="true"></user-card>
       </div>
-- 
cgit v1.2.3-70-g09d2

