Komorebi/Moku
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adding Transition

Browse Source
This commit is contained in:
MangoPig 2025-12-30 02:01:37 +00:00
parent 752f6eab9a
commit 76898c1fe3
3 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
Frontend/src/routes/auth/login/login.module.scss
View File

@ -5,6 +5,7 @@
h1 {
@include text-largest;
font-weight: 200;
margin-bottom: 2rem;
@include respond(tablet) {
@ -25,6 +26,8 @@
gap: 1.5rem;
margin-bottom: 2rem;
@include base-transition;
@include respond(tablet) {
margin: 2rem;
}
@ -75,6 +78,8 @@
}
.federatedLogin {
@include base-transition;
width: 100%;
max-width: 500px;
display: flex;
@ -89,6 +94,7 @@
position: relative;
&::after {
@include base-transition;
content: attr(data-label);
position: absolute;
top: 0;
@ -111,6 +117,7 @@
.federatedBtn {
@include button-base;
@include base-transition;
flex: 1;
background-color: var(--bg-1);

4
Frontend/src/styles/_mixins.scss
View File

@ -109,3 +109,7 @@ $desktop: 1440px;
padding: 10px 20px 10px 15px;
}
}
@mixin base-transition {
transition: all var(--transition-speed) var(--transition-ease);
}

16
Frontend/src/styles/theme.scss
View File

@ -4,12 +4,12 @@
--transition-speed: 0.5s;
--transition-ease: ease-in-out;
--gray-50: hsl(40 25% 85%);
--gray-100: hsl(40 23% 80%);
--gray-200: hsl(40 20% 77%);
--gray-300: hsl(40 20% 70%);
--gray-400: hsl(40 10% 50%);
--gray-500: hsl(40 5% 40%);
--gray-50: hsl(40 25% 90%);
--gray-100: hsl(40 23% 87%);
--gray-200: hsl(40 20% 83%);
--gray-300: hsl(40 20% 77%);
--gray-400: hsl(40 10% 75%);
--gray-500: hsl(40 5% 60%);
--gray-600: hsl(40 5% 30%);
--gray-700: hsl(40 5% 25%);
--gray-800: hsl(40 5% 20%);
@ -64,8 +64,8 @@
[data-color-scheme="dark"] {
// Background and Text Colors
--bg: var(--gray-900);
--text: var(--gray-50);
--text-muted: var(--gray-400);
--text: var(--gray-300);
--text-muted: var(--gray-500);
// Accent
--primary: var(--brown-700);