bmc_hub/patch_lækker.py

458 lines
18 KiB
Python
Raw Permalink Normal View History

import re
with open("app/shared/frontend/base.html", "r") as f:
content = f.read()
# Update root variables with RGB versions for glassmorphism
if "--bg-card-rgb" not in content:
content = content.replace(
"--bg-card: #ffffff;",
"--bg-card: #ffffff;\n --bg-card-rgb: 255, 255, 255;"
)
content = content.replace(
"--bg-card: #2c3034;",
"--bg-card: #2c3034;\n --bg-card-rgb: 44, 48, 52;"
)
# Update CSS for .global-bottom-bar
old_bottom_bar_css = """ .global-bottom-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: var(--bottom-bar-zindex);
background: var(--bg-card);
border-top: 1px solid rgba(0, 0, 0, 0.08);
box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.06);
min-height: var(--bottom-bar-height);
padding: 0.35rem 1rem calc(0.35rem + env(safe-area-inset-bottom, 0px));
transform: translateY(calc(100% + 12px));
opacity: 0;
transition: transform 0.3s ease, opacity 0.25s ease;
}"""
new_bottom_bar_css = """ .global-bottom-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: var(--bottom-bar-zindex);
background: rgba(var(--bg-card-rgb), 0.85); /* Glassmorphism */
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-top: 1px solid rgba(var(--text-primary-rgb), 0.1);
box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.08);
border-top-left-radius: 16px;
border-top-right-radius: 16px;
min-height: var(--bottom-bar-height);
padding: 0.5rem 1rem calc(0.5rem + env(safe-area-inset-bottom, 0px));
transform: translateY(calc(100% + 12px));
opacity: 0;
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}"""
content = content.replace(old_bottom_bar_css, new_bottom_bar_css)
# Ensure --text-primary-rgb exists
if "--text-primary-rgb" not in content:
content = content.replace(
"--text-primary: #2c3e50;",
"--text-primary: #2c3e50;\n --text-primary-rgb: 44, 62, 80;"
)
content = content.replace(
"--text-primary: #f8f9fa;",
"--text-primary: #f8f9fa;\n --text-primary-rgb: 248, 249, 250;"
)
# Fix Count Line CSS
old_count_line_css = """ .global-bottom-bar .bb-count-line {
flex: 1;
background: var(--accent-light);
color: var(--text-primary);
border-radius: 10px;
border: 1px solid rgba(0, 0, 0, 0.08);
padding: 0.45rem 0.75rem;
font-size: 0.84rem;
font-weight: 600;
line-height: 1.35;
white-space: nowrap;
overflow-x: auto;
scrollbar-width: thin;
display: flex;
align-items: center;
gap: 0.4rem;
}"""
new_count_line_css = """ .global-bottom-bar .bb-count-line {
flex: 1;
background: transparent;
color: var(--text-primary);
padding: 0 0.25rem;
font-size: 0.84rem;
font-weight: 600;
line-height: 1.35;
white-space: nowrap;
overflow-x: auto;
scrollbar-width: none; /* Cleaner look without scrollbar */
display: flex;
align-items: center;
gap: 0.6rem;
}
.global-bottom-bar .bb-count-line::-webkit-scrollbar {
display: none;
}"""
content = content.replace(old_count_line_css, new_count_line_css)
# Fix Chip CSS
old_chip_css = """ .global-bottom-bar .bb-chip {
border: 1px solid rgba(0, 0, 0, 0.1);
background: var(--bg-card);
color: var(--text-primary);
border-radius: 999px;
padding: 0.2rem 0.6rem;
font-size: 0.79rem;
font-weight: 700;
line-height: 1.2;
cursor: pointer;
flex: 0 0 auto;
}"""
new_chip_css = """ .global-bottom-bar .bb-chip {
border: 1px solid rgba(var(--text-primary-rgb), 0.1);
background: var(--accent-light);
color: var(--text-primary);
border-radius: 999px;
padding: 0.35rem 0.85rem;
font-size: 0.8rem;
font-weight: 600;
line-height: 1.2;
cursor: pointer;
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 0.35rem;
box-shadow: 0 1px 3px rgba(0,0,0,0.04);
transition: all 0.2s ease;
}"""
content = content.replace(old_chip_css, new_chip_css)
old_chip_hover = """ .global-bottom-bar .bb-chip:hover,
.global-bottom-bar .bb-chip.is-active {
border-color: var(--accent);
color: var(--accent);
}"""
new_chip_hover = """ .global-bottom-bar .bb-chip:hover {
transform: translateY(-1px);
box-shadow: 0 3px 8px rgba(0,0,0,0.08);
border-color: rgba(var(--text-primary-rgb), 0.2);
}
.global-bottom-bar .bb-chip.is-active {
background: var(--accent);
color: white;
border-color: var(--accent);
box-shadow: 0 4px 12px rgba(15, 76, 117, 0.3);
}
[data-bs-theme="dark"] .global-bottom-bar .bb-chip.is-active {
color: #fff;
}"""
content = content.replace(old_chip_hover, new_chip_hover)
# Toggle styling
old_toggle_css = """ .global-bottom-bar .bb-sheet-toggle {
border: 1px solid rgba(0, 0, 0, 0.1);
background: var(--accent-light);
color: var(--text-primary);
border-radius: 10px;
padding: 0.42rem 0.7rem;
font-size: 0.82rem;
font-weight: 700;
line-height: 1.2;
display: inline-flex;
align-items: center;
gap: 0.45rem;
}"""
new_toggle_css = """ .global-bottom-bar .bb-sheet-toggle {
border: 1px solid rgba(var(--text-primary-rgb), 0.1);
background: transparent;
color: var(--text-primary);
border-radius: 50%;
width: 36px;
height: 36px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1.1rem;
transition: all 0.2s ease;
}
.global-bottom-bar .bb-sheet-toggle:hover {
background: var(--accent-light);
transform: translateY(-1px);
}
.global-bottom-bar .bb-sheet-toggle span { display: none; }"""
content = content.replace(old_toggle_css, new_toggle_css)
# Adjust inner sheet panel styling
old_sheet_inner = """ .global-bottom-bar .bb-sheet-inner {
background: var(--bg-card);
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 12px;
display: grid;
grid-template-columns: 150px minmax(0, 1fr);
min-height: 210px;
max-height: min(50vh, 420px);
overflow: hidden;
}"""
new_sheet_inner = """ .global-bottom-bar .bb-sheet-inner {
background: var(--bg-card);
border: 1px solid rgba(var(--text-primary-rgb), 0.1);
border-radius: 14px;
display: grid;
grid-template-columns: 160px minmax(0, 1fr);
min-height: 240px;
max-height: min(52vh, 420px);
overflow: hidden;
box-shadow: inset 0 2px 10px rgba(0,0,0,0.02);
margin-top: 0.5rem;
}"""
content = content.replace(old_sheet_inner, new_sheet_inner)
old_side_tabs = """ .global-bottom-bar .bb-side-tabs {
border-right: 1px solid rgba(0, 0, 0, 0.08);
background: var(--accent-light);
padding: 0.45rem;
display: grid;
gap: 0.35rem;
align-content: start;
}"""
new_side_tabs = """ .global-bottom-bar .bb-side-tabs {
border-right: 1px solid rgba(var(--text-primary-rgb), 0.08);
background: rgba(var(--text-primary-rgb), 0.03);
padding: 0.75rem 0.5rem;
display: grid;
gap: 0.4rem;
align-content: start;
}"""
content = content.replace(old_side_tabs, new_side_tabs)
old_tab_btn = """ .global-bottom-bar .bb-tab-btn {
border: 1px solid transparent;
background: transparent;
color: var(--text-secondary);
border-radius: 8px;
text-align: left;
font-size: 0.82rem;
font-weight: 700;
padding: 0.35rem 0.5rem;
line-height: 1.2;
}
.global-bottom-bar .bb-tab-btn.is-active {
border-color: var(--accent);
color: var(--accent);
background: var(--bg-card);
}"""
new_tab_btn = """ .global-bottom-bar .bb-tab-btn {
border: 1px solid transparent;
background: transparent;
color: var(--text-secondary);
border-radius: 8px;
text-align: left;
font-size: 0.85rem;
font-weight: 600;
padding: 0.5rem 0.75rem;
line-height: 1.3;
transition: all 0.2s ease;
display: flex;
align-items: center;
gap: 0.5rem;
}
.global-bottom-bar .bb-tab-btn i {
font-size: 1rem;
opacity: 0.7;
}
.global-bottom-bar .bb-tab-btn:hover {
background: rgba(var(--text-primary-rgb), 0.05);
color: var(--text-primary);
}
.global-bottom-bar .bb-tab-btn.is-active {
background: var(--bg-card);
color: var(--accent);
box-shadow: 0 2px 6px rgba(0,0,0,0.06);
font-weight: 700;
}
.global-bottom-bar .bb-tab-btn.is-active i {
opacity: 1;
color: var(--accent);
}"""
content = content.replace(old_tab_btn, new_tab_btn)
old_tab_content = """ .global-bottom-bar .bb-tab-content {
padding: 0.65rem 0.8rem;
overflow: auto;
}
.global-bottom-bar .bb-tab-title {
font-size: 0.9rem;
font-weight: 800;
color: var(--text-primary);
margin-bottom: 0.45rem;
}
.global-bottom-bar .bb-tab-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 0.35rem;
}
.global-bottom-bar .bb-tab-list li {
border-left: 3px solid var(--accent);
background: var(--accent-light);
border-radius: 6px;
padding: 0.38rem 0.55rem;
font-size: 0.81rem;
line-height: 1.3;
color: var(--text-primary);
}"""
new_tab_content = """ .global-bottom-bar .bb-tab-content {
padding: 1.2rem;
overflow: auto;
}
.global-bottom-bar .bb-tab-title {
font-size: 1.1rem;
font-weight: 700;
color: var(--text-primary);
margin-bottom: 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
}
.global-bottom-bar .bb-tab-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 0.6rem;
}
.global-bottom-bar .bb-tab-list li {
border-left: 4px solid var(--accent);
background: var(--accent-light);
border-radius: 6px 8px 8px 6px;
padding: 0.75rem 1rem;
font-size: 0.88rem;
line-height: 1.4;
color: var(--text-primary);
box-shadow: 0 1px 3px rgba(0,0,0,0.03);
transition: transform 0.2s ease;
}
.global-bottom-bar .bb-tab-list li:hover {
transform: translateX(2px);
}"""
content = content.replace(old_tab_content, new_tab_content)
old_detail_line = """ .global-bottom-bar .bb-detail-line {
margin-top: 0.35rem;
background: var(--bg-card);
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 8px;
padding: 0.35rem 0.6rem;
font-size: 0.8rem;
color: var(--text-secondary);
white-space: nowrap;
overflow-x: auto;
scrollbar-width: thin;
}"""
new_detail_line = """ .global-bottom-bar .bb-detail-line {
margin-top: 0.5rem;
background: transparent;
padding: 0 0.5rem;
font-size: 0.82rem;
color: var(--text-secondary);
white-space: nowrap;
overflow-x: auto;
scrollbar-width: none;
transition: opacity 0.2s ease;
}
.global-bottom-bar.is-expanded .bb-detail-line {
opacity: 0;
pointer-events: none;
position: absolute;
}"""
content = content.replace(old_detail_line, new_detail_line)
# Now fix the markup icons
old_markup = """<div id="globalBottomBar" class="global-bottom-bar" hidden>
<div class="bb-header">
<div id="bbCountLine" class="bb-count-line" role="status" aria-live="polite">
<button class="bb-chip" type="button" data-bb-key="timer">Timer: 0</button>
<button class="bb-chip" type="button" data-bb-key="calls">Opkald: 0</button>
<button class="bb-chip" type="button" data-bb-key="mail">Mail: 0</button>
<button class="bb-chip" type="button" data-bb-key="alerts">Alerts: 0</button>
<button class="bb-chip" type="button" data-bb-key="reminders">Reminders: 0</button>
</div>
<button id="bbSheetToggle" class="bb-sheet-toggle" type="button" aria-expanded="false" aria-controls="bbSheetPanel">
Info
<i class="bi bi-chevron-up" aria-hidden="true"></i>
</button>
</div>
<div id="bbCountDetail" class="bb-detail-line" role="status" aria-live="polite">Klik pa en kategori for detaljer</div>
<div id="bbSheetPanel" class="bb-sheet-panel" aria-hidden="true">
<div class="bb-sheet-inner">
<div class="bb-side-tabs" role="tablist" aria-label="Bundbar kategorier">
<button class="bb-tab-btn is-active" type="button" data-bb-tab="timer" role="tab" aria-selected="true">Timer</button>
<button class="bb-tab-btn" type="button" data-bb-tab="calls" role="tab" aria-selected="false">Opkald</button>
<button class="bb-tab-btn" type="button" data-bb-tab="mail" role="tab" aria-selected="false">Mail</button>
<button class="bb-tab-btn" type="button" data-bb-tab="alerts" role="tab" aria-selected="false">Alerts</button>
<button class="bb-tab-btn" type="button" data-bb-tab="reminders" role="tab" aria-selected="false">Reminders</button>
</div>
<div class="bb-tab-content" role="tabpanel" aria-live="polite">
<div id="bbTabTitle" class="bb-tab-title">Timer</div>
<ul id="bbTabList" class="bb-tab-list">
<li>Venter pa data...</li>
</ul>
</div>
</div>
</div>
</div>"""
new_markup = """<div id="globalBottomBar" class="global-bottom-bar" hidden>
<div class="bb-header">
<div id="bbCountLine" class="bb-count-line" role="status" aria-live="polite">
<button class="bb-chip" type="button" data-bb-key="timer"><i class="bi bi-clock-history"></i> <span class="bb-chip-text">Timer: 0</span></button>
<button class="bb-chip" type="button" data-bb-key="calls"><i class="bi bi-telephone"></i> <span class="bb-chip-text">Opkald: 0</span></button>
<button class="bb-chip" type="button" data-bb-key="mail"><i class="bi bi-envelope"></i> <span class="bb-chip-text">Mail: 0</span></button>
<button class="bb-chip" type="button" data-bb-key="alerts"><i class="bi bi-exclamation-triangle"></i> <span class="bb-chip-text">Alerts: 0</span></button>
<button class="bb-chip" type="button" data-bb-key="reminders"><i class="bi bi-bell"></i> <span class="bb-chip-text">Reminders: 0</span></button>
</div>
<button id="bbSheetToggle" class="bb-sheet-toggle" type="button" aria-expanded="false" aria-controls="bbSheetPanel" aria-label="Toggle detaljer">
<span>Info</span>
<i class="bi bi-chevron-up" aria-hidden="true"></i>
</button>
</div>
<div id="bbCountDetail" class="bb-detail-line" role="status" aria-live="polite"><i class="bi bi-info-circle me-1 opacity-75"></i> Klik en kategori for at se detaljer</div>
<div id="bbSheetPanel" class="bb-sheet-panel" aria-hidden="true">
<div class="bb-sheet-inner">
<div class="bb-side-tabs" role="tablist" aria-label="Bundbar kategorier">
<button class="bb-tab-btn is-active" type="button" data-bb-tab="timer" role="tab" aria-selected="true"><i class="bi bi-clock-history"></i> Timer</button>
<button class="bb-tab-btn" type="button" data-bb-tab="calls" role="tab" aria-selected="false"><i class="bi bi-telephone"></i> Opkald</button>
<button class="bb-tab-btn" type="button" data-bb-tab="mail" role="tab" aria-selected="false"><i class="bi bi-envelope"></i> Mail</button>
<button class="bb-tab-btn" type="button" data-bb-tab="alerts" role="tab" aria-selected="false"><i class="bi bi-exclamation-triangle"></i> Alerts</button>
<button class="bb-tab-btn" type="button" data-bb-tab="reminders" role="tab" aria-selected="false"><i class="bi bi-bell"></i> Reminders</button>
</div>
<div class="bb-tab-content" role="tabpanel" aria-live="polite">
<div id="bbTabTitle" class="bb-tab-title"><i class="bi bi-clock-history me-1 text-accent"></i> <span class="bb-tab-title-text">Timer</span></div>
<ul id="bbTabList" class="bb-tab-list">
<li>Venter data...</li>
</ul>
</div>
</div>
</div>
</div>"""
content = content.replace(old_markup, new_markup)
with open("app/shared/frontend/base.html", "w") as f:
f.write(content)