Compare commits
8 commits
develop
...
layout-ove
Author | SHA1 | Date | |
---|---|---|---|
|
9578082f11 | ||
|
a3e554fec6 | ||
|
9fbb25c3cb | ||
|
f87731f3f8 | ||
|
cb9c800e5f | ||
|
111821ca3e | ||
|
3fa9b39150 | ||
|
c241de4634 |
6 changed files with 29 additions and 18 deletions
|
@ -53,7 +53,8 @@ export default {
|
||||||
},
|
},
|
||||||
logoBgStyle () {
|
logoBgStyle () {
|
||||||
return Object.assign({
|
return Object.assign({
|
||||||
'margin': `${this.$store.state.instance.logoMargin} 0`
|
'margin-top': `${this.$store.state.instance.logoMargin}`,
|
||||||
|
'margin-bottom': `${this.$store.state.instance.logoMargin}`
|
||||||
}, this.enableMask ? {} : {
|
}, this.enableMask ? {} : {
|
||||||
'background-color': this.enableMask ? '' : 'transparent'
|
'background-color': this.enableMask ? '' : 'transparent'
|
||||||
})
|
})
|
||||||
|
@ -62,6 +63,7 @@ export default {
|
||||||
style () { return { 'background-image': `url(${this.background})` } },
|
style () { return { 'background-image': `url(${this.background})` } },
|
||||||
sitename () { return this.$store.state.instance.name },
|
sitename () { return this.$store.state.instance.name },
|
||||||
chat () { return this.$store.state.chat.channel.state === 'joined' },
|
chat () { return this.$store.state.chat.channel.state === 'joined' },
|
||||||
|
sitenameEnabled () { return this.$store.state.instance.sitenameEnabled },
|
||||||
suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
|
suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
|
||||||
showInstanceSpecificPanel () { return this.$store.state.instance.showInstanceSpecificPanel }
|
showInstanceSpecificPanel () { return this.$store.state.instance.showInstanceSpecificPanel }
|
||||||
},
|
},
|
||||||
|
|
23
src/App.scss
23
src/App.scss
|
@ -207,7 +207,7 @@ i[class*=icon-] {
|
||||||
}
|
}
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
flex: 1;
|
flex: 1 0 auto;
|
||||||
line-height: 50px;
|
line-height: 50px;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -220,7 +220,7 @@ i[class*=icon-] {
|
||||||
}
|
}
|
||||||
|
|
||||||
&.right {
|
&.right {
|
||||||
justify-content: right;
|
justify-content: flex-end;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -237,20 +237,18 @@ nav {
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
display: flex;
|
display: flex;
|
||||||
position: absolute;
|
position: relative;
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
margin-right: .5em;
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
|
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
justify-content: center;
|
justify-content: flex-start;
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
z-index: -1;
|
z-index: -1;
|
||||||
|
|
||||||
.mask {
|
.mask {
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-position: center;
|
mask-position: left center;
|
||||||
mask-size: contain;
|
mask-size: contain;
|
||||||
background-color: $fallback--fg;
|
background-color: $fallback--fg;
|
||||||
background-color: var(--fg, $fallback--fg);
|
background-color: var(--fg, $fallback--fg);
|
||||||
|
@ -269,6 +267,10 @@ nav {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.site-name {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
.inner-nav {
|
.inner-nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -459,9 +461,6 @@ nav {
|
||||||
.back-button {
|
.back-button {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.site-name {
|
|
||||||
padding-left: 20px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-bounds {
|
.sidebar-bounds {
|
||||||
|
|
14
src/App.vue
14
src/App.vue
|
@ -1,16 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="app" v-bind:style="style">
|
<div id="app" v-bind:style="style">
|
||||||
<nav class='container' @click="scrollToTop()" id="nav">
|
<nav class='container' @click="scrollToTop()" id="nav">
|
||||||
<div class='logo' :style='logoBgStyle'>
|
|
||||||
<div class='mask' :style='logoMaskStyle'></div>
|
|
||||||
<img :src='logo' :style='logoStyle'>
|
|
||||||
</div>
|
|
||||||
<div class='inner-nav'>
|
<div class='inner-nav'>
|
||||||
<div class='item'>
|
<div class='item'>
|
||||||
<router-link class="back-button" @click.native="activatePanel('timeline')" :to="{ name: 'root' }" active-class="hidden">
|
<router-link class="back-button" @click.native="activatePanel('timeline')" :to="{ name: 'root' }" active-class="hidden">
|
||||||
<i class="icon-left-open" :title="$t('nav.back')"></i>
|
<i class="icon-left-open" :title="$t('nav.back')"></i>
|
||||||
</router-link>
|
</router-link>
|
||||||
<router-link class="site-name" :to="{ name: 'root' }" active-class="home">{{sitename}}</router-link>
|
<router-link class="site-name" :to="{ name: 'root' }" active-class="home">
|
||||||
|
<div class='logo' :style='logoBgStyle'>
|
||||||
|
<div class='mask' :style='logoMaskStyle'></div>
|
||||||
|
<img :src='logo' :style='logoStyle'>
|
||||||
|
</div>
|
||||||
|
<span v-if="sitenameEnabled" class="site-name_text">
|
||||||
|
{{sitename}}
|
||||||
|
</span>
|
||||||
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
<div class='item right'>
|
<div class='item right'>
|
||||||
<user-finder class="nav-icon"></user-finder>
|
<user-finder class="nav-icon"></user-finder>
|
||||||
|
|
|
@ -58,6 +58,8 @@ const afterStoreSetup = ({store, i18n}) => {
|
||||||
var loginMethod = (config.loginMethod)
|
var loginMethod = (config.loginMethod)
|
||||||
var scopeCopy = (config.scopeCopy)
|
var scopeCopy = (config.scopeCopy)
|
||||||
var subjectLineBehavior = (config.subjectLineBehavior)
|
var subjectLineBehavior = (config.subjectLineBehavior)
|
||||||
|
var alwaysShowSubjectInput = (config.alwaysShowSubjectInput)
|
||||||
|
var sitenameEnabled = (config.sitenameEnabled)
|
||||||
|
|
||||||
store.dispatch('setInstanceOption', { name: 'theme', value: theme })
|
store.dispatch('setInstanceOption', { name: 'theme', value: theme })
|
||||||
store.dispatch('setInstanceOption', { name: 'background', value: background })
|
store.dispatch('setInstanceOption', { name: 'background', value: background })
|
||||||
|
@ -75,6 +77,8 @@ const afterStoreSetup = ({store, i18n}) => {
|
||||||
store.dispatch('setInstanceOption', { name: 'loginMethod', value: loginMethod })
|
store.dispatch('setInstanceOption', { name: 'loginMethod', value: loginMethod })
|
||||||
store.dispatch('setInstanceOption', { name: 'scopeCopy', value: scopeCopy })
|
store.dispatch('setInstanceOption', { name: 'scopeCopy', value: scopeCopy })
|
||||||
store.dispatch('setInstanceOption', { name: 'subjectLineBehavior', value: subjectLineBehavior })
|
store.dispatch('setInstanceOption', { name: 'subjectLineBehavior', value: subjectLineBehavior })
|
||||||
|
store.dispatch('setInstanceOption', { name: 'alwaysShowSubjectInput', value: alwaysShowSubjectInput })
|
||||||
|
store.dispatch('setInstanceOption', { name: 'sitenameEnabled', value: sitenameEnabled })
|
||||||
if (chatDisabled) {
|
if (chatDisabled) {
|
||||||
store.dispatch('disableChat')
|
store.dispatch('disableChat')
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,6 +25,7 @@ const defaultState = {
|
||||||
scopeCopy: true,
|
scopeCopy: true,
|
||||||
subjectLineBehavior: 'email',
|
subjectLineBehavior: 'email',
|
||||||
loginMethod: 'password',
|
loginMethod: 'password',
|
||||||
|
sitenameEnabled: true,
|
||||||
|
|
||||||
// Nasty stuff
|
// Nasty stuff
|
||||||
pleromaBackend: true,
|
pleromaBackend: true,
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
"scopeCopy": false,
|
"scopeCopy": false,
|
||||||
"subjectLineBehavior": "email",
|
"subjectLineBehavior": "email",
|
||||||
"alwaysShowSubjectInput": true,
|
"alwaysShowSubjectInput": true,
|
||||||
|
"sitenameEnabled": true,
|
||||||
"hidePostStats": false,
|
"hidePostStats": false,
|
||||||
"hideUserStats": false,
|
"hideUserStats": false,
|
||||||
"loginMethod": "password"
|
"loginMethod": "password"
|
||||||
|
|
Loading…
Reference in a new issue