This commit is contained in:
Flatlogic Bot 2025-11-30 19:54:49 +00:00
parent ecddcf9d88
commit 6e3c890a6f
3 changed files with 44 additions and 39 deletions

View File

@ -1,24 +1,11 @@
/* Christmas Decorations: Fixed Positioning */
/* General Body Styles */ /* General Body Styles */
body { body {
background-color: #142E35; /* Dark green background */ background-color: #142E35; /* Dark green background */
color: #ffffff; /* White text */ color: #ffffff; /* White text */
font-family: 'Poppins', sans-serif; font-family: 'Poppins', sans-serif;
padding-top: 50px;
} }
/* Headings */
h1, h2, h3, h4, h5, h6 {
color: #ffffff !important; /* Use !important to override other styles if necessary */
}
/* Buttons and Inputs */
input,
button,
.btn {
border-radius: 8px;
}
/* Garland */ /* Garland */
body::before { body::before {
content: ''; content: '';
@ -46,6 +33,42 @@ body::before {
} }
} }
#christmas-decorations-right {
position: fixed;
top: 0px;
right: 250px;
width: 220px;
z-index: 1033;
}
#christmas-decorations-right img {
width: 100%;
}
#christmas-decorations-left {
position: fixed;
top: 0px;
left: 250px;
width: 220px;
z-index: 1033;
transform: scaleX(-1);
}
#christmas-decorations-left img {
width: 100%;
}
/* Headings */
h1, h2, h3, h4, h5, h6 {
color: #ffffff !important; /* Use !important to override other styles if necessary */
}
/* Buttons and Inputs */
input,
button,
.btn {
border-radius: 8px;
}
/* Navbar */ /* Navbar */
.navbar { .navbar {
@ -387,18 +410,6 @@ animation: fall linear infinite;
padding: .25rem .5rem; padding: .25rem .5rem;
} }
#christmas-decorations-right {
position: fixed;
top: 0px;
right: 250px;
width: 220px;
z-index: 1033;
}
#christmas-decorations-right img {
width: 100%;
}
/* Recipe Card Image */ /* Recipe Card Image */
.card .card-img-top { .card .card-img-top {
height: 200px; height: 200px;
@ -428,8 +439,3 @@ animation: fall linear infinite;
transform: translateY(0); transform: translateY(0);
} }
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

View File

@ -7,7 +7,7 @@
<!-- SEO & Meta Tags --> <!-- SEO & Meta Tags -->
<title>Christmas Recipe Calculator</title> <title>Christmas Recipe Calculator</title>
<meta name="description" content="Create and calculate holiday recipe shopping lists. Enter a recipe for one, specify your number of guests, and get a shopping list for your Christmas feast. Built with Flatlogic Generator."> <meta name="description" content="Create and calculate holiday recipe shopping lists. Enter a recipe for one, specify your number of guests, and get a shopping list for your Christmas feast. Built with Flatlogic Generator.">
<meta name="keywords" content="recipe calculator, Christmas recipes, holiday cooking, shopping list generator, party food calculator, festive meals, cooking for a crowd, recipe scaler, Built with Flatlogic Generator"> <meta name="keywords" content="recipe calculator, Christmas recipes, holiday cooking, shopping list generator, party food calculator, festive meals, cooking for a crowd, recipe scaler, Built with Flatlogic Generator.">
<!-- Open Graph / Facebook --> <!-- Open Graph / Facebook -->
<meta property="og:type" content="website"> <meta property="og:type" content="website">
@ -32,18 +32,17 @@
</head> </head>
<body> <body>
<div id="christmas-decorations-left">
<img src="assets/pasted-20251130-194432-3a0cbe61.png" alt="Christmas Decorations" />
</div>
<div id="christmas-decorations-right"> <div id="christmas-decorations-right">
<img src="assets/pasted-20251130-191602-0ffc27f4.png" alt="Christmas Decorations" /> <img src="assets/pasted-20251130-191602-0ffc27f4.png" alt="Christmas Decorations" />
</div> </div>
<div id="snow-container"></div> <div id="snow-container"></div>
<main class="container my-5"> <main class="container my-5">
<div class="text-center mb-5"> <div class="text-center mb-5" style="padding-top: 50px;">
<h1 class="display-4 mt-4">Hey, it's Christmas time!</h1> <h1 class="display-4 mt-4">Hey, it's Christmas time!</h1>
<p class="lead">Let's get your holiday recipes sorted.</p> <p class="lead">Let's get your holiday recipes sorted.</p>
</div> </div>