From 330288b4cd874bb960735edb1acde01b0bfbf684 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 28 Aug 2018 16:14:32 +0300
Subject: panel styling cleanup

---
 src/App.scss | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index 3b8b3224..b4692f26 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -48,7 +48,7 @@ a {
   color: var(--link, $fallback--link);
 }
 
-button{
+button {
   user-select: none;
   color: $fallback--fg;
   color: var(--fg, $fallback--fg);
@@ -282,15 +282,25 @@ main-router {
 }
 
 .panel-heading {
+  display: flex;
   border-radius: $fallback--panelRadius $fallback--panelRadius 0 0;
   border-radius: var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius) 0 0;
   background-size: cover;
-  padding: 0.6em 1.0em;
+  padding: .6em .6em;
   text-align: left;
   font-size: 1.3em;
   line-height: 24px;
   background-color: $fallback--btn;
   background-color: var(--btn, $fallback--btn);
+  align-items: baseline;
+
+  .title {
+    flex: 1 0 auto;
+  }
+
+  button {
+    height: 100%;
+  }
 }
 
 .panel-heading.stub {
@@ -460,4 +470,3 @@ nav {
   border-radius: $fallback--inputRadius;
   border-radius: var(--inputRadius, $fallback--inputRadius);
 }
-
-- 
cgit v1.2.3-70-g09d2


From da362b2b88b9d21a5cca654feafde5bea612a31a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 28 Aug 2018 16:20:04 +0300
Subject: minor style tweaks

---
 src/App.scss                                  | 9 +++++++++
 src/components/tab_switcher/tab_switcher.scss | 4 ----
 2 files changed, 9 insertions(+), 4 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index b4692f26..d0c4b26c 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -64,10 +64,19 @@ button {
   font-size: 14px;
   font-family: sans-serif;
 
+  &::-moz-focus-inner {
+    border: none;
+  }
+
   &:hover {
     box-shadow: 0px 0px 4px rgba(255, 255, 255, 0.3);
   }
 
+  &:active {
+    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
+    border-top: 1px solid rgba(0, 0, 0, 0.2);
+  }
+
   &:disabled {
     cursor: not-allowed;
     opacity: 0.5;
diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss
index f83dc7c2..374a19c5 100644
--- a/src/components/tab_switcher/tab_switcher.scss
+++ b/src/components/tab_switcher/tab_switcher.scss
@@ -26,10 +26,6 @@
       border-bottom-right-radius: 0;
       padding: .3em 1em;
 
-      &::-moz-focus-inner {
-        border: none;
-      }
-
       &:not(.active) {
         border-bottom: 1px solid;
         border-bottom-color: $fallback--btn;
-- 
cgit v1.2.3-70-g09d2


From fa4c4c91226bb46e099a764da2823706fcea3cb8 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 30 Aug 2018 18:23:43 +0300
Subject: fixed #87

---
 src/App.scss | 1 +
 1 file changed, 1 insertion(+)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index d0c4b26c..21279f15 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -114,6 +114,7 @@ input, textarea, .select {
   position: relative;
   height: 29px;
   line-height: 16px;
+  hyphens: none;
 
   .icon-down-open {
     position: absolute;
-- 
cgit v1.2.3-70-g09d2


From 38e3c2493de22251000d00d3067fa54090c38817 Mon Sep 17 00:00:00 2001
From: William Pitcock <nenolod@dereferenced.org>
Date: Fri, 31 Aug 2018 00:42:42 +0000
Subject: add the ability to select a post's content type

---
 src/App.scss                                         |  4 ++++
 src/components/post_status_form/post_status_form.js  |  7 +++++--
 src/components/post_status_form/post_status_form.vue | 20 +++++++++++++++-----
 src/services/api/api.service.js                      |  3 ++-
 src/services/status_poster/status_poster.service.js  |  4 ++--
 5 files changed, 28 insertions(+), 10 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.scss b/src/App.scss
index 3b8b3224..becea1c9 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -451,6 +451,10 @@ nav {
     color: $fallback--lightFg;
     color: var(--lightFg, $fallback--lightFg);
   }
+
+  .text-format {
+    float: right;
+  }
 }
 
 .visibility-notice {
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 06a428ff..7d2735c5 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -55,6 +55,7 @@ const PostStatusForm = {
       newStatus: {
         spoilerText: this.subject,
         status: statusText,
+        contentType: 'text/plain',
         nsfw: false,
         files: [],
         visibility: this.messageScope || this.$store.state.users.currentUser.default_scope
@@ -210,13 +211,15 @@ const PostStatusForm = {
         sensitive: newStatus.nsfw,
         media: newStatus.files,
         store: this.$store,
-        inReplyToStatusId: this.replyTo
+        inReplyToStatusId: this.replyTo,
+        contentType: newStatus.contentType
       }).then((data) => {
         if (!data.error) {
           this.newStatus = {
             status: '',
             files: [],
-            visibility: newStatus.visibility
+            visibility: newStatus.visibility,
+            contentType: newStatus.contentType
           }
           this.$emit('posted')
           let el = this.$el.querySelector('textarea')
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 9f8b2661..ac5da442 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -32,11 +32,21 @@
         @input="resize"
         @paste="paste">
       </textarea>
-      <div v-if="scopeOptionsEnabled" class="visibility-tray">
-        <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
-        <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
-        <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
-        <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
+      <div class="visibility-tray">
+        <span class="text-format">
+          <select v-model="newStatus.contentType" class="form-control">
+            <option value="text/plain">Plain text</option>
+            <option value="text/html">HTML</option>
+            <option value="text/markdown">Markdown</option>
+          </select>
+        </span>
+
+        <div v-if="scopeOptionsEnabled">
+          <i v-on:click="changeVis('direct')" class="icon-mail-alt" :class="vis.direct" :title="$t('post_status.scope.direct')"></i>
+          <i v-on:click="changeVis('private')" class="icon-lock" :class="vis.private" :title="$t('post_status.scope.private')"></i>
+          <i v-on:click="changeVis('unlisted')" class="icon-lock-open-alt" :class="vis.unlisted" :title="$t('post_status.scope.unlisted')"></i>
+          <i v-on:click="changeVis('public')" class="icon-globe" :class="vis.public" :title="$t('post_status.scope.public')"></i>
+        </div>
       </div>
     </div>
     <div style="position:relative;" v-if="candidates">
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index efea86cf..87315657 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -373,7 +373,7 @@ const unretweet = ({ id, credentials }) => {
   })
 }
 
-const postStatus = ({credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId}) => {
+const postStatus = ({credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId, contentType}) => {
   const idsText = mediaIds.join(',')
   const form = new FormData()
 
@@ -382,6 +382,7 @@ const postStatus = ({credentials, status, spoilerText, visibility, sensitive, me
   if (spoilerText) form.append('spoiler_text', spoilerText)
   if (visibility) form.append('visibility', visibility)
   if (sensitive) form.append('sensitive', sensitive)
+  if (contentType) form.append('content_type', contentType)
   form.append('media_ids', idsText)
   if (inReplyToStatusId) {
     form.append('in_reply_to_status_id', inReplyToStatusId)
diff --git a/src/services/status_poster/status_poster.service.js b/src/services/status_poster/status_poster.service.js
index c3bbbaa3..7f8b0fc0 100644
--- a/src/services/status_poster/status_poster.service.js
+++ b/src/services/status_poster/status_poster.service.js
@@ -1,10 +1,10 @@
 import { map } from 'lodash'
 import apiService from '../api/api.service.js'
 
-const postStatus = ({ store, status, spoilerText, visibility, sensitive, media = [], inReplyToStatusId = undefined }) => {
+const postStatus = ({ store, status, spoilerText, visibility, sensitive, media = [], inReplyToStatusId = undefined, contentType = 'text/plain' }) => {
   const mediaIds = map(media, 'id')
 
-  return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId})
+  return apiService.postStatus({credentials: store.state.users.currentUser.credentials, status, spoilerText, visibility, sensitive, mediaIds, inReplyToStatusId, contentType})
     .then((data) => data.json())
     .then((data) => {
       if (!data.error) {
-- 
cgit v1.2.3-70-g09d2


From e99534ef717881d71a6fa975bb5e81fad6399b15 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 31 Aug 2018 04:06:00 +0300
Subject: added option for logo in navbar to follow color scheme of the rest of
 the site also fixed potential mess-up between api/static configs

---
 src/App.js         | 31 +++++++++++++++++++++++++++++--
 src/App.scss       | 33 ++++++++++++++++++++++++++++++---
 src/App.vue        |  6 +++++-
 src/main.js        | 32 +++++++++++++++++++-------------
 static/config.json |  2 ++
 5 files changed, 85 insertions(+), 19 deletions(-)

(limited to 'src/App.scss')

diff --git a/src/App.js b/src/App.js
index a9a46fad..c455c18c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -18,7 +18,14 @@ export default {
     ChatPanel
   },
   data: () => ({
-    mobileActivePanel: 'timeline'
+    mobileActivePanel: 'timeline',
+    supportsMask: window.CSS && window.CSS.supports && (
+      window.CSS.supports('mask-size', 'contain') ||
+        window.CSS.supports('-webkit-mask-size', 'contain') ||
+        window.CSS.supports('-moz-mask-size', 'contain') ||
+        window.CSS.supports('-ms-mask-size', 'contain') ||
+        window.CSS.supports('-o-mask-size', 'contain')
+    )
   }),
   created () {
     // Load the locale from the storage
@@ -29,7 +36,27 @@ export default {
     background () {
       return this.currentUser.background_image || this.$store.state.config.background
     },
-    logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } },
+    enableMask () { return this.supportsMask && this.$store.state.config.logoMask },
+    logoStyle () {
+      return {
+        'visibility': this.enableMask ? 'hidden' : 'visible'
+      }
+    },
+    logoMaskStyle () {
+      return this.enableMask ? {
+        'mask-image': `url(${this.$store.state.config.logo})`
+      } : {
+        'background-color': this.enableMask ? '' : 'transparent'
+      }
+    },
+    logoBgStyle () {
+      return Object.assign({
+        'margin': `${this.$store.state.config.logoMargin} 0`
+      }, this.enableMask ? {} : {
+        'background-color': this.enableMask ? '' : 'transparent'
+      })
+    },
+    logo () { return this.$store.state.config.logo },
     style () { return { 'background-image': `url(${this.background})` } },
     sitename () { return this.$store.state.config.name },
     chat () { return this.$store.state.chat.channel.state === 'joined' },
diff --git a/src/App.scss b/src/App.scss
index 21279f15..09014c15 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -236,6 +236,36 @@ nav {
   position: fixed;
   height: 50px;
 
+  .logo {
+    display: flex;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+
+    align-items: stretch;
+    justify-content: center;
+    flex: 0 0 auto;
+    z-index: -1;
+    .mask {
+      mask-repeat: no-repeat;
+      mask-position: center;
+      mask-size: contain;
+      background-color: $fallback--fg;
+      background-color: var(--fg, $fallback--fg);
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+    }
+    img {
+      display: block;
+      flex: 0;
+    }
+  }
+
   .inner-nav {
     padding-left: 20px;
     padding-right: 20px;
@@ -244,9 +274,6 @@ nav {
     flex-basis: 970px;
     margin: auto;
     height: 50px;
-    background-repeat: no-repeat;
-    background-position: center;
-    background-size: auto 80%;
 
     a i {
       color: $fallback--link;
diff --git a/src/App.vue b/src/App.vue
index 71e90289..fc446c57 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,11 @@
 <template>
   <div id="app" v-bind:style="style">
     <nav class='container' @click="scrollToTop()" id="nav">
-      <div class='inner-nav' :style="logoStyle">
+      <div class='logo' :style='logoBgStyle'>
+        <div class='mask' :style='logoMaskStyle'></div>
+        <img :src='logo' :style='logoStyle'>
+      </div>
+      <div class='inner-nav'>
         <div class='item'>
           <router-link :to="{ name: 'root'}">{{sitename}}</router-link>
         </div>
diff --git a/src/main.js b/src/main.js
index 6c9bf36e..72806d10 100644
--- a/src/main.js
+++ b/src/main.js
@@ -103,23 +103,29 @@ window.fetch('/api/statusnet/config.json')
     .then((res) => res.json())
     .then((data) => {
       var staticConfig = data
-
-      var theme = (apiConfig.theme || staticConfig.theme)
-      var background = (apiConfig.background || staticConfig.background)
-      var logo = (apiConfig.logo || staticConfig.logo)
-      var redirectRootNoLogin = (apiConfig.redirectRootNoLogin || staticConfig.redirectRootNoLogin)
-      var redirectRootLogin = (apiConfig.redirectRootLogin || staticConfig.redirectRootLogin)
-      var chatDisabled = (apiConfig.chatDisabled || staticConfig.chatDisabled)
-      var showWhoToFollowPanel = (apiConfig.showWhoToFollowPanel || staticConfig.showWhoToFollowPanel)
-      var whoToFollowProvider = (apiConfig.whoToFollowProvider || staticConfig.whoToFollowProvider)
-      var whoToFollowLink = (apiConfig.whoToFollowLink || staticConfig.whoToFollowLink)
-      var showInstanceSpecificPanel = (apiConfig.showInstanceSpecificPanel || staticConfig.showInstanceSpecificPanel)
-      var scopeOptionsEnabled = (apiConfig.scopeOptionsEnabled || staticConfig.scopeOptionsEnabled)
-      var collapseMessageWithSubject = (apiConfig.collapseMessageWithSubject || staticConfig.collapseMessageWithSubject)
+      // This takes static config and overrides properties that are present in apiConfig
+      var config = Object.assign({}, staticConfig, apiConfig)
+
+      var theme = (config.theme)
+      var background = (config.background)
+      var logo = (config.logo)
+      var logoMask = (typeof config.logoMask === 'undefined' ? true : config.logoMask)
+      var logoMargin = (typeof config.logoMargin === 'undefined' ? 0 : config.logoMargin)
+      var redirectRootNoLogin = (config.redirectRootNoLogin)
+      var redirectRootLogin = (config.redirectRootLogin)
+      var chatDisabled = (config.chatDisabled)
+      var showWhoToFollowPanel = (config.showWhoToFollowPanel)
+      var whoToFollowProvider = (config.whoToFollowProvider)
+      var whoToFollowLink = (config.whoToFollowLink)
+      var showInstanceSpecificPanel = (config.showInstanceSpecificPanel)
+      var scopeOptionsEnabled = (config.scopeOptionsEnabled)
+      var collapseMessageWithSubject = (config.collapseMessageWithSubject)
 
       store.dispatch('setOption', { name: 'theme', value: theme })
       store.dispatch('setOption', { name: 'background', value: background })
       store.dispatch('setOption', { name: 'logo', value: logo })
+      store.dispatch('setOption', { name: 'logoMask', value: logoMask })
+      store.dispatch('setOption', { name: 'logoMargin', value: logoMargin })
       store.dispatch('setOption', { name: 'showWhoToFollowPanel', value: showWhoToFollowPanel })
       store.dispatch('setOption', { name: 'whoToFollowProvider', value: whoToFollowProvider })
       store.dispatch('setOption', { name: 'whoToFollowLink', value: whoToFollowLink })
diff --git a/static/config.json b/static/config.json
index afcb0163..ccc4aebd 100644
--- a/static/config.json
+++ b/static/config.json
@@ -2,6 +2,8 @@
   "theme": "pleroma-dark",
   "background": "/static/aurora_borealis.jpg",
   "logo": "/static/logo.png",
+  "logoMask": true,
+  "logoMargin": ".1em",
   "redirectRootNoLogin": "/main/all",
   "redirectRootLogin": "/main/friends",
   "chatDisabled": false,
-- 
cgit v1.2.3-70-g09d2