jadowyne/pantry-track
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Setup darkmode and signup_enabled in html form

Browse Source
This commit is contained in:
Jadowyne Ulve 2025-08-09 18:59:43 -05:00
parent 9bc93e12a5
commit a5bb593f6d
8 changed files with 120 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
application/access_module/__pycache__/access_api.cpython-313.pyc
View File

Binary file not shown.

2
application/access_module/access_api.py
View File

@ -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
View 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);
}
}

8
application/access_module/templates/login.html
View File

@ -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>

19
application/items/templates/index.html
View File

@ -23,17 +23,22 @@
<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-->
<div class="uk-navbar-left"> <div class="uk-navbar-left">
<ul class="uk-navbar-nav"> <ul class="uk-navbar-nav ">
<li> <li>
<a href>Apps</a> <a href>Apps</a>
<div class="uk-navbar-dropdown" uk-drop="mode: click; multi:false"> <div class="uk-navbar-dropdown" uk-drop="mode: click; multi:false">
@ -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>

17
application/poe/templates/receipts.html
View File

@ -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">

2
database.ini
View File

@ -8,5 +8,5 @@ port = 5432
[manage] [manage]
sites = sites =
first_setup = False first_setup = False
signup_enabled = True signup_enabled = False

38
static/css/dark-mode.css
View File

@ -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);
} }