natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🎨

This commit is contained in:
syuilo 2021-10-14 01:27:45 +09:00
parent dc12b189de
commit 46f3736f44
10 changed files with 36 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/client/components/signup.vue
View File

@ -56,7 +56,7 @@
</label>
<captcha v-if="meta.enableHcaptcha" class="_formBlock captcha" provider="hcaptcha" ref="hcaptcha" v-model="hCaptchaResponse" :sitekey="meta.hcaptchaSiteKey"/>
<captcha v-if="meta.enableRecaptcha" class="_formBlock captcha" provider="recaptcha" ref="recaptcha" v-model="reCaptchaResponse" :sitekey="meta.recaptchaSiteKey"/>
<MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" primary data-cy-signup-submit>{{ $ts.start }}</MkButton>
<MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" gradate data-cy-signup-submit>{{ $ts.start }}</MkButton>
</template>
</form>
</template>

27
src/client/components/ui/button.vue
View File

@ -1,6 +1,6 @@
<template>
<button v-if="!link" class="bghgjjyj _button"
:class="{ inline, primary, danger, rounded, full }"
:class="{ inline, primary, gradate, danger, rounded, full }"
:type="type"
@click="$emit('click', $event)"
@mousedown="onMousedown"
@ -11,7 +11,7 @@
</div>
</button>
<MkA v-else class="bghgjjyj _button"
:class="{ inline, primary, danger, rounded, full }"
:class="{ inline, primary, gradate, danger, rounded, full }"
:to="to"
@mousedown="onMousedown"
>
@ -36,6 +36,11 @@ export default defineComponent({
required: false,
default: false
},
gradate: {
type: Boolean,
required: false,
default: false
},
rounded: {
type: Boolean,
required: false,
@ -137,8 +142,8 @@ export default defineComponent({
padding: 8px 14px;
text-align: center;
font-weight: normal;
font-size: 0.9em;
line-height: 24px;
font-size: 0.8em;
line-height: 22px;
box-shadow: none;
text-decoration: none;
background: var(--buttonBg);
@ -177,6 +182,20 @@ export default defineComponent({
}
}
&.gradate {
font-weight: bold;
color: var(--fgOnAccent) !important;
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
&:not(:disabled):hover {
background: var(--X8);
}
&:not(:disabled):active {
background: var(--X8);
}
}
&.danger {
color: #ff2a2a;

2
src/client/pages/welcome.entrance.a.vue
View File

@ -27,7 +27,7 @@
<div class="desc" v-html="meta.description || $ts.headlineMisskey"></div>
</div>
<div class="action">
<MkButton @click="signup()" inline primary data-cy-signup style="margin-right: 12px;">{{ $ts.signup }}</MkButton>
<MkButton @click="signup()" inline gradate data-cy-signup style="margin-right: 12px;">{{ $ts.signup }}</MkButton>
<MkButton @click="signin()" inline data-cy-signin>{{ $ts.login }}</MkButton>
</div>
<div class="status" v-if="onlineUsersCount && stats">

2
src/client/pages/welcome.entrance.b.vue
View File

@ -12,7 +12,7 @@
<div class="desc" v-html="meta.description || $ts.headlineMisskey"></div>
</div>
<div class="action">
<MkButton class="signup" @click="signup()" inline primary>{{ $ts.signup }}</MkButton>
<MkButton class="signup" @click="signup()" inline gradate>{{ $ts.signup }}</MkButton>
<MkButton class="signin" @click="signin()" inline>{{ $ts.login }}</MkButton>
</div>
<div class="status" v-if="onlineUsersCount && stats">

2
src/client/pages/welcome.entrance.c.vue
View File

@ -24,7 +24,7 @@
<div class="desc" v-html="meta.description || $ts.headlineMisskey"></div>
</div>
<div class="action">
<MkButton @click="signup()" inline primary>{{ $ts.signup }}</MkButton>
<MkButton @click="signup()" inline gradate>{{ $ts.signup }}</MkButton>
<MkButton @click="signin()" inline>{{ $ts.login }}</MkButton>
</div>
<div class="status" v-if="onlineUsersCount && stats">

2
src/client/themes/_dark.json5
View File

@ -57,6 +57,8 @@
cwHoverBg: '#707b97',
buttonBg: 'rgba(255, 255, 255, 0.05)',
buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
inputBorder: 'rgba(255, 255, 255, 0.1)',
inputBorderHover: 'rgba(255, 255, 255, 0.2)',
listItemHoverBg: 'rgba(255, 255, 255, 0.03)',

2
src/client/themes/_light.json5
View File

@ -57,6 +57,8 @@
cwHoverBg: '#bbc4ce',
buttonBg: 'rgba(0, 0, 0, 0.05)',
buttonHoverBg: 'rgba(0, 0, 0, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<20<@accent',
inputBorder: 'rgba(0, 0, 0, 0.1)',
inputBorderHover: 'rgba(0, 0, 0, 0.2)',
listItemHoverBg: 'rgba(0, 0, 0, 0.03)',

2
src/client/themes/d-astro.json5
View File

@ -46,6 +46,8 @@
navIndicator: '@accent',
accentLighten: ':lighten<10<@accent',
buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
buttonGradateA: '@accent',
buttonGradateB: ':hue<-20<@accent',
driveFolderBg: ':alpha<0.3<@accent',
fgHighlighted: ':lighten<3<@fg',
panelHeaderBg: ':lighten<3<@panel',

2
src/client/themes/d-future.json5
View File

@ -21,5 +21,7 @@
mentionMe: '@accent',
hashtag: '#70c0e8',
link: '#e88080',
buttonGradateA: '@accent',
buttonGradateB: ':saturate<30<:hue<30<@accent',
},
}

2
src/client/ui/_common_/sidebar.vue
View File

@ -372,7 +372,7 @@ export default defineComponent({
right: 0;
bottom: 0;
border-radius: 999px;
background: var(--accent);
background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
}
&:hover, &.active {