Setup darkmode and signup_enabled in html form
This commit is contained in:
Jadowyne Ulve
parent
9bc93e12a5
commit
a5bb593f6d
Binary file not shown.
@ -111,7 +111,7 @@ def login():
|
||||
if 'user' not in session.keys():
|
||||
session['user'] = None
|
||||
|
||||
return render_template("login.html")
|
||||
return render_template("login.html", sign_up_enabled=instance_config['signup_enabled'])
|
||||
|
||||
@access_api.route('/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 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-icons.min.js') }}"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<body class="uk-light">
|
||||
<div class="uk-container">
|
||||
<div class="uk-section">
|
||||
<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%;">
|
||||
<ul uk-tab>
|
||||
<li><a href="#">Login</a></li>
|
||||
{% if signup_enabled %}
|
||||
<li><a href="#">Sign Up</a></li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
<div class="uk-switcher">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
{% if signup_enabled %}
|
||||
<!-- Sign up Form -->
|
||||
<div class="uk-grid-small" uk-grid>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -23,12 +23,17 @@
|
||||
<script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
|
||||
|
||||
</head>
|
||||
<style>
|
||||
:root {
|
||||
--primary-color: {{ session['user']['flags']['styles']['primary_color']}};
|
||||
}
|
||||
</style>
|
||||
{% if session['user']['flags']['darkmode'] %}
|
||||
<body class="uk-light">
|
||||
{% else %}
|
||||
<body>
|
||||
{% endif %}
|
||||
<nav class="uk-navbar-container">
|
||||
<nav class="uk-navbar-container" style="color: aqua;">
|
||||
<div class="uk-container uk-container-expand">
|
||||
<div class="uk-navbar uk-navbar-primary">
|
||||
<!-- Application Navigation-->
|
||||
@ -221,6 +226,16 @@
|
||||
</div>
|
||||
|
||||
</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 src="{{ url_for('items_api.static', filename='itemListHandler.js') }}"></script>
|
||||
</html>
|
||||
@ -24,6 +24,23 @@
|
||||
background-color: rgb(230, 230, 230) !important;
|
||||
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>
|
||||
{% if session['user']['flags']['darkmode'] %}
|
||||
<body class="uk-light">
|
||||
|
||||
@ -8,5 +8,5 @@ port = 5432
|
||||
[manage]
|
||||
sites =
|
||||
first_setup = False
|
||||
signup_enabled = True
|
||||
signup_enabled = False
|
||||
|
||||
|
||||
@ -10,8 +10,8 @@
|
||||
--error: #CF6679;
|
||||
--error-text: #000000;
|
||||
|
||||
--primary-color: #BB86FC;
|
||||
--primary-text: #000000;
|
||||
--primary-color: #4e76aa;
|
||||
--primary-text: #ffffff;
|
||||
|
||||
--secondary-color: #03DAC6;
|
||||
--secondary-text: #000000;
|
||||
@ -36,26 +36,20 @@ select, option {
|
||||
box-shadow: var(--elevation-low);
|
||||
}
|
||||
|
||||
#navbar {
|
||||
background: var(--surface);
|
||||
color: var(--surface-text);
|
||||
box-shadow: var(--elevation-medium);
|
||||
|
||||
.uk-navbar-container, footer {
|
||||
background-color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
#navbar::before {
|
||||
content: '';
|
||||
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-container > .uk-navbar > div > ul >li > a {
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.uk-navbar-container {
|
||||
background-color: var(--surface) !important;
|
||||
.uk-navbar-container > .uk-container > .uk-navbar > div > ul > li > span {
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.uk-navbar-container > ul.uk-navbar-nav > li {
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.uk-navbar-dropdown {
|
||||
@ -63,6 +57,14 @@ select, option {
|
||||
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 {
|
||||
background-color: var(--background-secondary);
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user