diff --git a/web/src/pages/SignInPage.vue b/web/src/pages/SignInPage.vue index 36f6acb..5592c5d 100644 --- a/web/src/pages/SignInPage.vue +++ b/web/src/pages/SignInPage.vue @@ -12,24 +12,24 @@ class="px-8" style="max-width: 500px" > - + /> -->

- CALEBBURKEDEV + {{ APPLICATION_NAME }}

Sign in + />
@@ -81,6 +81,7 @@ import { onMounted } from "vue" import { useAuth0 } from "@auth0/auth0-vue" +import { APPLICATION_NAME } from "@/config" import useCurrentUser from "@/use/use-current-user" const { reset: resetCurrentUser } = useCurrentUser() diff --git a/web/src/scss/pages/_authentication.scss b/web/src/scss/pages/_authentication.scss index 63f6b3a..5c5385a 100644 --- a/web/src/scss/pages/_authentication.scss +++ b/web/src/scss/pages/_authentication.scss @@ -1,90 +1,90 @@ -.authentication{ - &::before{ - content: ""; - position: absolute; - height: 100%; - width: 100%; - opacity: 0.3; - left: 0; - top: 0; - bottom: 0; - background: radial-gradient(rgb(210, 241, 223), rgb(211, 215, 250), rgb(186, 216, 244)) 0% 0% / 400% 400%; - } - - @media screen and (max-width:1280px){ - .auth-header{ - position: unset; - } - } -} -.mw-450{ - max-width: 450px; - width: 100%;; -} -.auth-header{ +.authentication { + &::before { + content: ""; position: absolute; + height: 100%; + width: 100%; + opacity: 0.3; + left: 0; top: 0; - left: 0; -} -.verification{ - .v-field__input{ - text-align: center; - } -} -.auth-divider{ - span{ - z-index: 1; - } - &::before{ - position: absolute; - width: 100%; - border-top: thin solid rgb(var(--v-theme-borderColor)); - top: 50%; - content: ""; - transform: translateY(50%); - left: 0; - } - &::after - { - position: absolute; - width: 100%; - border-top: thin solid rgb(var(--v-theme-borderColor)); - top: 50%; - content: ""; - transform: translateY(50%); - right: 0; + bottom: 0; + background: radial-gradient(rgb(210, 241, 223), rgb(211, 215, 250), rgb(186, 216, 244)) 0% 0% / + 400% 400%; + } + + @media screen and (max-width: 1280px) { + .auth-header { + position: unset; } + } +} +.mw-450 { + max-width: 450px; + width: 100%; +} +.auth-header { + position: absolute; + top: 0; + left: 0; +} +.verification { + .v-field__input { + text-align: center; + } +} +.auth-divider { + span { + z-index: 1; + } + &::before { + position: absolute; + width: 100%; + border-top: thin solid rgb(var(--v-theme-borderColor)); + top: 50%; + content: ""; + transform: translateY(50%); + left: 0; + } + &::after { + position: absolute; + width: 100%; + border-top: thin solid rgb(var(--v-theme-borderColor)); + top: 50%; + content: ""; + transform: translateY(50%); + right: 0; + } } -@media (min-width: 1536px){ - .auth{ - .v-col-lg-7{ - flex: 0 0 66.66%; - max-width: 66.66%; - } - .v-col-lg-5{ - flex: 0 0 33.33%; - max-width: 33.33%; - } +@media (min-width: 1536px) { + .auth { + .v-col-lg-7 { + flex: 0 0 66.66%; + max-width: 66.66%; } - + .v-col-lg-5 { + flex: 0 0 33.33%; + max-width: 33.33%; + } + } } -@media screen and (max-width:1280px){ - .mh-100{ - height: 100% !important; - } +@media screen and (max-width: 1280px) { + .mh-100 { + height: 100% !important; + } } -@media screen and (max-width:600px){ - .mw-100{ - width: 100%; - padding: 0 15px; - } +@media screen and (max-width: 600px) { + .mw-100 { + width: 100%; + padding: 0 15px; + } } -.auth{ - .v-switch .v-label, .v-checkbox .v-label { - opacity: 0.7; - font-weight: 400 !important; - } -} \ No newline at end of file +.auth { + .v-switch .v-label, + .v-checkbox .v-label { + opacity: 0.7; + font-weight: 400 !important; + } +}