mstoeck3/forensic-pathways
2
0
Fork 0
Code Issues 8 Pull Requests Projects Releases Activity

flex-center

Browse Source
This commit is contained in:
overcuriousity 2025-08-05 13:38:46 +02:00
parent 99117e8e7a
commit cba42962f6
2 changed files with 1 additions and 294 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

204
src/styles/global.css
View File

@ -149,10 +149,6 @@ a:hover {
padding: 2rem 0;
}
.section-lg {
padding: 3rem 0;
}
/* Flex Utilities */
.flex {
display: flex;
@ -200,10 +196,6 @@ a:hover {
align-items: center;
}
.items-start {
align-items: flex-start;
}
.justify-center {
justify-content: center;
}
@ -222,11 +214,6 @@ a:hover {
grid-template-columns: 1fr 1fr;
}
.grid-3 {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.grid-4 {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
@ -239,24 +226,11 @@ a:hover {
justify-content: center;
}
.grid-auto-fit-sm {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
}
.grid-auto-fit-lg {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 1rem;
}
/* Gap Utilities */
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
/* ===================================================================
@ -264,29 +238,16 @@ a:hover {
================================================================= */
/* Margin Utilities */
.m-0 { margin: 0; }
.m-1 { margin: 0.25rem; }
.m-2 { margin: 0.5rem; }
.m-3 { margin: 0.75rem; }
.m-4 { margin: 1rem; }
.m-6 { margin: 1.5rem; }
.m-8 { margin: 2rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-auto { margin-top: auto; }
.mr-1 { margin-right: 0.25rem; }
.mr-2 { margin-right: 0.5rem; }
.mr-3 { margin-right: 0.75rem; }
.mr-4 { margin-right: 1rem; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
@ -296,34 +257,22 @@ a:hover {
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.ml-1 { margin-left: 0.25rem; }
.ml-2 { margin-left: 0.5rem; }
.ml-3 { margin-left: 0.75rem; }
.ml-4 { margin-left: 1rem; }
/* Padding Utilities */
.p-0 { padding: 0; }
.p-1 { padding: 0.25rem; }
.p-2 { padding: 0.5rem; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.pt-3 { padding-top: 0.75rem; }
.pb-2 { padding-bottom: 0.5rem; }
/* ===================================================================
6. TARGETED UTILITY CLASSES (FOR INLINE STYLE CONSOLIDATION)
@ -333,8 +282,6 @@ a:hover {
.section-padding { padding: 2rem 0; }
.content-center { text-align: center; margin-bottom: 1rem; }
.content-center-lg { text-align: center; margin-bottom: 2rem; }
.content-narrow { max-width: 900px; margin: 0 auto; }
.content-wide { max-width: 1200px; margin: 0 auto; }
/* Card Info Variants (for inline background/padding combinations) */
.card-info-sm {
@ -343,20 +290,6 @@ a:hover {
border-radius: 0.5rem;
}
.card-info-md {
background-color: var(--color-bg-secondary);
padding: 1.5rem;
border-radius: 0.75rem;
border: 1px solid var(--color-border);
}
.card-info-lg {
background-color: var(--color-bg-secondary);
padding: 2rem;
border-radius: 1rem;
border: 1px solid var(--color-border);
}
/* Header/Title Combinations */
.header-center {
text-align: center;
@ -375,42 +308,6 @@ a:hover {
color: white;
}
/* Metadata/Info Text Combinations */
.info-text {
font-size: 0.875rem;
color: var(--color-text-secondary);
line-height: 1.6;
}
.info-text-center {
font-size: 0.875rem;
color: var(--color-text-secondary);
text-align: center;
line-height: 1.6;
}
/* Grid Auto-fit Variants for common inline grid patterns */
.grid-auto-300 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1rem;
}
.grid-auto-400 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 1rem;
}
.grid-auto-500 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
gap: 1.5rem;
}
/* Add to global.css */
.pros-cons-section { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.tool-metadata { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.75rem; }
.grid-cols-2 { grid-template-columns: 1fr 1fr; }
.flex-shrink-1 { flex-shrink: 1; }
@ -420,7 +317,6 @@ a:hover {
/* Text Utilities */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-xs { font-size: 0.75rem; }
@ -430,10 +326,8 @@ a:hover {
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.leading-tight { line-height: 1.25; }
.leading-normal { line-height: 1.5; }
@ -445,12 +339,10 @@ a:hover {
.text-secondary { color: var(--color-text-secondary); }
.text-accent { color: var(--color-accent); }
.text-warning { color: var(--color-warning); }
.text-error { color: var(--color-error); }
/* Display Utilities */
.block { display: block; }
.inline { display: inline; }
.inline-block { display: inline-block; }
.hidden { display: none; }
/* Size Utilities */
@ -466,18 +358,13 @@ a:hover {
.fixed { position: fixed; }
.sticky { position: sticky; }
.top-0 { top: 0; }
.bottom-8 { bottom: 2rem; }
.right-8 { right: 2rem; }
.left-0 { left: 0; }
.z-10 { z-index: 10; }
.z-50 { z-index: 50; }
.z-100 { z-index: 100; }
/* Overflow Utilities */
.overflow-hidden { overflow: hidden; }
.overflow-auto { overflow: auto; }
/* Border Utilities */
.border { border: 1px solid var(--color-border); }
@ -485,19 +372,15 @@ a:hover {
.border-l-4 { border-left: 4px solid; }
.rounded { border-radius: 0.25rem; }
.rounded-md { border-radius: 0.375rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
/* Background Utilities */
.bg-secondary { background-color: var(--color-bg-secondary); }
.bg-tertiary { background-color: var(--color-bg-tertiary); }
/* Cursor Utilities */
.cursor-pointer { cursor: pointer; }
.h-12 { height: 3rem; }
.align-middle { vertical-align: middle; }
@ -637,11 +520,6 @@ nav {
}
/* Button Sizes */
.btn-xs {
padding: 0.25rem 0.5rem;
font-size: 0.75rem;
}
.btn-sm {
padding: 0.375rem 0.75rem;
font-size: 0.8125rem;
@ -799,14 +677,6 @@ input[type="checkbox"] {
}
/* Card Variants */
.card-sm {
padding: 1rem;
}
.card-lg {
padding: 2rem;
}
.card-info {
background-color: var(--color-bg-secondary);
border-left: 4px solid var(--color-primary);
@ -817,15 +687,6 @@ input[type="checkbox"] {
color: white;
}
.card-gradient {
background: linear-gradient(135deg, var(--color-bg-secondary) 0%, var(--color-bg-tertiary) 100%);
}
.card-hero {
background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
color: white;
}
/* Card Type Modifiers */
.card-hosted {
background-color: var(--color-hosted-bg);
@ -869,7 +730,6 @@ input[type="checkbox"] {
.badge-primary { background-color: var(--color-primary); color: white; }
.badge-secondary { background-color: var(--color-bg-secondary); color: var(--color-text); border: 1px solid var(--color-border); }
.badge-success { background-color: var(--color-accent); color: white; }
.badge-accent { background-color: var(--color-accent); color: white; }
.badge-warning { background-color: var(--color-warning); color: white; }
.badge-error { background-color: var(--color-error); color: white; }
@ -2251,14 +2111,6 @@ input[type="checkbox"] {
border-left: 3px solid var(--color-primary);
}
.tool-rec-metadata {
display: flex;
flex-direction: column;
gap: 0.375rem;
font-size: 0.75rem;
color: var(--color-text-secondary);
}
/* ===================================================================
CONFIDENCE INTEGRATION STYLES
================================================================= */
@ -3012,12 +2864,6 @@ footer {
color: var(--color-primary);
}
.stat-unit {
font-size: 0.75rem;
color: var(--color-text-secondary);
margin-left: 0.25rem;
}
.queue-progress-container {
position: relative;
}
@ -3590,7 +3436,6 @@ footer {
}
.grid-2,
.grid-3,
.grid-4 {
grid-template-columns: 1fr;
}
@ -3621,10 +3466,6 @@ footer {
gap: 0.5rem;
}
.filter-row {
grid-template-columns: 1fr;
}
.filter-toggles-compact {
flex-direction: column;
gap: 0.5rem;
@ -3844,9 +3685,6 @@ footer {
MIGRATION UTILITIES - Additional classes for inline style migration
================================================================= */
/* Height utilities */
.h-12 { height: 3rem; }
/* Alignment utilities */
.align-middle { vertical-align: middle; }
@ -3871,17 +3709,8 @@ footer {
color: white;
}
/* Enhanced card info variants (if not already present) */
.card-info-xl {
background-color: var(--color-bg-secondary);
padding: 2.5rem;
border-radius: 1.25rem;
border: 1px solid var(--color-border);
}
/* Ensure we have all text size variants */
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
/* Additional spacing utilities that might be missing */
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
@ -3893,7 +3722,6 @@ footer {
/* Additional rounded variants */
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
/* ===================================================================
23. MARKDOWN CONTENT
@ -4014,38 +3842,6 @@ footer {
background-color: var(--color-bg-secondary);
}
/* Progress indicators */
.audit-progress-step {
position: relative;
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.5rem;
border-radius: 0.375rem;
transition: var(--transition-fast);
}
.audit-progress-step::before {
content: '';
width: 8px;
height: 8px;
border-radius: 50%;
flex-shrink: 0;
transition: var(--transition-fast);
}
.audit-progress-step.success::before {
background-color: var(--color-accent);
}
.audit-progress-step.warning::before {
background-color: var(--color-warning);
}
.audit-progress-step.error::before {
background-color: var(--color-error);
}
/* Responsive adjustments for audit trail */
@media (width <= 768px) {
.audit-process-flow .grid-cols-3 {

89
unused-selectors.txt
View File

@ -1,89 +0,0 @@
.container-wide
.section-sm
.section-lg
.flex-center
.flex-start
.flex-end
.grid-3
.grid-auto-fit-sm
.grid-auto-fit-lg
.gap-6
.m-1
.m-2
.m-3
.m-4
.m-6
.m-8
.mt-0
.mt-6
.mt-8
.mr-1
.mr-4
.ml-1
.ml-3
.ml-4
.p-0
.p-1
.px-1
.px-2
.py-1
.py-3
.py-4
.py-6
.pb-2
.content-narrow
.content-wide
.card-info-md
.card-info-lg
.info-text
.info-text-center
.grid-auto-300
.grid-auto-400
.grid-auto-500
.pros-cons-section
.tool-metadata
.text-left
.font-normal
.font-bold
.text-error
.inline-block
.relative
.absolute
.sticky
.top-0
.left-0
.z-10
.z-100
.overflow-auto
.rounded-md
.rounded-2xl
.bg-tertiary
.h-12
.nav-link
.nav-link:hover
.btn-xs
.card-sm
.card-lg
.card-gradient
.card-hero
.card-concept
.badge-accent
.tool-chip
.tool-chip:hover
.phase-grid
.phase-chip
.phase-chip:hover
.filter-row
.phase-card
.phase-card::before
.phase-card:hover
.tool-rec-metadata
.stat-unit
.share-btn--small
.collaboration-tool-compact
.collaboration-tool-compact:hover
.domain-phase-container
.card-info-xl
.text-3xl
.audit-progress-step
.audit-progress-step::before