From 6c7a8c9c758a8cf2e56ae8222325b0bbddddb152 Mon Sep 17 00:00:00 2001 From: 0rcaaa Date: Fri, 7 Jun 2024 16:23:32 +0700 Subject: [PATCH 1/7] Mengubah cara penampilan dari section manga --- Js/alpine-bundle.min.js | 23 ++++++++ index.html | 120 ++++------------------------------------ 2 files changed, 34 insertions(+), 109 deletions(-) create mode 100644 Js/alpine-bundle.min.js diff --git a/Js/alpine-bundle.min.js b/Js/alpine-bundle.min.js new file mode 100644 index 0000000..e3b5576 --- /dev/null +++ b/Js/alpine-bundle.min.js @@ -0,0 +1,23 @@ +document.addEventListener('alpine:init', () => { + Alpine.data('manga', () => ({ + items:[ + {id:1, judul:'lorem2', sampul:'manga1.jpg', harga: 90000}, + {id:2, judul:'lorem2', sampul:'manga2.jpg', harga: 90000}, + {id:3, judul:'lorem2', sampul:'manga3.jpg', harga: 90000}, + {id:4, judul:'lorem2', sampul:'manga4.jpg', harga: 90000}, + {id:5, judul:'lorem2', sampul:'manga5.jpg', harga: 90000}, + {id:6, judul:'lorem2', sampul:'manga6.jpg', harga: 90000}, + {id:7, judul:'lorem2', sampul:'manga7.jpg', harga: 90000}, + {id:8, judul:'lorem2', sampul:'manga8.jpg', harga: 90000}, + ] + })); +}); + +const duit = (number) => { + return new Intl.NumberFormat('id-ID', { + style : 'currency', + currency : 'IDR', + minimumFractionDigits:0, + }).format(number); +}; + \ No newline at end of file diff --git a/index.html b/index.html index ac857dd..00cbf7f 100644 --- a/index.html +++ b/index.html @@ -480,127 +480,25 @@

IDR 999.999,00

-
+

Manga

+
@@ -665,7 +563,7 @@

Interact with Eden

Ayo cintai hobimu bareng Eden! - © 2023 Andika Syarrell Irawan / PT. Jaya Makmur + © 2023 0rca / PT. Jaya Makmur
@@ -680,6 +578,10 @@

Interact with Eden

+ + > + + From 54af144b4c337419d81b40eac008485d8942a5f2 Mon Sep 17 00:00:00 2001 From: 0rcaaa Date: Fri, 7 Jun 2024 21:56:53 +0700 Subject: [PATCH 2/7] add showQuantity function at cart --- Js/alpine-bundle.min.js | 15 ++++++++++++++- css/style.css | 12 ++++++++++++ index.html | 11 +++++++---- 3 files changed, 33 insertions(+), 5 deletions(-) diff --git a/Js/alpine-bundle.min.js b/Js/alpine-bundle.min.js index e3b5576..8da82a9 100644 --- a/Js/alpine-bundle.min.js +++ b/Js/alpine-bundle.min.js @@ -11,9 +11,22 @@ document.addEventListener('alpine:init', () => { {id:8, judul:'lorem2', sampul:'manga8.jpg', harga: 90000}, ] })); + + Alpine.store('cart', { + items:[], + total: 0, + quantity: 0, + add(newItem) { + this.items.push(newItem); + this.quantity++; + this.total += newItem.harga; + console.log(this.total); + }, + }); + }); -const duit = (number) => { +const rupiah = (number) => { return new Intl.NumberFormat('id-ID', { style : 'currency', currency : 'IDR', diff --git a/css/style.css b/css/style.css index 9dc76c8..cc1db91 100644 --- a/css/style.css +++ b/css/style.css @@ -139,6 +139,18 @@ body{ color: #010101; } +.quantity-notify{ + color: var(--bg); + background-color:var(--primary); + padding: 0px 5px; + margin:0; + border-radius:5px; + display:inline-block; + margin-left:-1.5rem; + position:absolute; + font-size:0.9rem +} + .shopping-cart{ position: absolute; top: 100%; diff --git a/index.html b/index.html index 00cbf7f..4251f38 100644 --- a/index.html +++ b/index.html @@ -22,7 +22,7 @@ -
From badaa15bf5fd8e9fb5844c66742240d59e53f797 Mon Sep 17 00:00:00 2001 From: Rey-dono Date: Wed, 19 Jun 2024 12:44:41 +0700 Subject: [PATCH 7/7] mengubah style grid --- css/style.css | 5 ----- 1 file changed, 5 deletions(-) diff --git a/css/style.css b/css/style.css index 107a2e5..9157e42 100644 --- a/css/style.css +++ b/css/style.css @@ -591,7 +591,6 @@ body{ border: 1px solid #666; border-radius: 6px; padding: 2rem; - margin: auto; } .manga .row .card .judul a{ @@ -601,10 +600,6 @@ body{ opacity: 0.5; } -.manga .row .card .gambar{ - padding: 1rem 0; -} - .manga .row .card .gambar img{ height: 25rem; }