Update planner search and planner editor

This commit is contained in:
2026-04-08 22:16:20 +02:00
parent 4706430316
commit 165f39d0b7
7 changed files with 693 additions and 301 deletions

View File

@@ -11,7 +11,7 @@
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<title>Recipe App - Modular</title>
<link rel="manifest" href="./manifest.webmanifest?v=20260407-66">
<link rel="manifest" href="./manifest.webmanifest?v=20260408-82">
<link rel="icon" type="image/png" sizes="192x192" href="./icons/icon-192.png">
<link rel="apple-touch-icon" href="./icons/apple-touch-icon.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
@@ -255,24 +255,24 @@
}
/* Cards and sheets */
#recipe-grid > div {
#recipe-grid > * {
background: #393937 !important;
border: none !important;
border-radius: 1.75rem !important;
box-shadow: none !important;
transition: transform 180ms ease, box-shadow 180ms ease !important;
}
#recipe-grid > div:hover {
#recipe-grid > *:hover {
transform: translateY(-2px);
box-shadow: none !important;
}
#recipe-grid > div img {
#recipe-grid > * img {
transition: transform 240ms ease;
}
#recipe-grid > div:hover img {
#recipe-grid > *:hover img {
transform: scale(1.04);
}
#recipe-grid > div > div:first-child::after,
#recipe-grid > * > div:first-child::after,
#rd-hero::after {
content: '';
position: absolute;
@@ -280,7 +280,8 @@
background: linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(var(--app-bg-rgb), 0.5) 92%);
pointer-events: none;
}
#recipe-search-shell {
#recipe-search-shell,
#planner-picker-search-shell {
min-height: 3rem;
width: min(calc(100% - 0.5rem), 22.4rem);
margin-inline: auto;
@@ -298,7 +299,8 @@
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
}
#recipe-search-shell::after {
#recipe-search-shell::after,
#planner-picker-search-shell::after {
content: '';
position: absolute;
left: 11%;
@@ -312,7 +314,8 @@
z-index: -1;
pointer-events: none;
}
#recipe-search-shell:focus-within {
#recipe-search-shell:focus-within,
#planner-picker-search-shell:focus-within {
background: #393937 !important;
border: 1px solid #4a4b47 !important;
box-shadow:
@@ -321,7 +324,8 @@
0 24px 36px rgba(0, 0, 0, 0.18),
inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}
#recipe-search-input {
#recipe-search-input,
#planner-picker-search {
appearance: none;
-webkit-appearance: none;
background: transparent !important;
@@ -334,17 +338,20 @@
font-weight: 400;
letter-spacing: -0.02em;
}
#recipe-search-input::placeholder {
#recipe-search-input::placeholder,
#planner-picker-search::placeholder {
color: #beb8ae !important;
opacity: 1;
}
#recipe-filter-btn {
#recipe-filter-btn,
#planner-picker-filter-btn {
border-radius: 999px;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
#recipe-filter-btn:hover {
#recipe-filter-btn:hover,
#planner-picker-filter-btn:hover {
background: rgba(255, 255, 255, 0.03) !important;
}
#planner-picker-sheet,
@@ -524,7 +531,7 @@
</div>
<script>
const APP_ASSET_VERSION = '20260407-66';
const APP_ASSET_VERSION = '20260408-82';
const APP_VERSION_STORAGE_KEY = 'recipe-app-asset-version';
const APP_VERSION_QUERY_KEY = 'appv';
@@ -558,7 +565,7 @@
})();
</script>
<script type="module">
const appVersion = window.__APP_ASSET_VERSION__ || '20260407-66';
const appVersion = window.__APP_ASSET_VERSION__ || '20260408-82';
const recoveryKey = `recipe-app-recovery-${appVersion}`;
function renderBootstrapError(message) {