feat: ゲーミングモード
This commit is contained in:
parent
093540375d
commit
13de104634
28 changed files with 2917 additions and 865 deletions
|
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<template>
|
||||
<MkSpacer :contentMax="800">
|
||||
<MkTab v-model="tab" style="margin-bottom: var(--margin);">
|
||||
<MkTab v-model="tab" style="margin-bottom: var(--margin);">
|
||||
<option value="notes">{{ i18n.ts.notes }}</option>
|
||||
<option value="polls">{{ i18n.ts.poll }}</option>
|
||||
</MkTab>
|
||||
|
|
|
|||
|
|
@ -96,7 +96,10 @@ os.apiGet('federation/instances', {
|
|||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: var(--accent);
|
||||
background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd); background-size: 1800% 1800%;
|
||||
-webkit-animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
-moz-animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
clip-path: polygon(0% 0%, 45% 0%, 20% 100%, 0% 100%);
|
||||
}
|
||||
> .shape2 {
|
||||
|
|
@ -105,7 +108,10 @@ os.apiGet('federation/instances', {
|
|||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: var(--accent);
|
||||
background: linear-gradient(270deg, #e7a2a2, #e3cfa2, #ebefa1, #b3e7a6, #a6ebe7, #aec5e3, #cabded, #e0b9e3, #f4bddd); background-size: 1800% 1800%;
|
||||
-webkit-animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
-moz-animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
animation: AnimationLight 45s cubic-bezier(0, 0.25, 0.75, 1) infinite;
|
||||
clip-path: polygon(0% 0%, 25% 0%, 35% 100%, 0% 100%);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
@ -165,6 +171,71 @@ os.apiGet('federation/instances', {
|
|||
}
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes AnimationLight {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
}
|
||||
@-moz-keyframes AnimationLight {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
} @keyframes AnimationLight {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes AnimationDark {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
}
|
||||
@-moz-keyframes AnimationDark {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
}
|
||||
@keyframes AnimationDark {
|
||||
0% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" module>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue