mirror of
				https://codeberg.org/yeentown/barkey.git
				synced 2025-11-03 23:14:13 +00:00 
			
		
		
		
	🎨
This commit is contained in:
		
							parent
							
								
									dc12b189de
								
							
						
					
					
						commit
						46f3736f44
					
				
					 10 changed files with 36 additions and 9 deletions
				
			
		| 
						 | 
				
			
			@ -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>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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;
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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">
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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">
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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">
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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)',
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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)',
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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',
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -21,5 +21,7 @@
 | 
			
		|||
		mentionMe: '@accent',
 | 
			
		||||
		hashtag: '#70c0e8',
 | 
			
		||||
		link: '#e88080',
 | 
			
		||||
		buttonGradateA: '@accent',
 | 
			
		||||
		buttonGradateB: ':saturate<30<:hue<30<@accent',
 | 
			
		||||
	},
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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 {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue