Files
SimpleCloudNotifier/webapp/src/styles.scss
Mike Schwörer 2b7950f5dc
All checks were successful
Build Docker and Deploy / Build Docker Container (push) Successful in 1m41s
Build Docker and Deploy / Run Unit-Tests (push) Successful in 9m31s
Build Docker and Deploy / Deploy to Server (push) Successful in 18s
More webapp changes+fixes
2025-12-05 21:39:32 +01:00

169 lines
2.5 KiB
SCSS

@import "ng-zorro-antd/ng-zorro-antd.min.css";
html, body {
height: 100%;
margin: 0;
padding: 0;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
// Global utilities
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.mb-0 { margin-bottom: 0; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }
.mt-0 { margin-top: 0; }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mr-8 { margin-right: 8px; }
.mr-16 { margin-right: 16px; }
.ml-8 { margin-left: 8px; }
.ml-16 { margin-left: 16px; }
.p-16 { padding: 16px; }
.p-24 { padding: 24px; }
.w-100 { width: 100%; }
// Monospace for IDs and keys
.mono {
font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', 'Droid Sans Mono', 'Source Code Pro', monospace;
font-size: 13px;
}
// Card styling
.content-card {
margin-bottom: 16px;
}
// Page content wrapper
.page-content {
padding: 24px;
background: #fff;
min-height: calc(100vh - 64px);
}
// Filter bar
.filter-bar {
display: flex;
gap: 16px;
flex-wrap: wrap;
margin-bottom: 16px;
align-items: center;
}
// Clickable row with anchor link for proper middle-click support
.clickable-row {
&:hover {
background-color: #fafafa;
}
}
td:has(> a.cell-link) {
padding: 0 !important;
}
a.cell-link {
display: block;
padding: 8px;
color: inherit;
text-decoration: none;
&:hover {
color: inherit;
}
}
// Status colors
.status-confirmed {
color: #52c41a;
}
.status-pending {
color: #faad14;
}
.status-inactive {
color: #999;
}
// Priority colors
.priority-high {
color: #f5222d;
}
.priority-normal {
color: #1890ff;
}
.priority-low {
color: #999;
}
// Empty state wrapper
.empty-wrapper {
padding: 48px 0;
}
// Action buttons group
.action-buttons {
display: flex;
gap: 8px;
justify-content: flex-end;
}
// Detail page header
.detail-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24px;
}
// QR code display
.qr-code-container {
display: flex;
justify-content: center;
padding: 24px;
img {
max-width: 256px;
width: 100%;
height: auto;
}
}
nz-card {
border: 1px solid #CCC !important;
box-shadow: 0 0 6px #CCC;
> .ant-card-head {
border-bottom: 1px solid #CCC;
}
display: flex;
flex-direction: column;
> .ant-card-body {
flex-grow: 1;
}
}
th {
white-space: pre;
}