Skip to content
Snippets Groups Projects
Unverified Commit 0c63ec81 authored by syuilo's avatar syuilo
Browse files

wip

parent 8317a219
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 64 additions and 227 deletions
src/client/app/common/views/components/ui/button.vue
+ 48
− 30
View file @ 0c63ec81
<template>
<div class="ui-button" :class="[styl]">
<button :type="type" @click="$emit('click')">
<slot></slot>
</button>
</div>
<button class="dmtdnykelhudezerjlfpbhgovrgnqqgr" :class="[styl, { inline, primary }]" :type="type" @click="$emit('click')">
<slot></slot>
</button>
</template>
<script lang="ts">
......@@ -13,6 +11,16 @@ export default Vue.extend({
type: {
type: String,
required: false
},
primary: {
type: Boolean,
required: false,
default: false
},
inline: {
type: Boolean,
required: false,
default: false
}
},
data() {
......@@ -32,21 +40,36 @@ export default Vue.extend({
</script>
<style lang="stylus" scoped>
root(fill)
> button
display block
width 100%
margin 0
padding 0
.dmtdnykelhudezerjlfpbhgovrgnqqgr
display block
width 100%
margin 0
padding 0
font-weight normal
font-size 16px
border none
border-radius 6px
outline none
box-shadow none
&.inline
display inline-block
width auto
&.primary
font-weight bold
font-size 16px
line-height 44px
border none
border-radius 6px
outline none
box-shadow none
if fill
&.fill
color var(--text)
background var(--buttonBg)
&:hover
background var(--buttonHoverBg)
&:active
background var(--buttonActiveBg)
&.primary
color var(--primaryForeground)
background var(--primary)
......@@ -55,20 +78,15 @@ root(fill)
&:active
background var(--primaryDarken5)
else
color var(--primary)
background none
&:hover
color var(--primaryDarken5)
&:not(.fill)
color var(--primary)
background none
&:active
background var(--primaryAlpha03)
&:hover
color var(--primaryDarken5)
.ui-button
&.fill
root(true)
&:not(.fill)
root(false)
&:active
background var(--primaryAlpha03)
</style>
src/client/app/common/views/widgets/broadcast.vue
+ 0
− 1
View file @ 0c63ec81
......@@ -5,7 +5,6 @@
:data-found="announcements && announcements.length != 0"
:data-melt="props.design == 1"
:data-mobile="platform == 'mobile'"
:data-darkmode="$store.state.device.darkmode"
>
<div class="icon">
<svg height="32" version="1.1" viewBox="0 0 32 32" width="32">
......
src/client/app/desktop/style.styl
+ 0
− 2
View file @ 0c63ec81
@import "../app"
@import "../reset"
@import "./ui"
*::input-placeholder
color #D8CBC5
......
src/client/app/desktop/ui.styl deleted 100644 → 0
+ 0
− 179
View file @ 8317a219
button
font-family sans-serif
*
pointer-events none
button.ui
.button.ui
display inline-block
cursor pointer
padding 0 14px
margin 0
min-width 100px
line-height 38px
font-size 14px
color #888
text-decoration none
background linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%)
border solid 1px #e2e2e2
border-radius 4px
outline none
&.block
display block
&:focus
&:after
content ""
pointer-events none
position absolute
top -5px
right -5px
bottom -5px
left -5px
border 2px solid var(--primaryAlpha03)
border-radius 8px
&:disabled
opacity 0.7
cursor default
&:hover
background linear-gradient(to bottom, #f9f9f9 0%, #ececec 100%)
border-color #dcdcdc
&:active
background #ececec
border-color #dcdcdc
&.primary
color var(--primaryForeground)
//background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
border solid 1px var(--primaryLighten15)
&:not(:disabled)
font-weight bold
&:hover:not(:disabled)
//background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
border-color var(--primary)
&:active:not(:disabled)
background var(--primary)
border-color var(--primary)
input:not([type]).ui
input[type='text'].ui
input[type='password'].ui
input[type='email'].ui
input[type='date'].ui
input[type='number'].ui
textarea.ui
display block
padding 10px
width 100%
height 40px
font-family sans-serif
font-size 16px
color #55595c
border solid 1px #dadada
border-radius 4px
&:hover
border-color #b0b0b0
&:focus
border-color var(--primary)
textarea.ui
min-width 100%
max-width 100%
min-height 64px
.ui.info
display block
margin 1em 0
padding 0 1em
font-size 90%
color rgba(#000, 0.87)
background #f8f8f9
border solid 1px rgba(34, 36, 38, 0.22)
border-radius 4px
> p
opacity 0.8
> [data-fa]:first-child
margin-right 0.25em
&.warn
color #573a08
background #FFFAF3
border-color #C9BA9B
.ui.from.group
display block
margin 16px 0
> p:first-child
margin 0 0 6px 0
font-size 90%
font-weight bold
color rgba(#373a3c, 0.9)
html[data-darkmode]
button.ui
.button.ui
color #fff
background linear-gradient(to bottom, #313543 0%, #282c37 100%)
border-color #1c2023
&:hover
background linear-gradient(to bottom, #2c2f3c 0%, #22262f 100%)
border-color #151a1d
&:active
background #22262f
border-color #151a1d
&.primary
color var(--primaryForeground)
//background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
border solid 1px var(--primaryLighten15)
&:hover:not(:disabled)
//background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
border-color var(--primary)
&:active:not(:disabled)
background var(--primary)
border-color var(--primary)
input:not([type]).ui
input[type='text'].ui
input[type='password'].ui
input[type='email'].ui
input[type='date'].ui
input[type='number'].ui
textarea.ui
display block
padding 10px
width 100%
height 40px
font-family sans-serif
font-size 16px
color #dee4e8
background #191b22
border solid 1px #495156
border-radius 4px
&:hover
border-color #b0b0b0
&:focus
border-color var(--primary)
.ui.from.group
> p:first-child
color #c0c7cc
src/client/app/desktop/views/components/post-form.vue
+ 4
− 6
View file @ 0c63ec81
......@@ -599,21 +599,19 @@ export default Vue.extend({
height 40px
font-size 1em
color var(--primaryForeground)
background linear-gradient(to bottom, var(--primaryLighten25) 0%, var(--primaryLighten10) 100%)
background var(--primary)
outline none
border solid 1px var(--primaryLighten15)
border none
border-radius 4px
&:not(:disabled)
font-weight bold
&:hover:not(:disabled)
background linear-gradient(to bottom, var(--primaryLighten8) 0%, var(--primaryDarken8) 100%)
border-color var(--primary)
background var(--primaryLighten5)
&:active:not(:disabled)
background var(--primary)
border-color var(--primary)
background var(--primaryDarken5)
&:focus
&:after
......
src/client/app/desktop/views/components/renote-form.vue
+ 3
− 3
View file @ 0c63ec81
......@@ -4,8 +4,8 @@
<template v-if="!quote">
<footer>
<a class="quote" v-if="!quote" @click="onQuote">%i18n:@quote%</a>
<button class="ui cancel" @click="cancel">%i18n:@cancel%</button>
<button class="ui primary ok" @click="ok" :disabled="wait">{{ wait ? '%i18n:@reposting%' : '%i18n:@renote%' }}</button>
<ui-button class="button cancel" inline @click="cancel">%i18n:@cancel%</ui-button>
<ui-button class="button ok" inline primary @click="ok" :disabled="wait">{{ wait ? '%i18n:@reposting%' : '%i18n:@renote%' }}</ui-button>
</footer>
</template>
<template v-if="quote">
......@@ -71,7 +71,7 @@ export default Vue.extend({
left 28px
line-height 40px
button
> .button
display block
position absolute
bottom 16px
......
src/client/app/desktop/views/widgets/profile.vue
+ 0
− 1
View file @ 0c63ec81
......@@ -4,7 +4,6 @@
<div class="egwyvoaaryotefqhqtmiyawwefemjfsd-body"
:data-compact="props.design == 1 || props.design == 2"
:data-melt="props.design == 2"
:data-darkmode="$store.state.device.darkmode"
>
<div class="banner"
:style="$store.state.i.bannerUrl ? `background-image: url(${$store.state.i.bannerUrl})` : ''"
......
src/client/app/init.css
+ 1
− 5
View file @ 0c63ec81
......@@ -32,7 +32,7 @@ body > noscript {
left: 0;
width: 100%;
height: 100%;
background: #fff;
background: var(--bg);
cursor: wait;
}
#ini > svg {
......@@ -47,10 +47,6 @@ body > noscript {
animation: ini 0.6s infinite linear;
}
html[data-darkmode] #ini {
background: #191b22;
}
@keyframes ini {
from {
transform: rotate(0deg);
......
src/client/theme/dark.json
+ 4
− 0
View file @ 0c63ec81
......@@ -67,6 +67,10 @@
"inputLabel": "rgba(255, 255, 255, 0.7)",
"inputText": "#fff",
"buttonBg": "rgba(255, 255, 255, 0.05)",
"buttonHoverBg": "rgba(255, 255, 255, 0.1)",
"buttonActiveBg": "rgba(255, 255, 255, 0.15)",
"autocompleteItemHoverBg": "rgba(255, 255, 255, 0.1)",
"autocompleteItemText": "rgba(255, 255, 255, 0.8)",
"autocompleteItemTextSub": "rgba(255, 255, 255, 0.3)",
......
src/client/theme/light.json
+ 4
− 0
View file @ 0c63ec81
......@@ -67,6 +67,10 @@
"inputLabel": "rgba(0, 0, 0, 0.54)",
"inputText": "#000",
"buttonBg": "rgba(0, 0, 0, 0.05)",
"buttonHoverBg": "rgba(0, 0, 0, 0.1)",
"buttonActiveBg": "rgba(0, 0, 0, 0.15)",
"autocompleteItemHoverBg": "rgba(0, 0, 0, 0.1)",
"autocompleteItemText": "rgba(0, 0, 0, 0.8)",
"autocompleteItemTextSub": "rgba(0, 0, 0, 0.3)",
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment