changed modal dialogs

and images on landingpage
This commit is contained in:
2026-01-13 23:11:57 +01:00
parent 96ea032dcc
commit 469cdfcc90
17 changed files with 27 additions and 175 deletions
+1 -1
View File
@@ -1,7 +1,7 @@
package config
// Version is the application version
const Version = "0.1.32"
const Version = "0.1.33"
var (
// GitCommit will be set by build flags or detected at runtime
Binary file not shown.
+1 -1
View File
@@ -1,6 +1,6 @@
# Frontend Version Management
## Current Version: 0.1.23
## Current Version: 0.1.25
The frontend version is managed independently from the backend.
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "bamort-frontend",
"version": "0.1.23",
"version": "0.1.25",
"private": true,
"license": "SEE LICENSE IN LICENSE",
"type": "module",
Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 416 KiB

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 MiB

+1
View File
@@ -0,0 +1 @@
Drache_fliegend.png
+1
View File
@@ -0,0 +1 @@
Castle.png
Binary file not shown.

Before

Width:  |  Height:  |  Size: 143 KiB

After

Width:  |  Height:  |  Size: 1.5 MiB

+16 -2
View File
@@ -1617,6 +1617,20 @@ a:focus {
}
}
/* Fullscreen modal variant */
.modal-fullscreen {
border-radius: 0;
width: 100vw;
height: 100vh;
max-width: none;
max-height: none;
overflow: hidden;
box-shadow: none;
position: absolute;
top: 0;
left: 0;
}
/* ========================================
CONSOLIDATED BUTTON STYLES
======================================== */
@@ -3811,7 +3825,7 @@ a:focus {
display: flex;
justify-content: center;
align-items: center;
background-image: url('/Abgrund-DD2.jpg');
background-image: url('/lp_background.png');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
@@ -3845,7 +3859,7 @@ a:focus {
}
.dragon-image {
max-width: 300px;
max-width: 400px;
width: 100%;
height: auto;
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
+2 -2
View File
@@ -49,7 +49,7 @@
<!-- Dialog für Ausrüstung hinzufügen -->
<div v-if="showAddDialog" class="modal-overlay" @click.self="closeDialog">
<div class="modal-content">
<div class="modal-content modal-fullscreen">
<div class="modal-header">
<h3>{{ $t('equipment.addEquipment') }}</h3>
<button @click="closeDialog" class="close-button">&times;</button>
@@ -119,7 +119,7 @@
</template>
<style>
<style scoped>
/* All styles moved to main.css */
/* Equipment-specific table header color override */
@@ -1,6 +1,6 @@
<template>
<div v-if="isVisible" class="modal-overlay" @click.self="closeDialog">
<div class="modal-content modal-wide">
<div class="modal-content modal-fullscreen">
<h3>{{ skill?.name }} verbessern</h3>
<!-- Aktuelle Ressourcen -->
+1 -165
View File
@@ -1,6 +1,6 @@
<template>
<div v-if="isVisible" class="modal-overlay" @click.self="closeDialog">
<div class="modal-content skill-learn-dialog">
<div class="modal-content modal-fullscreen skill-learn-dialog">
<div class="dialog-header">
<h3>Neue Fertigkeit lernen</h3>
<button @click="closeDialog" class="btn-close">&times;</button>
@@ -741,168 +741,4 @@ export default {
<style scoped>
/* Component-specific styles - common styles are in main.css */
/* Fullscreen modal override */
.modal-content {
background: white;
border-radius: 0;
width: 100vw;
height: 100vh;
max-width: none;
max-height: none;
overflow: hidden;
box-shadow: none;
animation: modalSlideIn 0.3s ease;
display: flex;
flex-direction: column;
position: absolute;
top: 0;
left: 0;
}
@keyframes modalSlideIn {
from {
opacity: 0;
transform: scale(0.9) translateY(-20px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
/* Component-specific overrides */
.resource-display-card {
background: white;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.resource-amount {
color: #1da766;
}
.modal-actions {
border-radius: 0;
flex-shrink: 0;
}
/* Button overrides for this specific dialog */
.btn-confirm {
padding: 12px 24px;
background: #1da766;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-weight: 600;
font-size: 14px;
transition: all 0.2s ease;
display: flex;
align-items: center;
gap: 8px;
}
.btn-confirm:hover:not(:disabled) {
background: #16a085;
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(29, 167, 102, 0.3);
}
.btn-confirm:disabled {
background: #6c757d;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.btn-cancel {
padding: 12px 24px;
background: #6c757d;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-weight: 600;
font-size: 14px;
transition: all 0.2s ease;
}
.btn-cancel:hover:not(:disabled) {
background: #5a6268;
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
}
.btn-cancel:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.loading-spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* Responsive Design */
@media (max-width: 768px) {
.modal-content {
width: 95%;
margin: 10px;
max-width: none;
}
.cost-breakdown {
flex-direction: column;
gap: 10px;
}
.modal-actions {
flex-direction: column;
align-items: stretch;
}
.action-buttons {
width: 100%;
}
.btn-confirm,
.btn-cancel {
width: 100%;
}
.total-costs-breakdown {
flex-direction: column;
gap: 4px;
}
.category-filters {
flex-direction: column;
gap: 6px;
}
.sort-and-search-controls {
flex-direction: column;
gap: 12px;
align-items: stretch;
}
.sort-controls {
justify-content: center;
}
.skills-search {
min-width: auto;
}
.category-filter-btn {
width: 100%;
text-align: center;
}
}
</style>
+1 -1
View File
@@ -1,5 +1,5 @@
// Frontend version information
export const VERSION = '0.1.23'
export const VERSION = '0.1.25'
// Git commit will be injected at build time or detected from env
export const GIT_COMMIT = import.meta.env.VITE_GIT_COMMIT || 'unknown'
+1 -1
View File
@@ -2,7 +2,7 @@
<div class="landing-page">
<div class="landing-content">
<div class="dragon-container">
<img src="/Drache.png" alt="Bamort Dragon" class="dragon-image" />
<img src="/bamorty.png" alt="Bamort Dragon" class="dragon-image" />
</div>
<div class="info-container">