monkee.ch/monkeeShark
1
0
Fork 0
Code Pull requests Activity

[Client] Improve theme 🎨

Browse source
This commit is contained in:
syuilo 2018-12-31 02:33:03 +09:00
parent 5692ae59a1
commit 4d0b335748
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
7 changed files with 28 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/client/app/common/views/components/ui/radio.vue
View file

@ -64,10 +64,10 @@ export default Vue.extend({
&.checked &.checked
> .button > .button
border-color var(--primary) border-color var(--radioActive)
&:after &:after
background-color var(--primary) background-color var(--radioActive)
transform scale(1) transform scale(1)
opacity 1 opacity 1

6
src/client/app/common/views/components/ui/switch.vue
View file

@ -77,11 +77,11 @@ export default Vue.extend({
&.checked &.checked
> .button > .button
background-color var(--primaryAlpha04) background-color var(--switchActiveTrack)
border-color var(--primaryAlpha04) border-color var(--switchActiveTrack)
> * > *
background-color var(--primary) background-color var(--switchActive)
transform translateX(14px) transform translateX(14px)
> input > input

6
src/client/style.styl
View file

@ -22,7 +22,7 @@ html, body
a a
text-decoration none text-decoration none
color var(--primary) color var(--link)
cursor pointer cursor pointer
&:hover &:hover
@ -33,7 +33,7 @@ a
@css { @css {
a { a {
tap-highlight-color: var(--primaryAlpha07) !important; tap-highlight-color: var(--linkTapHighlight) !important;
-webkit-tap-highlight-color: var(--primaryAlpha07) !important; -webkit-tap-highlight-color: var(--linkTapHighlight) !important;
} }
} }

7
src/client/theme/dark.json5
View file

@ -24,8 +24,15 @@
scrollbarHandle: ':lighten<5<$secondary', scrollbarHandle: ':lighten<5<$secondary',
scrollbarHandleHover: ':lighten<10<$secondary', scrollbarHandleHover: ':lighten<10<$secondary',
link: '$primary',
linkTapHighlight: ':alpha<0.7<@link',
notificationIndicator: '$primary', notificationIndicator: '$primary',
switchActive: '$primary',
switchActiveTrack: ':alpha<0.4<@switchActive',
radioActive: '$primary',
face: '$secondary', face: '$secondary',
faceText: '#fff', faceText: '#fff',
faceHeader: ':lighten<5<$secondary', faceHeader: ':lighten<5<$secondary',

3
src/client/theme/gruvbox-dark.json5
View file

@ -22,5 +22,8 @@
mfmLink: 'rgb(104, 157, 106)', mfmLink: 'rgb(104, 157, 106)',
mfmHashtag: 'rgb(251, 73, 52)', mfmHashtag: 'rgb(251, 73, 52)',
notificationIndicator: 'rgb(184, 187, 38)', notificationIndicator: 'rgb(184, 187, 38)',
switchActive: 'rgb(254, 128, 25)',
radioActive: 'rgb(131, 165, 152)',
link: 'rgb(104, 157, 106)',
}, },
} }

7
src/client/theme/light.json5
View file

@ -24,8 +24,15 @@
scrollbarHandle: '#00000033', scrollbarHandle: '#00000033',
scrollbarHandleHover: '#00000066', scrollbarHandleHover: '#00000066',
link: '$primary',
linkTapHighlight: ':alpha<0.7<@link',
notificationIndicator: '$primary', notificationIndicator: '$primary',
switchActive: '$primary',
switchActiveTrack: ':alpha<0.4<@switchActive',
radioActive: '$primary',
face: '$secondary', face: '$secondary',
faceText: '$text', faceText: '$text',
faceHeader: ':lighten<5<$secondary', faceHeader: ':lighten<5<$secondary',

3
src/client/theme/monokai.json5
View file

@ -22,5 +22,8 @@
mfmLink: '#e6db74', mfmLink: '#e6db74',
mfmHashtag: '#fd971f', mfmHashtag: '#fd971f',
notificationIndicator: '#66d9ef', notificationIndicator: '#66d9ef',
switchActive: 'rgb(166, 226, 46)',
radioActive: '#fd971f',
link: '#e6db74',
}, },
} }