fix css i js

This commit is contained in:
Mateusz Gruszczyński
2025-07-05 16:12:08 +02:00
parent 11617755fb
commit 270c5318d5
8 changed files with 40 additions and 28 deletions

5
app.py
View File

@ -33,7 +33,7 @@ MAX_ATTEMPTS = 10
TIME_WINDOW = 60 * 60
db = SQLAlchemy(app)
socketio = SocketIO(app)
socketio = SocketIO(app, async_mode="eventlet")
login_manager = LoginManager(app)
login_manager.login_view = 'login'
@ -358,7 +358,8 @@ def logout():
def create_list():
title = request.form.get('title')
is_temporary = 'temporary' in request.form
token = secrets.token_hex(16)
#token = secrets.token_hex(16)
token = secrets.token_hex(4)
expires_at = datetime.utcnow() + timedelta(days=7) if is_temporary else None
new_list = ShoppingList(title=title, owner_id=current_user.id, is_temporary=is_temporary, share_token=token, expires_at=expires_at)
db.session.add(new_list)

View File

@ -4,4 +4,5 @@ Flask-Login
Flask-SocketIO
eventlet
Werkzeug
Pillow
Pillow
eventlet

View File

@ -11,13 +11,14 @@
.bg-success {
background-color: #1e7e34 !important;
}
.bg-light {
background-color: #2c2f33 !important;
}
.item-not-checked {
background-color: #2c2f33 !important;
color: white !important;
}
/* --- Styl przycisku wyboru pliku --- */
input[type="file"]::file-selector-button {
background-color: #127429;
background-color: #225d36;
color: #fff;
border: none;
padding: 0.5em 1em;

View File

@ -113,7 +113,7 @@ function setupList(listId, username) {
socket.on('item_added', data => {
showToast(`${data.added_by} dodał: ${data.name}`);
const li = document.createElement('li');
li.className = 'list-group-item d-flex justify-content-between align-items-center flex-wrap bg-light text-dark';
li.className = 'list-group-item d-flex justify-content-between align-items-center flex-wrap item-not-checked';
li.id = `item-${data.id}`;
let quantityBadge = '';
@ -212,7 +212,7 @@ function updateItemState(itemId, isChecked) {
if (isChecked) {
li.classList.add('bg-success', 'text-white');
} else {
li.classList.add('bg-light', 'text-dark');
li.classList.add('item-not-checked');
}
const sp = li.querySelector('.spinner-border');
@ -264,7 +264,7 @@ function deleteItem(id) {
}
function editItem(id, oldName, oldQuantity) {
const newName = prompt('Podaj nową nazwę (lub zostaw starą):', oldName);
const newName = prompt('Podaj nową nazwę (lub zostaw o):', oldName);
if (newName === null) return; // anulował
const newQuantityStr = prompt('Podaj nową ilość:', oldQuantity);
@ -280,7 +280,7 @@ function editItem(id, oldName, oldQuantity) {
socket.emit('edit_item', { item_id: id, new_name: finalName, new_quantity: newQuantity });
}
function submitExpense() {
function submitExpense(listId) {
const amountInput = document.getElementById('expenseAmount');
const amount = parseFloat(amountInput.value);
if (isNaN(amount) || amount <= 0) {
@ -288,13 +288,12 @@ function submitExpense() {
return;
}
socket.emit('add_expense', {
list_id: LIST_ID,
list_id: listId,
amount: amount
});
amountInput.value = '';
}
function copyLink(link) {
if (navigator.share) {
navigator.share({

View File

@ -154,11 +154,14 @@
<button type="submit" class="btn btn-danger mt-2">🗑️ Usuń zaznaczone listy</button>
</form>
{% block scripts %}
<script>
document.getElementById('select-all').addEventListener('click', function(){
const checkboxes = document.querySelectorAll('input[name="list_ids"]');
checkboxes.forEach(cb => cb.checked = this.checked);
});
</script>
{% endblock %}
{% endblock %}

View File

@ -10,6 +10,9 @@
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.4/css/lightbox.min.css" rel="stylesheet">
</head>
<body class="bg-dark text-white">
@ -67,14 +70,24 @@
});
</script>
<script src="{{ url_for('static_bp.serve_js', filename='live.js') }}"></script>
<script src="{{ url_for('static_bp.serve_js', filename='toasts.js') }}"></script>
<script src="{{ url_for('static_bp.serve_js', filename='hide_list.js') }}"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.11.4/js/lightbox.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.socket.io/4.6.1/socket.io.min.js"></script>
<script src="{{ url_for('static_bp.serve_js', filename='live.js') }}"></script>
<script src="{{ url_for('static_bp.serve_js', filename='toasts.js') }}"></script>
<script src="{{ url_for('static_bp.serve_js', filename='hide_list.js') }}"></script>
<script>
setupList({{ list.id }}, '{{ current_user.username if current_user.is_authenticated else 'Gość' }}');
</script>
{% block scripts %}{% endblock %}
</body>
</html>

View File

@ -74,7 +74,7 @@ Lista: <strong>{{ list.title }}</strong>
<ul id="items" class="list-group mb-3">
{% for item in items %}
<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap {% if item.purchased %}bg-success text-white{% else %}bg-light text-white{% endif %}" id="item-{{ item.id }}">
<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap {% if item.purchased %}bg-success text-white{% else %}item-not-checked{% endif %}" id="item-{{ item.id }}">
<div class="d-flex align-items-center flex-wrap gap-2 flex-grow-1">
<input type="checkbox" {% if item.purchased %}checked{% endif %} {% if list.is_archived %}disabled{% endif %}>
<span id="name-{{ item.id }}" class="{% if item.purchased %}text-white{% else %}text-white{% endif %}">
@ -128,8 +128,4 @@ Lista: <strong>{{ list.title }}</strong>
<p><span class="badge bg-secondary">Brak wgranych paragonów do tej listy.</span></p>
{% endif %}
<script>
setupList({{ list.id }}, '{{ current_user.username if current_user.is_authenticated else 'Gość' }}');
</script>
{% endblock %}

View File

@ -20,8 +20,7 @@
<ul id="items" class="list-group mb-3">
{% for item in items %}
<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap clickable-item {% if item.purchased %}bg-success text-white{% else %}bg-light text-white{% endif %}" id="item-{{ item.id }}">
<div class="d-flex align-items-center gap-3 flex-grow-1">
<li class="list-group-item d-flex justify-content-between align-items-center flex-wrap clickable-item {% if item.purchased %}bg-success text-white{% else %}item-not-checked{% endif %}" id="item-{{ item.id }}"> <div class="d-flex align-items-center gap-3 flex-grow-1">
<input type="checkbox" class="form-check-input large-checkbox" {% if item.purchased %}checked{% endif %} {% if list.is_archived %}disabled{% endif %}>
<span id="name-{{ item.id }}" class="{% if item.purchased %}text-white{% else %}text-white{% endif %}">
{{ item.name }}
@ -55,7 +54,7 @@
<h5>💰 Dodaj wydatek</h5>
<div class="input-group mb-2">
<input id="expenseAmount" type="number" step="0.01" min="0" class="form-control" placeholder="Kwota (PLN)">
<button onclick="submitExpense()" class="btn btn-success">💾 Zapisz</button>
<button onclick="submitExpense({{ list.id }})" class="btn btn-success">💾 Zapisz</button>
</div>
{% endif %}
<p id="total-expense2"><b>💸 Łącznie wydano:</b> {{ '%.2f'|format(total_expense) }} PLN</p>
@ -112,10 +111,9 @@
<div id="toast-container" class="toast-container position-fixed bottom-0 end-0 p-3"></div>
<script>
const LIST_ID = {{ list.id }};
setupList(LIST_ID, 'Gość');
</script>
{% block scripts %}
<script src="{{ url_for('static_bp.serve_js', filename='list_guest.js') }}"></script>
{% endblock %}
{% endblock %}