Setup darkmode and signup_enabled in html form
This commit is contained in:
parent
9bc93e12a5
commit
a5bb593f6d
Binary file not shown.
@ -111,7 +111,7 @@ def login():
|
|||||||
if 'user' not in session.keys():
|
if 'user' not in session.keys():
|
||||||
session['user'] = None
|
session['user'] = None
|
||||||
|
|
||||||
return render_template("login.html")
|
return render_template("login.html", sign_up_enabled=instance_config['signup_enabled'])
|
||||||
|
|
||||||
@access_api.route('/dashboard')
|
@access_api.route('/dashboard')
|
||||||
def dashboard():
|
def dashboard():
|
||||||
|
|||||||
58
application/access_module/static/css/logins-dark.css
Normal file
58
application/access_module/static/css/logins-dark.css
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
:root {
|
||||||
|
--background: #121212;
|
||||||
|
--background-text: #ffffff;
|
||||||
|
|
||||||
|
--surface: #121212;
|
||||||
|
--surface-text: #ffffff;
|
||||||
|
|
||||||
|
--surface-two: #252525;
|
||||||
|
|
||||||
|
--error: #CF6679;
|
||||||
|
--error-text: #000000;
|
||||||
|
|
||||||
|
--primary-color: #4e76aa;
|
||||||
|
--primary-text: #ffffff;
|
||||||
|
|
||||||
|
--secondary-color: #03DAC6;
|
||||||
|
--secondary-text: #000000;
|
||||||
|
|
||||||
|
--elevation-low: 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||||
|
--elevation-medium: 0 3px 6px rgba(0, 0, 0, 0.3);
|
||||||
|
--elevation-high: 0 10px 20px rgba(0, 0, 0, 0.4);
|
||||||
|
|
||||||
|
--radius: 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
body, html {
|
||||||
|
background: var(--background) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-card {
|
||||||
|
background: var(--surface);
|
||||||
|
color: var(--surface-text);
|
||||||
|
box-shadow: var(--elevation-low);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-card.uk-card-default::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
border-radius: var(--radius);
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: rgba(255, 255, 255, 0.05);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-input.uk-disabled {
|
||||||
|
background-color: var(--background-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-input {
|
||||||
|
border-color: var(--border-color);
|
||||||
|
box-shadow: var(--elevation-low);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -15,14 +15,14 @@
|
|||||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
|
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
|
||||||
<link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}" disabled/>
|
<link id="dark-mode" rel="stylesheet" href="{{ url_for('access_api.static', filename='css/logins-dark.css') }}"/>
|
||||||
|
|
||||||
|
|
||||||
<script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
|
<script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
|
||||||
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body class="uk-light">
|
||||||
<div class="uk-container">
|
<div class="uk-container">
|
||||||
<div class="uk-section">
|
<div class="uk-section">
|
||||||
<div class="uk-flex-center" uk-grid>
|
<div class="uk-flex-center" uk-grid>
|
||||||
@ -30,7 +30,9 @@
|
|||||||
<img class="uk-align-center" src="{{ url_for('static', filename='pictures/logo.jpg') }}" style="width: 200px; border-radius: 50%;">
|
<img class="uk-align-center" src="{{ url_for('static', filename='pictures/logo.jpg') }}" style="width: 200px; border-radius: 50%;">
|
||||||
<ul uk-tab>
|
<ul uk-tab>
|
||||||
<li><a href="#">Login</a></li>
|
<li><a href="#">Login</a></li>
|
||||||
|
{% if signup_enabled %}
|
||||||
<li><a href="#">Sign Up</a></li>
|
<li><a href="#">Sign Up</a></li>
|
||||||
|
{% endif %}
|
||||||
</ul>
|
</ul>
|
||||||
<div class="uk-switcher">
|
<div class="uk-switcher">
|
||||||
<div class="uk-grid-small" uk-grid>
|
<div class="uk-grid-small" uk-grid>
|
||||||
@ -58,6 +60,7 @@
|
|||||||
<a href="/access/login/oidc" class="uk-button uk-button-primary uk-align-center">Login with Authentik</a>
|
<a href="/access/login/oidc" class="uk-button uk-button-primary uk-align-center">Login with Authentik</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{% if signup_enabled %}
|
||||||
<!-- Sign up Form -->
|
<!-- Sign up Form -->
|
||||||
<div class="uk-grid-small" uk-grid>
|
<div class="uk-grid-small" uk-grid>
|
||||||
<div class="uk-width-1-1">
|
<div class="uk-width-1-1">
|
||||||
@ -96,6 +99,7 @@
|
|||||||
<button onclick="signupUser()" class="uk-button uk-button-default uk-align-right">Sign Up</button>
|
<button onclick="signupUser()" class="uk-button uk-button-default uk-align-right">Sign Up</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -23,12 +23,17 @@
|
|||||||
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--primary-color: {{ session['user']['flags']['styles']['primary_color']}};
|
||||||
|
}
|
||||||
|
</style>
|
||||||
{% if session['user']['flags']['darkmode'] %}
|
{% if session['user']['flags']['darkmode'] %}
|
||||||
<body class="uk-light">
|
<body class="uk-light">
|
||||||
{% else %}
|
{% else %}
|
||||||
<body>
|
<body>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<nav class="uk-navbar-container">
|
<nav class="uk-navbar-container" style="color: aqua;">
|
||||||
<div class="uk-container uk-container-expand">
|
<div class="uk-container uk-container-expand">
|
||||||
<div class="uk-navbar uk-navbar-primary">
|
<div class="uk-navbar uk-navbar-primary">
|
||||||
<!-- Application Navigation-->
|
<!-- Application Navigation-->
|
||||||
@ -221,6 +226,16 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
<!-- footer class="uk-section uk-section-secondary uk-padding-small">
|
||||||
|
<div uk-grid>
|
||||||
|
<div class="uk-width-1-2">
|
||||||
|
<p>Made by Mechseroms, using <a href="https://getuikit.com/">UIkit</a></p>
|
||||||
|
</div>
|
||||||
|
<div class="uk-width-1-2 uk-text-right">
|
||||||
|
<a href="https://git.treehousefullofstars.com/jadowyne/pantry-track/issues/new">Report Issue</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer -->
|
||||||
<script>const session = {{session|tojson}}</script>
|
<script>const session = {{session|tojson}}</script>
|
||||||
<script src="{{ url_for('items_api.static', filename='itemListHandler.js') }}"></script>
|
<script src="{{ url_for('items_api.static', filename='itemListHandler.js') }}"></script>
|
||||||
</html>
|
</html>
|
||||||
@ -24,6 +24,23 @@
|
|||||||
background-color: rgb(230, 230, 230) !important;
|
background-color: rgb(230, 230, 230) !important;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
html, body {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.page-content {
|
||||||
|
flex: 1 0 auto;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
{% if session['user']['flags']['darkmode'] %}
|
{% if session['user']['flags']['darkmode'] %}
|
||||||
<body class="uk-light">
|
<body class="uk-light">
|
||||||
|
|||||||
@ -8,5 +8,5 @@ port = 5432
|
|||||||
[manage]
|
[manage]
|
||||||
sites =
|
sites =
|
||||||
first_setup = False
|
first_setup = False
|
||||||
signup_enabled = True
|
signup_enabled = False
|
||||||
|
|
||||||
|
|||||||
@ -10,8 +10,8 @@
|
|||||||
--error: #CF6679;
|
--error: #CF6679;
|
||||||
--error-text: #000000;
|
--error-text: #000000;
|
||||||
|
|
||||||
--primary-color: #BB86FC;
|
--primary-color: #4e76aa;
|
||||||
--primary-text: #000000;
|
--primary-text: #ffffff;
|
||||||
|
|
||||||
--secondary-color: #03DAC6;
|
--secondary-color: #03DAC6;
|
||||||
--secondary-text: #000000;
|
--secondary-text: #000000;
|
||||||
@ -36,26 +36,20 @@ select, option {
|
|||||||
box-shadow: var(--elevation-low);
|
box-shadow: var(--elevation-low);
|
||||||
}
|
}
|
||||||
|
|
||||||
#navbar {
|
.uk-navbar-container, footer {
|
||||||
background: var(--surface);
|
background-color: var(--primary-color) !important;
|
||||||
color: var(--surface-text);
|
|
||||||
box-shadow: var(--elevation-medium);
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#navbar::before {
|
.uk-navbar-container > .uk-container > .uk-navbar > div > ul >li > a {
|
||||||
content: '';
|
color: var(--primary-text);
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
background-color: rgba(255, 255, 255, 0.08);
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.uk-navbar-container {
|
.uk-navbar-container > .uk-container > .uk-navbar > div > ul > li > span {
|
||||||
background-color: var(--surface) !important;
|
color: var(--primary-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-navbar-container > ul.uk-navbar-nav > li {
|
||||||
|
color: var(--primary-text);
|
||||||
}
|
}
|
||||||
|
|
||||||
.uk-navbar-dropdown {
|
.uk-navbar-dropdown {
|
||||||
@ -63,6 +57,14 @@ select, option {
|
|||||||
box-shadow: var(--elevation-low);
|
box-shadow: var(--elevation-low);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.uk-nav-header {
|
||||||
|
color:#ffffff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.uk-navbar-dropdown-nav > li.uk-active > a {
|
||||||
|
color: var(--primary-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
.uk-input.uk-disabled {
|
.uk-input.uk-disabled {
|
||||||
background-color: var(--background-secondary);
|
background-color: var(--background-secondary);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user