diff --git a/.eslintrc.js b/.eslintrc.js index 7e89a3c88..c49b7b241 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -5,7 +5,7 @@ module.exports = { extends: `react-app`, rules: { 'jsx-a11y/accessible-emoji': 'off', - 'no-unused-vars': ['error', { vars: 'all', args: 'after-used', ignoreRestSiblings: false }], + // 'no-unused-vars': ['error', { vars: 'all', args: 'after-used', ignoreRestSiblings: false }], 'import/no-unresolved': [2, { caseSensitive: false }], }, settings: { diff --git a/src/components/HelloSection/index.js b/src/components/HelloSection/index.js index 9cb859f7b..b65d816b3 100644 --- a/src/components/HelloSection/index.js +++ b/src/components/HelloSection/index.js @@ -64,7 +64,7 @@ function HelloSection({ isInvitation }) {

Seputar Covid-19

Berkaitan dengan kondisi pandemik saat ini, keberlangsungan acara kami mengacu pada pedoman - Kementerian Kesehatan, yaitu memeberlakukan pembatasan jarak dan pembatasan jumlah tamu undangan. + Kementerian Kesehatan, yaitu memberlakukan pembatasan jarak dan pembatasan jumlah tamu undangan.

Maka dari itu, dengan segala kerendahan hati, kami mohon maaf jika belum bisa mengundang saudara/i diff --git a/src/components/QRCard/index.js b/src/components/QRCard/index.js index aa7e7fd3f..2dd9c7454 100644 --- a/src/components/QRCard/index.js +++ b/src/components/QRCard/index.js @@ -9,8 +9,17 @@ function QRCard({ name, code, desc }) {

-

{name}

-

{`(${desc})`}

+ {name ? ( + <> +

{name}

+

{`(${desc})`}

+ + ) : ( + <> +

{code}

+

{`(${desc})`}

+ + )} ); diff --git a/src/components/QRCard/styles.js b/src/components/QRCard/styles.js index c1f6d69ed..a1957908e 100644 --- a/src/components/QRCard/styles.js +++ b/src/components/QRCard/styles.js @@ -26,4 +26,8 @@ export const styWrapper = css` font-size: 10px; margin: 0 0 8px 0; } + + .title__transaparent { + opacity: 0; + } `; diff --git a/src/components/StorySection/stories-data.js b/src/components/StorySection/stories-data.js index 7d8141f98..54ac25c0b 100644 --- a/src/components/StorySection/stories-data.js +++ b/src/components/StorySection/stories-data.js @@ -37,7 +37,7 @@ export const stories = [ title: 'Kembali ke Indonesia', date: '3 Maret 2019', description: - 'Periode belajar di Kroasia telah selesai. Akhirnya Dinda kembali ke Indonesia! Ada tanggung jawab yang harus Dinda selesaikan seusai dari Kroasia, yakni harus menyelesaikan skripsi dan mencapai target untuk wisuda di bulan Agustus 2019. Selain itu, kembalinya Dinda ke Indonesia menjadi momen yang tepat bagi Indra untuk menyampaikan niat ingin serius kepada orang tua Dinda. Hal itu disambut baik oleh kedua orang tuanya dan sepakat akan melaksanakan acara Ndodok Lawang usai Dinda wisuda. Sebelum wisuda, Dinda sudah harus meniti karir di Jakarta sebagai seorang Content Analyst di Ruangguru.', + 'Periode belajar di Kroasia telah selesai. Akhirnya Dinda kembali ke Indonesia! Ada tanggung jawab yang harus Dinda selesaikan seusai dari Kroasia, yakni harus menyelesaikan skripsi dan mencapai target untuk wisuda di bulan Agustus 2019. Selain itu, kembalinya Dinda ke Indonesia menjadi momen yang tepat bagi Indra untuk menyampaikan niat ingin serius kepada orang tua Dinda. Hal itu disambut baik oleh kedua orang tua mereka dan sepakat akan melaksanakan acara Ndodok Lawang usai Dinda wisuda. Sebelum wisuda, Dinda sudah harus meniti karir di Jakarta sebagai seorang Content Analyst di Ruangguru.', image: ImgKembaliKeIndonesia, }, { diff --git a/src/components/WishesSection/WishesContainer.js b/src/components/WishesSection/WishesContainer.js index 6ff37c7b4..1aa8b201c 100644 --- a/src/components/WishesSection/WishesContainer.js +++ b/src/components/WishesSection/WishesContainer.js @@ -2,16 +2,30 @@ import React, { useState, useEffect, useCallback } from 'react'; import WishesItem from './WishesItem'; import { wishlist } from './wishlist-data'; -import { styOwl } from './styles'; +import { styButtonWrapper } from './styles'; -const INTERVAL_SLIDE = 10000; +const INTERVAL_SLIDE = 35000; function WishesContainer() { const [active, setActive] = useState(0); const [pauseSlide, setPauseSlide] = useState(false); + const totalWishes = wishlist.length || 0; + + const handleSetActive = (isNext = true) => { + if (isNext) { + if (active === totalWishes - 1) { + setActive(0); + } else { + setActive(active + 1); + } + } else { + if (active === 0) { + setActive(totalWishes - 1); + } else { + setActive(active - 1); + } + } - const handleSetActive = (index) => { - setActive(index); setPauseSlide(true); setTimeout(() => { @@ -31,19 +45,7 @@ function WishesContainer() { return wishlist.map((w, index) => ); }; - const renderNavigation = () => { - return wishlist.map((w, index) => ( -
handleSetActive(index)} - /> - )); - }; - - /** - * Side effect to autoscroll - */ + /** Side effect to autoscroll */ useEffect(() => { const interval = setInterval(() => { if (!pauseSlide) { @@ -59,8 +61,9 @@ function WishesContainer() { return (
{renderWishlist()} -
-
{renderNavigation()}
+
+ +
); diff --git a/src/components/WishesSection/WishesItem.js b/src/components/WishesSection/WishesItem.js index 8a07ddd56..1dd06928c 100644 --- a/src/components/WishesSection/WishesItem.js +++ b/src/components/WishesSection/WishesItem.js @@ -10,7 +10,7 @@ function WishesItem({ image, name, infoName, description, isActive }) {
- user + user

{name}

{infoName} diff --git a/src/components/WishesSection/assets/girl.png b/src/components/WishesSection/assets/girl.png new file mode 100644 index 000000000..6bb6bd31b Binary files /dev/null and b/src/components/WishesSection/assets/girl.png differ diff --git a/src/components/WishesSection/assets/user.png b/src/components/WishesSection/assets/user.png new file mode 100644 index 000000000..bd8810d57 Binary files /dev/null and b/src/components/WishesSection/assets/user.png differ diff --git a/src/components/WishesSection/assets/w-alvia.jpg b/src/components/WishesSection/assets/w-alvia.jpg new file mode 100644 index 000000000..f33704fdc Binary files /dev/null and b/src/components/WishesSection/assets/w-alvia.jpg differ diff --git a/src/components/WishesSection/assets/w-emsho.jpg b/src/components/WishesSection/assets/w-emsho.jpg new file mode 100644 index 000000000..34a303fe8 Binary files /dev/null and b/src/components/WishesSection/assets/w-emsho.jpg differ diff --git a/src/components/WishesSection/assets/w-fitria.jpg b/src/components/WishesSection/assets/w-fitria.jpg new file mode 100644 index 000000000..e697bf052 Binary files /dev/null and b/src/components/WishesSection/assets/w-fitria.jpg differ diff --git a/src/components/WishesSection/assets/w-ghea.jpg b/src/components/WishesSection/assets/w-ghea.jpg new file mode 100644 index 000000000..e57522137 Binary files /dev/null and b/src/components/WishesSection/assets/w-ghea.jpg differ diff --git a/src/components/WishesSection/assets/w-kamal.jpg b/src/components/WishesSection/assets/w-kamal.jpg new file mode 100644 index 000000000..17335eeae Binary files /dev/null and b/src/components/WishesSection/assets/w-kamal.jpg differ diff --git a/src/components/WishesSection/assets/w-puspita.jpg b/src/components/WishesSection/assets/w-puspita.jpg new file mode 100644 index 000000000..5b43657d3 Binary files /dev/null and b/src/components/WishesSection/assets/w-puspita.jpg differ diff --git a/src/components/WishesSection/assets/w-yunias.jpg b/src/components/WishesSection/assets/w-yunias.jpg new file mode 100644 index 000000000..de7a72dd1 Binary files /dev/null and b/src/components/WishesSection/assets/w-yunias.jpg differ diff --git a/src/components/WishesSection/assets/w-yunita.jpg b/src/components/WishesSection/assets/w-yunita.jpg new file mode 100644 index 000000000..dfaa80cde Binary files /dev/null and b/src/components/WishesSection/assets/w-yunita.jpg differ diff --git a/src/components/WishesSection/styles.js b/src/components/WishesSection/styles.js index b25d5eef9..be646ca0f 100644 --- a/src/components/WishesSection/styles.js +++ b/src/components/WishesSection/styles.js @@ -1,29 +1,5 @@ import { css, keyframes } from '@emotion/core'; -export const styOwl = css` - margin-top: 10px; - text-align: center; - - .owl-dots { - display: flex; - justify-content: center; - - .owl-dot { - width: 10px; - height: 10px; - margin: 0 4px; - border-radius: 50%; - background: #e6e6e6; - cursor: pointer; - } - - .active { - background: transparent; - border: 2px solid #f14e95; - } - } -`; - const animation = keyframes` 0% { right: -300px; opacity: 0;} 50% { right: 50px; opacity: 0.5;} @@ -38,7 +14,7 @@ const animationLeft = keyframes` export const styWithAnimation = (isActive) => css` position: relative; - animation: ${isActive ? animation : animationLeft} 1.2s; + animation: ${isActive ? animation : animationLeft} 1s; `; export const styWrapperItem = css` @@ -49,6 +25,10 @@ export const styWrapperItem = css` margin: 0 0 4px 0; } + blockquote { + margin-top: 16px !important; + } + .infoName { font-size: 12px; text-transform: capitalize; @@ -64,9 +44,23 @@ export const styWrapperItem = css` diplay: block; } + .description { + font-size: 16px !important; + } + @media screen and (max-width: 400px) { .description { - font-size: 16px !important; + font-size: 14px !important; } } `; + +export const styButtonWrapper = css` + display: flex; + justify-content: center; + + .button-nav { + font-size: 14px; + padding: 5px 20px; + } +`; diff --git a/src/components/WishesSection/wishlist-data.js b/src/components/WishesSection/wishlist-data.js index 6ef9a339a..ce7becd26 100644 --- a/src/components/WishesSection/wishlist-data.js +++ b/src/components/WishesSection/wishlist-data.js @@ -1,4 +1,3 @@ -import Image from '@assets/images/couple-2.jpg'; import Nita from '@assets/images/w-nita.jpg'; import Zakiy from '@assets/images/w-zakiy.jpg'; import Moletta from '@assets/images/w-moletta.jpg'; @@ -7,14 +6,23 @@ import dianara from '@assets/images/w-dianara.jpg'; import rahma from '@assets/images/w-rahma.jpg'; import vela from '@assets/images/w-vela.jpg'; import iqmala from '@assets/images/w-iqmala.jpg'; +import man from './assets/user.png'; import ihsan from './assets/w-ihsan.jpg'; import fajar from './assets/w-fajar.jpg'; import risa from './assets/w-risa.jpg'; +import puspita from './assets/w-puspita.jpg'; +import kamal from './assets/w-kamal.jpg'; +import ghea from './assets/w-ghea.jpg'; +import emsho from './assets/w-emsho.jpg'; +import alvia from './assets/w-alvia.jpg'; +import yunias from './assets/w-yunias.jpg'; +import yunita from './assets/w-yunita.jpg'; +import fitria from './assets/w-fitria.jpg'; export const wishlist = [ { name: 'Nita Syarifah', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMP Dinda', description: `selamat menempuh hidup baru dinda dan mas indra semoga menjadi pasangan teman hidup selamanya sesurga, enjoy your little family always be happy my sweet couple!🥰🤗 amin`, image: Nita, }, @@ -32,7 +40,7 @@ export const wishlist = [ }, { name: 'Risalatul Muawanah', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMP Dinda', description: `"Hey Din! Finally ..... Happy Wedding! Hopefully become a family that Sakinah Mawaddah Warohmah until HIS heaven later! Become a blessed family and always be happy! May your dreams always be achieved! Always complement and support each other! I will wait for 5 children yea! Hihi 😅😅😘"`, @@ -40,7 +48,7 @@ export const wishlist = [ }, { name: 'Moleta Tiara Mahayanti', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMP Dinda', description: `"Happy Wedding untuk Dinda dan Mas Indra ❤ Semoga menjadi keluarga yang Sakinah Mawardah wa Rahmah Amin. Selamat menempuh hidup yang baru kalian berdua. @@ -53,24 +61,24 @@ export const wishlist = [ }, { name: 'Hapsari Anggraini', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMP Dinda', description: `"Selamat menempuh hidup baru Dinda dan mas Indra, semoga menjadi keluarga yg sakinah, mawaddah, warrahmah, yg bahagia, dan menjadi pasangan yg selalu ada dalam keadaan suka maupun duka aamiin. semoga kita cepet dapet ponakan ya, Dinn😂💙"`, image: hapsari, }, { - name: 'Herza', + name: 'Herza I.M', infoName: 'Rekan Kerja Indra, Tokopedia', description: `"Untuk Indra dan Dinda, semoga lancar ya acara pernikahannya dan senantiasa aman dan kondusif meski keadaan seperti ini. Salut dengan ketetapan untuk mengukuhkan ikatan meski sdg banyak rintangan. Pokoknya saya doain yg terbaik untuk kalian berdua, mulai dari hari h acara sampai seterusnya. Semoga jadi keluarga yg sakinah, mawadah, warahmah ya. Amiin. Selamat berbahagia, Indra & Dinda!"`, - image: Image, + image: man, }, { name: 'Dhyanara NP', - infoName: 'Sahabat Dinda', + infoName: 'Rekan Kerja Dinda, NET TV', description: `Semoga pernikahan ini membawa Dinda dan Indra dalam ketentraman (sakinah), cinta (mawaddah) dan welas asih (rohmah). Jika saja semakin tumbuhnya cinta itu tak muat masuk ke rongga dada, semoga Allah berikan kelapangan rasa. Semoga Allah mudahkan segala tujuan awal saat kalian berdua memutuskan bersama:)`, image: dianara, }, @@ -82,25 +90,25 @@ export const wishlist = [ }, { name: 'Pramudina Rahmawati', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMA Dinda', description: `Happy Wedding Dinda & Mas indra. Semoga menjadi pasangan yang samawa, dilimpahkan selalu rezeki dan kebahagiaan, dan langgeng sampai akhir hayat yah! 🖤`, image: rahma, }, { name: 'Kamal', - infoName: 'Sahabat Dinda di Ruangguru', + infoName: 'Rekan Kerja Dinda, Ruangguru', description: `Congrats Dinda & Mas Indra for your marriage. You are a perfect pair. You are an inspiration to me. And have a blissful conjugal life!`, - image: Image, + image: kamal, }, { name: 'Vela Hafira', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMA Dinda', description: `Happy Wedding Dinda & Mas Indra. Selamat menempuh perjalanan hidup yang baru. Semoga bertambahlah ketaatan kalian kepada Allah hingga surga menjadi dekat. Dan dilimpahkan rezeki, petunjuk, keberkahan, dan kebahagiaan lahir batin. Barakallahu laka 💟💟💟`, image: vela, }, { name: 'Iqmalifa Dwi Nursandhi', - infoName: 'Sahabat Dinda', + infoName: 'Sahabat SMA Dinda', description: `"Im very happy for you dinda & mas indra.. Sahabatku dinda.. ini adalah awal perjalanan cinta kalian yang sesungguhnya, membangun cinta dalam satu atap berdua mengarungi samudra kehidupan. Semoga dinda & mas indra menjadi keluarga yang Sakinnah, Mawaddah, & Warahmah. Semoga perjalanan kalian akan tetap indah kala bersama-sama membangun kehidupan yang baru, kehidupan yang mengikatkan janji suci berjanji sehidup semati. May your love continue to grow each and every year. Best wishes on your wedding, happily ever after!❤️"`, @@ -108,16 +116,54 @@ export const wishlist = [ }, { name: 'Abdul Ghofar', - infoName: 'Sahabat Indra', + infoName: 'Sahabat Kuliah Indra', description: `Selamat menempuh hidup baru indra n dinda semoga menjadi keluarga sakinah mawaddah warrahmah `, - image: Image, + image: man, }, { name: 'Puspita Dewi', - infoName: 'Sahabat Dinda', + infoName: 'Rekan Kerja Dinda, Ruangguru', description: `"Dear Dinda & Indra, Barakallahu lakuma wa jama’a baina kuma fii khair. Semoga pernikahan kalian bisa menjadi ladang ibadah dan pahala, dan menjadi pasangan sehidup sesurga. Sakinah, mawaddah wa rahmah selalu. Amiin"`, - image: Image, + image: puspita, + }, + // NEW + { + name: 'Ghea Maurizka', + infoName: 'Sahabat Kuliah Dinda', + description: `Selamat menempuh satu langkah jenjang kehidupan yg baru❤️ semoga dilimpahkan kebahagiaan & keberkahan, serta menjadi keluarga yg sakinah, mawaddah, warahmah ❤️`, + image: ghea, + }, + { + name: 'Emsho', + infoName: 'Rekan Kerja Dinda, NET TV', + description: `Indra. Sebuwah nama yang sayup sering tak denger saat ciwi ciwi ex net jateng pada rerumpian godain Dinda, kalo pas break syuting Hikayat Insani, medio 2018 lalu. Ada yang cengin, dia nya tersipu malu.. Eh, alhamdulillaah cinta mereka akhirnya berlabuh hingga ke tahap ini. Selamat buat Dinda & Indra. Bahagia selamanya yaa.. `, + image: emsho, + }, + { + name: 'Alvia Tri', + infoName: 'Sahabat Kuliah Dinda', + description: `Wedding wishes for my dear friends. I hope your life together will be filled with joy, happiness and lots of love`, + image: alvia, + }, + { + name: 'Yunias Belda', + infoName: 'Sahabat Kuliah Dinda', + description: `"Selamat Berbahagiaaa Dindaaa dan Mas Indraaa ❤️❤️❤️ + Semoga samawaaa yaaa, cepet dpt momongan, jd keluarga kecil yanb bahagia 😘😘😘 luvluvvv"`, + image: yunias, + }, + { + name: 'Linda Yunitasari', + infoName: 'Sahabat Kuliah Dinda', + description: `Selamat buat Dinda dan Mas Indra. lancar2 buat acaranyaa.. semoga kelak dijadikan keluarga yg sakinah, mawadah, warahmah.. segera diberikan dedek yg gumush dan pintar biar jadi mahmud❤️ Langgeng terus sampai kakek nenek ya dinds!❤️`, + image: yunita, + }, + { + name: 'Fitria Ayunisa', + infoName: 'Sahabat Kuliah Dinda', + description: `Selamat menempuh hidup baru buat Dinda dan Mas Indra!❤️ Semoga samawa yaaa dan cepet dapet momongan :p amin! see you😘🌷`, + image: fitria, }, ]; diff --git a/src/pages/generate-qr.js b/src/pages/generate-qr.js index 1bc9503f9..58d2e0973 100644 --- a/src/pages/generate-qr.js +++ b/src/pages/generate-qr.js @@ -8,10 +8,12 @@ import { styWrapper } from '@components/QRCard/styles'; function GenerateQRPage() { const { data, loading } = useGuestData(); + const finalData = data.filter((guest, index) => index >= 177); + const renderContent = () => { if (loading) return
Menyiapkan data..
; - return data.map((guest) => { + return finalData.map((guest) => { return ; }); };