snick/order
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases 1 Wiki Activity

- Implemented the Lakeside Orders demo rebrand:

Browse Source 
New licensed lake, picnic, dining, server, burger, and food photography.
Rebuilt homepage gallery, logo, colors, copy, menu, specials, and 
exports.
Added dashboard-configurable branding in [settings.php (line 
18)](/Users/tyemeclifford/Documents/GH/fatbottomgrille/views/admin/settings.php:18).
Added a public attribution page and full [image 
credits](/Users/tyemeclifford/Documents/GH/fatbottomgrille/public/assets/images/CREDITS.md).
Migrated existing SQLite menu data and admin email to 
admin@lakesideorders.test.
Verified 51 PHP files, JSON/JavaScript, storefront pages, database 
migration, admin settings, and menu PDF. All passed.
This commit is contained in:
Ty Clifford
2026-06-14 14:26:09 -04:00
parent 03348cad79
commit b14f4c1796
33 changed files with 531 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/app.css
+168 -30
View File
@@ -3,8 +3,8 @@
--ink-soft: #0e1d2b;
--navy: #12283b;
--navy-light: #1c3a50;
--gold: #c8973b;
--gold-light: #e1b75e;
--gold: #35d6c1;
--gold-light: #8af5e6;
--cream: #f3eedf;
--paper: #faf7ef;
--white: #ffffff;
@@ -41,9 +41,10 @@ body {
body.store-body {
background-image:
radial-gradient(circle at 0 0, rgba(200, 151, 59, 0.08), transparent 28%),
radial-gradient(circle at 0 0, rgba(53, 214, 193, 0.1), transparent 28%),
radial-gradient(circle at 92% 12%, rgba(114, 92, 255, 0.09), transparent 24%),
linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px);
background-size: auto, 100% 22px;
background-size: auto, auto, 100% 22px;
}
a {
@@ -409,8 +410,8 @@ h3 {
overflow: hidden;
color: var(--cream);
background:
linear-gradient(90deg, rgba(5, 12, 18, 0.99) 0%, rgba(8, 20, 30, 0.96) 48%, rgba(8, 18, 28, 0.76) 100%),
url("images/reuben-fries.jpg") center 48% / cover no-repeat;
linear-gradient(90deg, rgba(5, 12, 18, 0.99) 0%, rgba(8, 20, 30, 0.95) 46%, rgba(8, 18, 28, 0.48) 100%),
url("images/lakeside-sunset.jpg") center 56% / cover no-repeat;
}
.hero::after {
@@ -708,25 +709,25 @@ h3 {
.special-card:nth-child(4n + 1) {
background-image:
linear-gradient(112deg, rgba(5, 12, 18, 0.98), rgba(8, 18, 28, 0.82)),
url("images/quesadilla.jpg");
url("images/lakeside-burger.jpg");
}
.special-card:nth-child(4n + 2) {
background-image:
linear-gradient(112deg, rgba(5, 12, 18, 0.98), rgba(8, 18, 28, 0.8)),
url("images/sausage-kale-soup.jpg");
url("images/boardwalk-fries.jpg");
}
.special-card:nth-child(4n + 3) {
background-image:
linear-gradient(112deg, rgba(5, 12, 18, 0.98), rgba(8, 18, 28, 0.78)),
url("images/grilled-chicken-salad.jpg");
url("images/shoreline-bowl.jpg");
}
.special-card:nth-child(4n + 4) {
background-image:
linear-gradient(112deg, rgba(5, 12, 18, 0.98), rgba(8, 18, 28, 0.8)),
url("images/curry-rice.jpg");
url("images/picnic-wrap.jpg");
}
.special-card::after {
@@ -832,43 +833,43 @@ h3 {
.menu-card:nth-child(7n + 1) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/reuben-fries.jpg");
url("images/lakeside-burger.jpg");
}
.menu-card:nth-child(7n + 2) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/chicken-sandwich-fries.jpg");
url("images/picnic-wrap.jpg");
}
.menu-card:nth-child(7n + 3) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/quesadilla.jpg");
url("images/shoreline-bowl.jpg");
}
.menu-card:nth-child(7n + 4) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/curry-rice.jpg");
url("images/lakehouse-chicken.jpg");
}
.menu-card:nth-child(7n + 5) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/italian-sub.jpg");
url("images/boardwalk-fries.jpg");
}
.menu-card:nth-child(7n + 6) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/sausage-kale-soup.jpg");
url("images/lemon-iced-tea.jpg");
}
.menu-card:nth-child(7n) .menu-card-art:not(.has-image) {
background-image:
linear-gradient(rgba(5, 12, 18, 0.62), rgba(5, 12, 18, 0.86)),
url("images/grilled-chicken-salad.jpg");
url("images/patio-dining.jpg");
}
.menu-card-art:not(.has-image) {
@@ -968,6 +969,78 @@ h3 {
background: #08141f;
}
.lakeside-gallery {
background:
radial-gradient(circle at 92% 16%, rgba(239, 91, 161, 0.11), transparent 28%),
radial-gradient(circle at 8% 84%, rgba(31, 124, 255, 0.1), transparent 30%),
#07131d;
}
.experience-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
}
.experience-card {
position: relative;
min-height: 320px;
margin: 0;
overflow: hidden;
background: var(--navy);
border: 1px solid rgba(138, 245, 230, 0.2);
border-radius: var(--radius-large);
}
.experience-card-wide {
min-height: 470px;
grid-column: 1 / -1;
}
.experience-card img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 420ms ease;
}
.experience-card:hover img {
transform: scale(1.025);
}
.experience-card::after {
position: absolute;
inset: 0;
background: linear-gradient(transparent 38%, rgba(5, 12, 18, 0.9));
content: "";
}
.experience-card figcaption {
position: absolute;
z-index: 2;
right: 26px;
bottom: 24px;
left: 26px;
display: flex;
flex-direction: column;
}
.experience-card figcaption span {
color: var(--gold-light);
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.experience-card figcaption strong {
color: var(--cream);
font-family: var(--font-display);
font-size: clamp(1.8rem, 4vw, 3.4rem);
line-height: 1;
text-transform: uppercase;
}
.category-band {
padding-block: 55px;
color: var(--cream);
@@ -1034,10 +1107,23 @@ h3 {
min-height: 410px;
place-items: center;
overflow: hidden;
color: var(--gold);
background:
linear-gradient(rgba(5, 12, 18, 0.58), rgba(5, 12, 18, 0.9)),
url("images/italian-sub.jpg") center / cover no-repeat;
color: var(--gold-light);
background: var(--navy);
}
.story-art::after {
position: absolute;
inset: 0;
background: linear-gradient(rgba(5, 12, 18, 0.16), rgba(5, 12, 18, 0.78));
content: "";
}
.story-art img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.story-number {
@@ -1069,7 +1155,7 @@ h3 {
color: var(--cream);
background:
linear-gradient(90deg, rgba(5, 12, 18, 0.97), rgba(8, 18, 28, 0.8)),
url("images/italian-sub.jpg") center 55% / cover no-repeat;
url("images/lakeside-sunset.jpg") center 56% / cover no-repeat;
}
.page-hero-compact {
@@ -1086,6 +1172,41 @@ h3 {
color: #b9c4ca;
}
.narrow-content {
max-width: 880px;
}
.credits-list {
border-top: 1px solid var(--line);
}
.credits-list article {
display: flex;
align-items: center;
justify-content: space-between;
gap: 25px;
padding-block: 22px;
border-bottom: 1px solid var(--line);
}
.credits-list h2 {
margin-bottom: 5px;
color: var(--cream);
font-size: 1.35rem;
text-transform: uppercase;
}
.credits-list p,
.credits-note {
margin: 0;
color: var(--muted);
font-size: 0.84rem;
}
.credits-note {
margin-top: 28px;
}
.page-hero-inner {
display: grid;
grid-template-columns: 1fr minmax(340px, 0.55fr);
@@ -1958,8 +2079,8 @@ textarea:focus {
padding-top: 68px;
color: #b6c0c6;
background:
linear-gradient(90deg, rgba(5, 12, 18, 0.99), rgba(5, 12, 18, 0.94)),
url("images/fat-bottom-grille-logo.jpg") right -80px center / 520px no-repeat,
linear-gradient(90deg, rgba(5, 12, 18, 0.99), rgba(5, 12, 18, 0.86)),
url("images/lakeside-sunset.jpg") center 62% / cover no-repeat,
#050c12;
}
@@ -2047,14 +2168,14 @@ textarea:focus {
.store-body .story-section {
background:
linear-gradient(90deg, rgba(8, 18, 28, 0.99), rgba(8, 18, 28, 0.92)),
url("images/sausage-kale-soup.jpg") right center / 46% auto no-repeat;
radial-gradient(circle at 86% 20%, rgba(114, 92, 255, 0.12), transparent 30%),
#08121c;
}
.store-body .category-band {
background:
linear-gradient(90deg, rgba(5, 12, 18, 0.98), rgba(5, 12, 18, 0.86)),
url("images/curry-rice.jpg") center 56% / cover no-repeat;
url("images/patio-dining.jpg") center 48% / cover no-repeat;
}
.store-body .menu-category-heading {
@@ -2116,20 +2237,20 @@ textarea:focus {
.store-body .order-summary {
background:
linear-gradient(145deg, rgba(8, 18, 28, 0.98), rgba(8, 18, 28, 0.88)),
url("images/quesadilla.jpg") center / cover no-repeat;
url("images/lakeside-burger.jpg") center / cover no-repeat;
border: 1px solid rgba(200, 151, 59, 0.22);
}
.store-body .auth-section {
background:
linear-gradient(90deg, rgba(5, 12, 18, 0.97), rgba(8, 18, 28, 0.87)),
url("images/grilled-chicken-salad.jpg") center / cover no-repeat;
url("images/garden-dining.jpg") center / cover no-repeat;
}
.store-body .confirmation-section {
background:
linear-gradient(rgba(5, 12, 18, 0.94), rgba(5, 12, 18, 0.97)),
url("images/sausage-kale-soup.jpg") center / cover no-repeat;
url("images/lakeside-sunset.jpg") center / cover no-repeat;
}
.store-body .status-pill {
@@ -3319,6 +3440,10 @@ code {
gap: 40px;
}
.experience-card-wide {
min-height: 390px;
}
.story-art {
min-height: 320px;
}
@@ -3464,6 +3589,7 @@ code {
}
.menu-grid,
.experience-grid,
.category-links,
.footer-grid,
.form-grid,
@@ -3474,6 +3600,18 @@ code {
grid-template-columns: 1fr;
}
.experience-card,
.experience-card-wide {
min-height: 280px;
grid-column: auto;
}
.credits-list article {
align-items: flex-start;
flex-direction: column;
gap: 8px;
}
.category-links a {
min-height: 85px;
}