From 137a7e643d22be6461f79cc134df1e459c576228 Mon Sep 17 00:00:00 2001
From: Roger Braun <roger@rogerbraun.net>
Date: Tue, 21 Feb 2017 15:24:05 +0100
Subject: Remove flex from general attachments.

---
 src/components/attachment/attachment.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

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

diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 738a1e86..e0eba6a9 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -16,8 +16,6 @@
 
     <audio v-if="type === 'audio'" :src="attachment.url" controls></audio>
 
-    <span v-if="type === 'unknown'">Don't know how to display this...</span>
-
     <div @click.prevent="linkClicked" v-if="type === 'html' && attachment.oembed" class="oembed">
       <div v-if="attachment.thumb_url" class="image">
         <img :src="attachment.thumb_url"></img>
@@ -38,12 +36,12 @@
       flex-wrap: wrap;
       .attachment {
           flex: 1 0 30%;
-          display: flex;
           margin: 0.5em 0.8em 0.6em 0.1em;
           align-self: flex-start;
 
           &.html {
             flex-basis: 100%;
+            display: flex;
           }
 
           .hider {
-- 
cgit v1.2.3-70-g09d2


From a7db72d7a7667fc5f06953b37d32d6847e6dfc58 Mon Sep 17 00:00:00 2001
From: "Hector A. Escobedo" <ninjahector.escobedo@gmail.com>
Date: Wed, 22 Feb 2017 18:38:05 -0500
Subject: Add setting to toggle NSFW hiding.

---
 src/components/attachment/attachment.js  | 3 ++-
 src/components/attachment/attachment.vue | 4 ++--
 src/components/settings/settings.js      | 4 ++++
 src/components/settings/settings.vue     | 2 ++
 src/main.js                              | 5 ++++-
 src/modules/config.js                    | 3 ++-
 6 files changed, 16 insertions(+), 5 deletions(-)

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

diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js
index 57d21b28..8e959903 100644
--- a/src/components/attachment/attachment.js
+++ b/src/components/attachment/attachment.js
@@ -9,7 +9,8 @@ const Attachment = {
   ],
   data: () => ({
     nsfwImage,
-    showHidden: false
+    hideNsfwLocal: this.$store.state.config.hideNsfw,
+    showHidden: !this.hideNsfwLocal
   }),
   computed: {
     type () {
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index e0eba6a9..577f8444 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="attachment" :class="type">
-    <a class="image-attachment" v-if="hidden" v-on:click.prevent="toggleHidden()">
+    <a class="image-attachment" v-if="hidden && hideNsfwLocal" v-on:click.prevent="toggleHidden()">
       <img :key="nsfwImage" :src="nsfwImage"></img>
     </a>
-    <div class="hider" v-if="nsfw && !hidden">
+    <div class="hider" v-if="nsfw && !hidden && hideNsfwLocal">
       <a href="#" @click.prevent="toggleHidden()">Hide</a>
     </div>
 
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 61236af2..7d58b64c 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -4,6 +4,7 @@ const settings = {
   data () {
     return {
       hideAttachmentsLocal: this.$store.state.config.hideAttachments
+      hideNsfwLocal: this.$store.state.config.hideNsfw
     }
   },
   components: {
@@ -13,6 +14,9 @@ const settings = {
     hideAttachmentsLocal (value) {
       this.$store.dispatch('setOption', { name: 'hideAttachments', value })
     }
+    hideNsfwLocal (value) {
+      this.$store.dispatch('setOption', { name: 'hideNsfw', value })
+    }
   }
 }
 
diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
index f2f83953..89b89a39 100644
--- a/src/components/settings/settings.vue
+++ b/src/components/settings/settings.vue
@@ -12,6 +12,8 @@
         <h2>Attachments</h2>
         <input type="checkbox" id="hideAttachments" v-model="hideAttachmentsLocal">
         <label for="hideAttachments">Hide Attachments</label>
+        <input type="checkbox" id="hideNsfw" v-model="hideNsfwLocal">
+        <label for="hideNsfw">Enable clickthrough NSFW attachment hiding</label>
       </div>
     </div>
   </div>
diff --git a/src/main.js b/src/main.js
index 51d281fa..e553d9aa 100644
--- a/src/main.js
+++ b/src/main.js
@@ -29,7 +29,10 @@ Vue.use(VueTimeago, {
 })
 
 const persistedStateOptions = {
-  paths: ['users.users', 'statuses.notifications', 'config.hideAttachments']
+  paths: ['config.hideAttachments',
+          'config.hideNsfw',
+          'statuses.notifications',
+          'users.users']
 }
 
 const store = new Vuex.Store({
diff --git a/src/modules/config.js b/src/modules/config.js
index 25de98ea..896a6978 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -4,7 +4,8 @@ import StyleSetter from '../services/style_setter/style_setter.js'
 const defaultState = {
   name: 'Pleroma FE',
   colors: {},
-  hideAttachments: false
+  hideAttachments: false,
+  hideNsfw: true
 }
 
 const config = {
-- 
cgit v1.2.3-70-g09d2


From c338940084d7311844d2dd5c11c92f95ab47f486 Mon Sep 17 00:00:00 2001
From: "Hector A. Escobedo" <ninjahector.escobedo@gmail.com>
Date: Wed, 22 Feb 2017 18:59:48 -0500
Subject: Fix syntax errors and hiding logic.

This has been tested.
---
 src/components/attachment/attachment.js  | 14 ++++++++------
 src/components/attachment/attachment.vue |  4 ++--
 src/components/settings/settings.js      |  4 ++--
 src/main.js                              |  6 +++---
 4 files changed, 15 insertions(+), 13 deletions(-)

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

diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js
index 8e959903..f4f6aebf 100644
--- a/src/components/attachment/attachment.js
+++ b/src/components/attachment/attachment.js
@@ -7,17 +7,19 @@ const Attachment = {
     'nsfw',
     'statusId'
   ],
-  data: () => ({
-    nsfwImage,
-    hideNsfwLocal: this.$store.state.config.hideNsfw,
-    showHidden: !this.hideNsfwLocal
-  }),
+  data () {
+    return {
+      nsfwImage,
+      hideNsfwLocal: this.$store.state.config.hideNsfw,
+      showHidden: false
+    }
+  },
   computed: {
     type () {
       return fileTypeService.fileType(this.attachment.mimetype)
     },
     hidden () {
-      return this.nsfw && !this.showHidden
+      return this.nsfw && this.hideNsfwLocal && !this.showHidden
     }
   },
   methods: {
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 577f8444..45cc1929 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="attachment" :class="type">
-    <a class="image-attachment" v-if="hidden && hideNsfwLocal" v-on:click.prevent="toggleHidden()">
+    <a class="image-attachment" v-if="hidden" v-on:click.prevent="toggleHidden()">
       <img :key="nsfwImage" :src="nsfwImage"></img>
     </a>
-    <div class="hider" v-if="nsfw && !hidden && hideNsfwLocal">
+    <div class="hider" v-if="nsfw && hideNsfwLocal && !hidden">
       <a href="#" @click.prevent="toggleHidden()">Hide</a>
     </div>
 
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 7d58b64c..c1b88f82 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -3,7 +3,7 @@ import StyleSwitcher from '../style_switcher/style_switcher.vue'
 const settings = {
   data () {
     return {
-      hideAttachmentsLocal: this.$store.state.config.hideAttachments
+      hideAttachmentsLocal: this.$store.state.config.hideAttachments,
       hideNsfwLocal: this.$store.state.config.hideNsfw
     }
   },
@@ -13,7 +13,7 @@ const settings = {
   watch: {
     hideAttachmentsLocal (value) {
       this.$store.dispatch('setOption', { name: 'hideAttachments', value })
-    }
+    },
     hideNsfwLocal (value) {
       this.$store.dispatch('setOption', { name: 'hideNsfw', value })
     }
diff --git a/src/main.js b/src/main.js
index e553d9aa..81534cae 100644
--- a/src/main.js
+++ b/src/main.js
@@ -30,9 +30,9 @@ Vue.use(VueTimeago, {
 
 const persistedStateOptions = {
   paths: ['config.hideAttachments',
-          'config.hideNsfw',
-          'statuses.notifications',
-          'users.users']
+    'config.hideNsfw',
+    'statuses.notifications',
+    'users.users']
 }
 
 const store = new Vuex.Store({
-- 
cgit v1.2.3-70-g09d2


From 9dfcf8a301c37b359cf18880732ad63b413ce63e Mon Sep 17 00:00:00 2001
From: shpuld <shpuld@gmail.com>
Date: Fri, 24 Feb 2017 17:32:41 +0200
Subject: Align attachments with usercard, make buttons use theme colors,
 prettify login form, more border radii adjustment for consistency.

---
 src/App.scss                                       |  5 +++--
 src/components/attachment/attachment.vue           | 13 +++++++------
 src/components/login_form/login_form.vue           | 22 ++++++++++++++++++++--
 src/components/notifications/notifications.scss    |  4 ++++
 src/components/notifications/notifications.vue     |  2 +-
 .../post_status_form/post_status_form.vue          | 13 +++++++------
 src/components/status/status.vue                   |  3 ++-
 .../user_card_content/user_card_content.vue        | 13 ++++++-------
 8 files changed, 50 insertions(+), 25 deletions(-)

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

diff --git a/src/App.scss b/src/App.scss
index 1e38275e..75f825ee 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -35,7 +35,8 @@ button{
     cursor: pointer;
 
     &:hover {
-        background-color: white;
+        //background-color: white;
+        opacity: 0.8;
     }
 }
 
@@ -175,7 +176,7 @@ status-text-container {
             margin-top: 0.2em;
             float: right;
             margin-right: 0.3em;
-            border-radius: 20%;
+            border-radius: 5px;
         }
     }
 
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 45cc1929..ad60acf9 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -34,9 +34,10 @@
   .attachments {
       display: flex;
       flex-wrap: wrap;
+      margin-right: -0.8em;
       .attachment {
           flex: 1 0 30%;
-          margin: 0.5em 0.8em 0.6em 0.1em;
+          margin: 0.5em 0.8em 0.6em 0.0em;
           align-self: flex-start;
 
           &.html {
@@ -49,14 +50,14 @@
               margin: 10px;
               padding: 5px;
               background: rgba(230,230,230,0.6);
-              border-radius: 0.5em;
+              border-radius: 5px;
               font-weight: bold;
           }
 
           video {
               height: 100%;
               border: 1px solid;
-              border-radius: 0.5em;
+              border-radius: 5px;
               width: 100%;
           }
 
@@ -69,7 +70,7 @@
               height: 100%;
               flex: 1;
               border: 1px solid;
-              border-radius: 0.5em;
+              border-radius: 5px;
           }
 
 
@@ -89,7 +90,7 @@
                   flex: 1;
                   img {
                       border: 0px;
-                      border-radius: 0;
+                      border-radius: 5px;
                       height: 100%;
                       object-fit: cover;
                   }
@@ -113,7 +114,7 @@
                   width: 100%;
                   border-style: solid;
                   border-width: 1px;
-                  border-radius: 0.5em;
+                  border-radius: 5px;
                   width: 100%;
                   height: 100%; /* If this isn't here, chrome will stretch the images */
               }
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index c0169a08..47495a48 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -5,7 +5,7 @@
       Log in
     </div>
     <div class="panel-body">
-      <form v-on:submit.prevent='submit(user)'>
+      <form v-on:submit.prevent='submit(user)' class='login-form'>
         <div class='form-group'>
           <label for='username'>Username</label>
           <input :disabled="loggingIn" v-model='user.username' class='form-control' id='username' placeholder='e.g. lain'>
@@ -15,7 +15,7 @@
           <input :disabled="loggingIn" v-model='user.password' class='form-control' id='password' type='password'>
         </div>
         <div class='form-group'>
-          <button :disabled="loggingIn" type='submit' class='btn btn-default'>Submit</button>
+          <button :disabled="loggingIn" type='submit' class='btn btn-default base05 base01-background'>Submit</button>
         </div>
       </form>
     </div>
@@ -23,3 +23,21 @@
 </template>
 
 <script src="./login_form.js" ></script>
+
+<style lang="scss">
+
+.login-form {
+  input {
+    border-width: 1px;
+    border-style: solid;
+    border-radius: 5px;
+    padding: 0.2em;
+  }
+
+  .btn {
+    margin-top: 0.5em;
+    min-height: 28px;
+  }
+}
+
+</style>
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 517afeaa..fe0cca10 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -1,4 +1,8 @@
 @import '../../_variables.scss';
+
+.notifications button {
+  min-height: 20px;
+}
 .notification {
   padding: 0.4em 0 0 0.7em;
   display: flex;
diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue
index 785cc019..36908b1e 100644
--- a/src/components/notifications/notifications.vue
+++ b/src/components/notifications/notifications.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="notifications">
     <div class="panel panel-default base00-background">
-      <div class="panel-heading base01-background base04">Notifications ({{unseenCount}}) <button @click.prevent="markAsSeen">Read!</button></div>
+      <div class="panel-heading base01-background base04">Notifications ({{unseenCount}}) <button @click.prevent="markAsSeen" class="base05 base02-background">Read!</button></div>
       <div class="panel-body">
         <div v-for="notification in visibleNotifications" class="notification" :class='{"base01-background": notification.seen}'>
           <a :href="notification.action.user.statusnet_profile_url">
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index d345ec13..ef8034a3 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -2,7 +2,7 @@
   <div class="post-status-form">
     <form @submit.prevent="postStatus(newStatus)">
       <div class="form-group" >
-        <textarea v-model="newStatus.status" placeholder="Just landed in L.A." rows="3" class="form-control" @keyup.meta.enter="postStatus(newStatus)" @keyup.ctrl.enter="postStatus(newStatus)" @drop="fileDrop" @dragover.prevent="fileDrag"></textarea>
+        <textarea v-model="newStatus.status" placeholder="Just landed in L.A." rows="3" class="form-control base05-border" @keyup.meta.enter="postStatus(newStatus)" @keyup.ctrl.enter="postStatus(newStatus)" @drop="fileDrop" @dragover.prevent="fileDrag"></textarea>
       </div>
       <div class="attachments">
         <div class="attachment" v-for="file in newStatus.files">
@@ -15,7 +15,7 @@
       </div>
       <div class='form-bottom'>
         <media-upload @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="enableSubmit" :drop-files="dropFiles"></media-upload>
-        <button :disabled="submitDisabled" type="submit" class="btn btn-default">Submit</button>
+        <button :disabled="submitDisabled" type="submit" class="btn btn-default base05 base01-background">Submit</button>
       </div>
     </form>
   </div>
@@ -58,7 +58,7 @@
             margin: 10px;
             padding: 5px;
             background: rgba(230,230,230,0.6);
-            border-radius: 0.5em;
+            border-radius: 5px;
             font-weight: bold;
          }
      }
@@ -77,10 +77,11 @@
      }
 
      form textarea {
-         border: none;
-         border-radius: 2px;
+         border: solid;
+         border-width: 1px;
+         border-radius: 5px;
          line-height:16px;
-         padding: 0.5em;
+         padding: 5px;
          resize: vertical;
      }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 712f1a7b..585bf621 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -157,7 +157,8 @@
  .usercard {
    border-style: solid;
    border-width: 1px;
-   border-radius: 0.5em;
+   border-radius: 10px;
    margin-bottom: 1em;
+   margin-top: 0.2em;
  }
 </style>
diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue
index 10064d5f..fcdc7cca 100644
--- a/src/components/user_card_content/user_card_content.vue
+++ b/src/components/user_card_content/user_card_content.vue
@@ -15,22 +15,22 @@
           <div class="follow" v-if="loggedIn">
             <span v-if="user.following">
               <!--Following them!-->
-              <button @click="unfollowUser" class="base06 base01-background">
+              <button @click="unfollowUser" class="base01 base04-background">
                 Unfollow
               </button>
             </span>
             <span v-if="!user.following">
-              <button @click="followUser" class="base01 base04-background">
+              <button @click="followUser" class="base05 base01-background">
                 Follow
               </button>
             </span>
           </div>
           <div class='mute' v-if='isOtherUser'>
             <span v-if='user.muted'>
-              <button @click="toggleMute" class="base04 base01-background base06-border">Unmute</button>
+              <button @click="toggleMute" class="base01 base04-background">Unmute</button>
             </span>
             <span v-if='!user.muted'>
-              <button @click="toggleMute" class="base01 base04-background base01-border">Mute</button>
+              <button @click="toggleMute" class="base05 base01-background">Mute</button>
             </span>
           </div>
         </div>
@@ -102,7 +102,7 @@
 .profile-panel-background {
   background-color: #121517;
   background-size: cover;
-  border-radius: 0.5em 0.5em 0 0;
+  border-radius: 10px;
 }
 
 .profile-panel-body {
@@ -127,7 +127,7 @@
 
   img {
       border: 2px solid;
-      border-radius: 0.5em;
+      border-radius: 5px;
       flex: 1 0 100%;
       max-width: 48px;
       max-height: 48px;
@@ -185,7 +185,6 @@
     button {
       width: 92%;
       height: 100%;
-      border: 1px solid;
     }
   }
 }
-- 
cgit v1.2.3-70-g09d2

