diff --git a/PngItem_5386456.png b/PngItem_5386456.png new file mode 100644 index 0000000..5d97061 Binary files /dev/null and b/PngItem_5386456.png differ diff --git a/app.css b/app.css new file mode 100644 index 0000000..356abc8 --- /dev/null +++ b/app.css @@ -0,0 +1,130 @@ +body { + font-family: 'Oswald', sans-serif; + background-color: #ECF1F3; +} + +#mainNavbar { + font-weight: 600; + font-size: 1.5rem; + transition: background 500ms; +} + +#mainNavbar .navbar-brand { + color: white; + font-size: 2rem; + cursor: pointer; +} + +#mainNavbar .navbar-brand:hover { + color: #00425c; +} + +#mainNavbar .nav-link { + color: white; +} + +#mainNavbar .nav-link:hover { + color: #00425c; +} + +#homeBackground { + position: relative; +} + +.homeAction { + position: absolute; + top: 21%; + width: 100%; +} + +#home { + min-width: 100%; + height: 100vh; + background: no-repeat center/cover url(milk_background3.jpg); +} + +#gotMilk { + height: 7.5rem; + padding-left: 20px; +} + +.homeAction button { + background-color: #e57da2; + border: 0; + color: white; + font-weight: 600; + font-size: 1.5rem; + padding: 4px 24px 8px; + transition: background-color 100ms, color 100ms; + cursor: pointer; +} + +.homeAction button:hover { + background-color: white; + color: #e57da2; +} + +#infoBackground { + background-color: #ECF1F3; +} + +#info h2 { + font-weight: 600; + font-size: 4rem; +} + +#info p { + font-size: 1.5rem; + padding-top: 20px; +} + +.navbar.scrolled { + background: #0388ba; +} + +@media (max-width: 991px) { + #info h2 { + font-size: 2.5rem; + } + + #info p { + font-size: 1rem; + } + + /* #home { + background: no-repeat top/contain url(milk_background.jpeg); + } */ +} + +@media (max-width: 575px) { + #mainNavbar { + background-color: #0388ba; + } + + #info img { + height: 25rem; + margin-bottom: 48px; + } + + #info h2 { + font-size: 2rem; + } + + #info .textInfo { + padding-right: 48px; + text-align: center; + font-size: 1rem; + } +} + +@media (max-height: 600px) { + .homeAction { + top: 14%; + } +} + +@media (min-aspect-ratio: 2560/1080) { + .homeAction { + top: 8%; + } +} \ No newline at end of file diff --git a/chocolate.png b/chocolate.png new file mode 100644 index 0000000..5de8b19 Binary files /dev/null and b/chocolate.png differ diff --git a/got_milk.png b/got_milk.png new file mode 100644 index 0000000..8cd36b9 Binary files /dev/null and b/got_milk.png differ diff --git a/icons8-kawaii-milk-color-glass-32.png b/icons8-kawaii-milk-color-glass-32.png new file mode 100644 index 0000000..31e7979 Binary files /dev/null and b/icons8-kawaii-milk-color-glass-32.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..408cc1d --- /dev/null +++ b/index.html @@ -0,0 +1,115 @@ + + + + + + + + + + + + + + + + + MILK + + + + + + + +
+
+
+ +
+ +
+ +
+
+
+
+
+ +
+
+
+
+ +
+
+

CHOCOLATE MILK

+

For flat-out, over-the-top chocolate taste that explodes out of the bottle, you gotta go Intense! + Intense Chocolate Milk is loaded with imported cocoas, real sugar and fresh milk to create a + chocolate milk like you've never had before.

+
+
+
+
+ +
+
+

VANILLA MILK

+

For a rich vanilla adventure, you gotta go Intense! Intense Vanilla Milk is loaded with the + finest + vanilla flavor, real sugar and fresh milk to create a taste that rivals the greatest milkshake + you've ever had.

+
+
+
+
+ +
+
+

STRAWBERRY MILK

+

For a creamy, sweet strawberry taste that's bold AND delicious, you gotta go Intense! Intense + Strawberry Milk is bursting out of the bottle with fresh milk and ruch, natural strawberry + essence that will have you tilting the bottle for that last drop.

+
+
+
+
+ + + + + + + + + + + + \ No newline at end of file diff --git a/milk_background.jpeg b/milk_background.jpeg new file mode 100644 index 0000000..2423d9d Binary files /dev/null and b/milk_background.jpeg differ diff --git a/milk_background2.jpg b/milk_background2.jpg new file mode 100644 index 0000000..27e56e0 Binary files /dev/null and b/milk_background2.jpg differ diff --git a/milk_background3.jpg b/milk_background3.jpg new file mode 100644 index 0000000..eef9a59 Binary files /dev/null and b/milk_background3.jpg differ diff --git a/strawberry.png b/strawberry.png new file mode 100644 index 0000000..6c0b75e Binary files /dev/null and b/strawberry.png differ diff --git a/vanilla.png b/vanilla.png new file mode 100644 index 0000000..083356f Binary files /dev/null and b/vanilla.png differ