Skip to content

Commit cb92fa7

Browse files
committed
Change Appearance
1 parent acd8588 commit cb92fa7

File tree

10 files changed

+2366
-127
lines changed

10 files changed

+2366
-127
lines changed

css/style.css

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
:root {
2-
--primary: #b6895b;
3-
--bg: #010101;
2+
--primary: #950101;
3+
--bg: #000000;
44
}
55

66
* {
@@ -27,9 +27,9 @@ body {
2727
display: flex;
2828
justify-content: space-between;
2929
align-items: center;
30-
padding: 1.4rem 7%;
30+
padding: 1rem 7%;
3131
background-color: rgba(1, 1, 1, 0.8);
32-
border-bottom: 1px solid #513c28;
32+
border-bottom: 1px solid var(--primary);
3333
position: fixed;
3434
top: 0;
3535
left: 0;
@@ -253,7 +253,7 @@ body {
253253
min-height: 100vh;
254254
display: flex;
255255
align-items: center;
256-
background-image: url("../img/header-bg.jpeg");
256+
background-image: url("../img/header.jpeg");
257257
background-repeat: no-repeat;
258258
background-size: cover;
259259
background-position: center;
@@ -289,6 +289,7 @@ body {
289289
color: #fff;
290290
text-shadow: 1px 1px 3px rgba(1, 1, 3, 0.5);
291291
line-height: 1.2;
292+
margin-top: 4rem;
292293
}
293294

294295
.hero .content h1 span {
@@ -346,18 +347,20 @@ body {
346347
}
347348

348349
.about .row .about-img {
349-
flex: 1 1 45rem;
350+
flex: 1 100 25rem;
350351
}
351352

352353
.about .row .about-img img {
353-
width: 100%;
354-
mask-image: url("../img//menu/splash.svg");
354+
width: 80%;
355+
mask-image: url("../img/endless.svg");
355356
mask-size: contain;
356357
mask-position: center;
357358
mask-repeat: no-repeat;
358359
}
359360

360361
.about .row .content {
362+
margin-top: 12rem;
363+
margin-left: 5rem;
361364
flex: 1 1 35rem;
362365
padding: 0 1rem;
363366
}
@@ -426,9 +429,9 @@ body {
426429

427430
.products .product-card {
428431
text-align: center;
429-
border: 1px solid #666;
432+
border: 1px solid var(--primary);
430433
padding: 2rem;
431-
border-radius: 0.5rem;
434+
border-radius: 5rem;
432435
}
433436

434437
.products .product-icons {
@@ -465,11 +468,11 @@ body {
465468
}
466469

467470
.products .product-content h3 {
468-
font-size: 2rem;
471+
font-size: 1.7rem;
469472
}
470473

471474
.products .product-stars {
472-
font-size: 1.7rem;
475+
font-size: 1.3rem;
473476
padding: 0.5rem;
474477
color: var(--primary);
475478
}
@@ -479,7 +482,7 @@ body {
479482
}
480483

481484
.products .product-price {
482-
font-size: 1.2rem;
485+
font-size: 1rem;
483486
font-weight: 700;
484487
}
485488

img/112034.jpg

32 KB
Loading

img/endless.svg

Lines changed: 25 additions & 0 deletions
Loading

img/favicon.svg

Lines changed: 2301 additions & 0 deletions
Loading

img/favicon.webp

38.2 KB
Binary file not shown.

img/header-bg.jpeg

-1.76 MB
Binary file not shown.

img/header.jpeg

754 KB
Loading

img/menu/splash.svg

Lines changed: 0 additions & 75 deletions
This file was deleted.

img/tentang-kami.jpeg

-3.74 MB
Binary file not shown.

index.html renamed to index.php

Lines changed: 24 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<title>Kopi Kenangan Senja</title>
6+
<title>Guan</title>
7+
<link rel="icon" href="img/favicon.svg" />
78
89
<!-- Fonts -->
910
<link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -38,14 +39,14 @@
3839
<body>
3940
<!-- Navbar Start -->
4041
<nav class="navbar" x-data>
41-
<a href="#" class="navbar-logo">kenangan<span>senja</span></a>
42+
<a href="#" class="navbar-logo">Website <span>Guan</span></a>
4243
4344
<div class="navbar-nav">
4445
<a href="#home">Home</a>
45-
<a href="#about">Tentang Kami</a>
46-
<a href="#menu">Menu</a>
47-
<a href="#products">Produk</a>
48-
<a href="#contact">Kontak</a>
46+
<a href="#about">About Us</a>
47+
<!-- <a href="#menu">Social Media</a> -->
48+
<a href="#products">Menu</a>
49+
<a href="#contact">Contact</a>
4950
</div>
5051
5152
<div class="navbar-extra">
@@ -151,47 +152,37 @@ <h5>Customer Detail</h5>
151152
<!-- Hero Section Start -->
152153
<section class="hero" id="home">
153154
<main class="content">
154-
<h1>Mari Nikmati Secangkir <span>Kopi</span></h1>
155+
<h1>Simple Payment Gateway <span>Website</span></h1>
155156
<p>
156-
Kopi Kenangan Senja adalah kopi yang terbuat dari biji kopi pilihan
157-
dan diolah dengan teknologi terbaru untuk memberikan pengalaman kopi
158-
yang lezat dan berkualitas tinggi.
157+
"Life is pleasant. Death is peaceful."
159158
</p>
160159
</main>
161160
</section>
162161
<!-- Hero Section End -->
163162
164163
<!-- About Section Start -->
165164
<section id="about" class="about">
166-
<h2><span>Tentang</span> Kami</h2>
165+
<h2><span>About</span> Us</h2>
167166
168167
<div class="row">
169168
<div class="about-img">
170-
<img src="img/tentang-kami.jpeg" alt="" />
169+
<img src="img/112034.jpg" alt="" />
171170
</div>
172171
<div class="content">
173-
<h3>Kenapa Memilih Kopi Kenangan Senja?</h3>
172+
<h3>Whoami?</h3>
174173
<p>
175-
Kopi Kenangan Senja adalah kopi yang terbuat dari biji kopi pilihan
176-
dan diolah dengan teknologi terbaru untuk memberikan pengalaman kopi
177-
yang lezat dan berkualitas tinggi. Dengan biji kopi berkualitas
178-
tinggi dan proses pengolahan yang terbaik, Kopi Kenangan Senja
179-
memberikan pengalaman kopi yang unik dan memanjakan lidah Anda.
174+
whoami is a simple command commonly used in Unix-like operating systems (such as Linux, macOS, and various Unix-like systems) to display the current active user's name. In simpler terms, this command answers the question "Who am I?" within the context of the operating system.
180175
</p>
181176
</div>
182177
</div>
183178
</section>
184179
<!-- About Section End -->
185180
186181
<!-- Menu Section Start -->
187-
<section id="menu" class="menu">
188-
<h2><span>Menu</span> Kami</h2>
182+
<!-- <section id="menu" class="menu">
183+
<h2><span>Social</span> Media</h2>
189184
<p>
190-
Kopi Kenangan Senja adalah kopi yang terbuat dari biji kopi pilihan dan
191-
diolah dengan teknologi terbaru untuk memberikan pengalaman kopi yang
192-
lezat dan berkualitas tinggi. Dengan biji kopi berkualitas tinggi dan
193-
proses pengolahan yang terbaik, Kopi Kenangan Senja memberikan
194-
pengalaman kopi yang unik dan memanjakan lidah Anda.
185+
My Social Media.
195186
</p>
196187
197188
<div class="row">
@@ -226,18 +217,14 @@ <h3 class="menu-card-title">Latte</h3>
226217
<p class="menu-card-price">IDR 12.000</p>
227218
</div>
228219
</div>
229-
</section>
220+
</section> -->
230221
<!-- Menu Section End -->
231222
232223
<!-- Products Section Start -->
233224
<section id="products" class="products" x-data="products">
234-
<h2><span>Produk Unggulan</span> Kami</h2>
225+
<h2><span>Our</span> Menu</h2>
235226
<p>
236-
Kopi Kenangan Senja adalah kopi yang terbuat dari biji kopi pilihan dan
237-
diolah dengan teknologi terbaru untuk memberikan pengalaman kopi yang
238-
lezat dan berkualitas tinggi. Dengan biji kopi berkualitas tinggi dan
239-
proses pengolahan yang terbaik, Kopi Kenangan Senja memberikan
240-
pengalaman kopi yang unik dan memanjakan lidah Anda.
227+
Menu Section.
241228
</p>
242229
243230
<div class="row">
@@ -345,11 +332,9 @@ <h3 x-text="item.name"></h3>
345332
346333
<!-- Contact Section Start -->
347334
<section id="contact" class="contact">
348-
<h2><span>Kontak</span> Kami</h2>
335+
<h2><span>Our</span> Contact</h2>
349336
<p>
350-
Jika Anda memiliki pertanyaan atau ingin berdiskusi tentang Kopi
351-
Kenangan Senja, jangan ragu untuk menghubungi kami melalui kontak di
352-
bawah ini.
337+
Ask if you curios about us.
353338
</p>
354339
355340
<div class="row">
@@ -383,9 +368,9 @@ <h2><span>Kontak</span> Kami</h2>
383368
<!-- Footer Start -->
384369
<footer>
385370
<div class="socials">
386-
<a href="#"><i data-feather="instagram"></i></a>
387-
<a href="#"><i data-feather="twitter"></i></a>
388-
<a href="#"><i data-feather="facebook"></i></a>
371+
<a href="https://github.com/guanshiyin28" target="_blank"><i data-feather="github"></i></a>
372+
<a href="https://www.instagram.com/guanshiyin_/"><i data-feather="instagram" target="_blank"></i></a>
373+
<a href="https://x.com/guanss_"><i data-feather="twitter" target="_blank"></i></a>
389374
</div>
390375
391376
<div class="links">

0 commit comments

Comments
 (0)