Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-24 07:39:41 +02:00
Code Issues Releases Activity

Fix/multiple bug reports (#1002)

Browse source 
* fix type issues for #999

* fix regression #995

* remove error from frontend and log error #996

* cleanup darkmode on login page

* keep primary color bg
This commit is contained in:
Hayden 2022-02-23 15:04:45 -09:00 • committed by GitHub
parent 6ccffce320
commit ccfaa02b03
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 102 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

42
frontend/pages/login.vue
View file

@ -1,5 +1,12 @@
<template>
<v-container fill-height fluid class="d-flex justify-center align-center" style="background: #f5f8fa">
<v-container
fill-height
fluid
class="d-flex justify-center align-center"
:class="{
'bg-off-white': !$vuetify.theme.dark,
}"
>
<v-card tag="section" class="d-flex flex-column align-center" width="600px">
<v-toolbar width="100%" color="primary" class="d-flex justify-center mb-4" dark>
<v-toolbar-title class="headline text-h4"> Mealie </v-toolbar-title>
@ -7,14 +14,12 @@
<div class="icon-container">
<v-divider class="icon-divider"></v-divider>
<v-avatar size="102" color="grey lighten-2">
<v-avatar class="pa-2 icon-avatar" color="white" size="100">
<svg class="icon-primary" style="width: 100px; height: 100px" viewBox="0 0 24 24">
<path
d="M8.1,13.34L3.91,9.16C2.35,7.59 2.35,5.06 3.91,3.5L10.93,10.5L8.1,13.34M13.41,13L20.29,19.88L18.88,21.29L12,14.41L5.12,21.29L3.71,19.88L13.36,10.22L13.16,10C12.38,9.23 12.38,7.97 13.16,7.19L17.5,2.82L18.43,3.74L15.19,7L16.15,7.94L19.39,4.69L20.31,5.61L17.06,8.85L18,9.81L21.26,6.56L22.18,7.5L17.81,11.84C17.03,12.62 15.77,12.62 15,11.84L14.78,11.64L13.41,13Z"
/>
</svg>
</v-avatar>
<v-avatar class="pa-2 icon-avatar" color="primary" size="100">
<svg class="icon-white" style="width: 100px; height: 100px" viewBox="0 0 24 24">
<path
d="M8.1,13.34L3.91,9.16C2.35,7.59 2.35,5.06 3.91,3.5L10.93,10.5L8.1,13.34M13.41,13L20.29,19.88L18.88,21.29L12,14.41L5.12,21.29L3.71,19.88L13.36,10.22L13.16,10C12.38,9.23 12.38,7.97 13.16,7.19L17.5,2.82L18.43,3.74L15.19,7L16.15,7.94L19.39,4.69L20.31,5.61L17.06,8.85L18,9.81L21.26,6.56L22.18,7.5L17.81,11.84C17.03,12.62 15.77,12.62 15,11.84L14.78,11.64L13.41,13Z"
/>
</svg>
</v-avatar>
</div>
@ -91,16 +96,26 @@
</div>
</v-card-text>
</v-card>
<v-btn absolute bottom center @click="toggleDark">
<v-icon left>
{{ $vuetify.theme.dark ? $globals.icons.weatherSunny : $globals.icons.weatherNight }}
</v-icon>
{{ $vuetify.theme.dark ? "Light Mode" : "Dark Mode" }}
</v-btn>
</v-container>
</template>
<script lang="ts">
import { defineComponent, ref, useContext, computed, reactive } from "@nuxtjs/composition-api";
import { alert } from "~/composables/use-toast";
import { useToggleDarkMode } from "~/composables/use-utils";
export default defineComponent({
layout: "blank",
setup() {
const toggleDark = useToggleDarkMode();
const { $auth } = useContext();
const context = useContext();
@ -147,6 +162,7 @@ export default defineComponent({
loggingIn,
allowSignup,
authenticate,
toggleDark,
};
},
@ -167,6 +183,10 @@ export default defineComponent({
fill: var(--v-primary-base);
}
.icon-white {
fill: white;
}
.icon-container {
display: flex;
flex-direction: column;
@ -185,4 +205,8 @@ export default defineComponent({
border-color: rgba(0, 0, 0, 0.12);
border: 2px;
}
.bg-off-white {
background: #f5f8fa;
}
</style>