ryan/chore
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 5 Releases Wiki Activity

refactor: Update layout and styling components; remove unused CSS files and enhance button styles
All checks were successful
Gitea Actions Demo / build-and-push (push) Successful in 46s
Details

Browse Source
This commit is contained in:
Ryan Kegel
2026-02-02 23:53:04 -05:00
parent 5351932194
commit 99d3aeb068
7 changed files with 295 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
frontend/vue-app/src/assets/layout-shared.css
View File

@@ -1,108 +0,0 @@
/* Root layout */
.layout-root {
width: 100%;
min-height: 100vh;
height: 100vh;
display: flex;
flex-direction: column;
padding: 0;
background: var(--header-bg, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
}
/* Top bar */
.topbar {
display: flex;
align-items: stretch;
padding: 5px 5px;
height: 48px;
width: 100%;
box-sizing: border-box;
}
/* Back button container and login button container */
.back-btn-container,
.login-btn-container {
height: 100%;
display: flex;
align-items: center;
flex: 1 1 0;
}
.back-btn-container {
justify-content: flex-start;
}
.login-btn-container {
justify-content: flex-end;
}
/* Spacer for layouts without a center nav */
.spacer {
flex: 1 1 auto;
}
/* Back button */
.back-btn {
background: var(--button-bg, #fff);
border: 0;
padding: 0.6rem 1rem;
border-radius: 8px 8px 0 0;
cursor: pointer;
color: var(--button-text, #667eea);
font-weight: 600;
height: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
}
/* Login button inside login-btn container */
.login-btn {
background: var(--button-bg, #fff);
border: 0;
padding: 0.6rem 1rem;
border-radius: 8px 8px 0 0;
cursor: pointer;
color: var(--button-text, #667eea);
font-weight: 600;
height: 100%;
display: flex;
align-items: center;
}
/* Main content area */
.main-content {
flex: 1 1 auto;
width: 100%;
justify-content: center;
align-items: flex-start;
box-sizing: border-box;
min-height: 0;
height: 0;
overflow: hidden;
overflow-y: visible;
}
/* App version display */
.app-version {
position: fixed;
right: 18px;
bottom: 12px;
font-size: 0.92rem;
color: var(--app-version, #cbd5e1);
opacity: 0.85;
z-index: 100;
pointer-events: none;
user-select: none;
font-family: monospace;
}
/* Responsive adjustments */
@media (max-width: 480px) {
.back-btn,
.login-btn button {
padding: 0.45rem 0.75rem;
font-size: 0.6rem;
height: 100%;
}
}