zotan/FoundKey
1
0
Fork 0
forked from FoundKeyGang/FoundKey
Code Pull requests Activity

🎨

Browse source
This commit is contained in:
syuilo 2019-02-26 14:02:23 +09:00
parent e7032363d7
commit 8db8d3f39e
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
9 changed files with 31 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/client/app/common/views/components/ui/card.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="ui-card" :class="{ shadow: $store.state.settings.useShadow }">
<div class="ui-card" :class="{ shadow: $store.state.device.useShadow }">
<header>
<slot name="title"></slot>
</header>

8
src/client/app/common/views/deck/deck.column.vue
View file

@ -1,6 +1,5 @@
<template>
<div class="dnpfarvgbnfmyzbdquhhzyxcmstpdqzs" :class="{ naked, narrow, active, isStacked, draghover, dragging, dropready }"
:data-mobile="$root.isMobile"
@dragover.prevent.stop="onDragover"
@dragleave="onDragleave"
@drop.prevent.stop="onDrop"
@ -327,13 +326,6 @@ export default Vue.extend({
box-shadow var(--shadow)
overflow hidden
&[data-mobile]
border-radius 0
box-shadow none
> header
box-shadow none
&.draghover
box-shadow 0 0 0 2px var(--primaryAlpha08)

13
src/client/app/common/views/deck/deck.vue
View file

@ -1,6 +1,6 @@
<template>
<mk-ui :class="$style.root">
<div class="qlvquzbjribqcaozciifydkngcwtyzje" :data-mobile="$root.isMobile" ref="body" :style="style" :class="`${$store.state.device.deckColumnAlign} ${$store.state.device.deckColumnWidth}`" v-hotkey.global="keymap">
<div class="qlvquzbjribqcaozciifydkngcwtyzje" ref="body" :style="style" :class="`${$store.state.device.deckColumnAlign} ${$store.state.device.deckColumnWidth}`" v-hotkey.global="keymap">
<template v-for="ids in layout">
<div v-if="ids.length > 1" class="folder">
<template v-for="id, i in ids">
@ -332,15 +332,8 @@ export default Vue.extend({
overflow-y hidden
-webkit-overflow-scrolling touch
&[data-mobile]
padding 0
> div
margin-right 0
&.folder
> *:not(:last-child)
margin-bottom 0
@media (max-width 500px)
padding 8px 0 8px 8px
> div
margin-right 8px

8
src/client/app/desktop/views/components/settings.vue
View file

@ -387,13 +387,13 @@ export default Vue.extend({
},
useShadow: {
get() { return this.$store.state.settings.useShadow; },
set(value) { this.$store.dispatch('settings/set', { key: 'useShadow', value }); }
get() { return this.$store.state.device.useShadow; },
set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); }
},
roundedCorners: {
get() { return this.$store.state.settings.roundedCorners; },
set(value) { this.$store.dispatch('settings/set', { key: 'roundedCorners', value }); }
get() { return this.$store.state.device.roundedCorners; },
set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); }
},
lineWidth: {

2
src/client/app/desktop/views/components/ui.header.vue
View file

@ -61,7 +61,7 @@ export default Vue.extend({
computed: {
style(): any {
return {
'box-shadow': this.$store.state.settings.useShadow ? '0 0px 8px rgba(0, 0, 0, 0.2)' : 'none'
'box-shadow': this.$store.state.device.useShadow ? '0 0px 8px rgba(0, 0, 0, 0.2)' : 'none'
};
}
},

8
src/client/app/init.ts
View file

@ -405,13 +405,13 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS)
const shadow = '0 3px 8px rgba(0, 0, 0, 0.2)';
const shadowRight = '4px 0 4px rgba(0, 0, 0, 0.1)';
const shadowLeft = '-4px 0 4px rgba(0, 0, 0, 0.1)';
if (os.store.state.settings.useShadow) {
if (os.store.state.device.useShadow) {
document.documentElement.style.setProperty('--shadow', shadow);
document.documentElement.style.setProperty('--shadowRight', shadowRight);
document.documentElement.style.setProperty('--shadowLeft', shadowLeft);
}
os.store.watch(s => {
return s.settings.useShadow;
return s.device.useShadow;
}, v => {
document.documentElement.style.setProperty('--shadow', v ? shadow : 'none');
document.documentElement.style.setProperty('--shadowRight', v ? shadowRight : 'none');
@ -421,9 +421,9 @@ export default (callback: (launch: (router: VueRouter) => [Vue, MiOS], os: MiOS)
//#region rounded corners
const round = '6px';
if (os.store.state.settings.roundedCorners) document.documentElement.style.setProperty('--round', round);
if (os.store.state.device.roundedCorners) document.documentElement.style.setProperty('--round', round);
os.store.watch(s => {
return s.settings.roundedCorners;
return s.device.roundedCorners;
}, v => {
document.documentElement.style.setProperty('--round', v ? round : '0');
});

10
src/client/app/mobile/views/components/ui-container.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="ukygtjoj" :class="{ naked, inDeck, inNakedDeckColumn, hideHeader: !showHeader }">
<div class="ukygtjoj" :class="{ naked, inNakedDeckColumn, hideHeader: !showHeader, shadow: $store.state.device.useShadow }">
<header v-if="showHeader">
<div class="title"><slot name="header"></slot></div>
<slot name="func"></slot>
@ -36,9 +36,6 @@ export default Vue.extend({
},
},
inject: {
inDeck: {
default: false
},
inNakedDeckColumn: {
default: false
}
@ -60,12 +57,11 @@ export default Vue.extend({
.ukygtjoj
overflow hidden
&.inDeck
box-shadow none !important
&:not(.inNakedDeckColumn)
background var(--face)
border-radius 8px
&.shadow
box-shadow 0 4px 16px rgba(#000, 0.1)
& + .ukygtjoj

12
src/client/app/mobile/views/pages/settings.vue
View file

@ -15,6 +15,8 @@
<section>
<ui-switch v-model="darkmode">{{ $t('dark-mode') }}</ui-switch>
<ui-switch v-model="useShadow">{{ $t('use-shadow') }}</ui-switch>
<ui-switch v-model="roundedCorners">{{ $t('rounded-corners') }}</ui-switch>
<ui-switch v-model="circleIcons">{{ $t('circle-icons') }}</ui-switch>
<section>
<header>{{ $t('@.line-width') }}</header>
@ -214,6 +216,16 @@ export default Vue.extend({
set(value) { this.$store.commit('device/set', { key: 'darkmode', value }); }
},
useShadow: {
get() { return this.$store.state.device.useShadow; },
set(value) { this.$store.commit('device/set', { key: 'useShadow', value }); }
},
roundedCorners: {
get() { return this.$store.state.device.roundedCorners; },
set(value) { this.$store.commit('device/set', { key: 'roundedCorners', value }); }
},
useOsDefaultEmojis: {
get() { return this.$store.state.device.useOsDefaultEmojis; },
set(value) { this.$store.commit('device/set', { key: 'useOsDefaultEmojis', value }); }

4
src/client/app/store.ts
View file

@ -17,8 +17,6 @@ const defaultSettings = {
showPostFormOnTopOfTl: false,
suggestRecentHashtags: true,
showClockOnHeader: true,
useShadow: true,
roundedCorners: false,
circleIcons: true,
contrastedAcct: true,
showFullAcct: false,
@ -48,6 +46,8 @@ const defaultDeviceSettings = {
deckMode: false,
deckColumnAlign: 'center',
deckColumnWidth: 'normal',
useShadow: true,
roundedCorners: false,
reduceMotion: false,
autoPopout: false,
darkmode: false,