-
-
-
-
-
- {/*?php include 'pages/gen12.php' ?*/}
-
+ {judul}
{isi}
+ 
-
+
)
-}
-
-export default Card
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/partials/main/Cards.jsx b/src/partials/main/Cards.jsx
index ba565d3..341a0a5 100644
--- a/src/partials/main/Cards.jsx
+++ b/src/partials/main/Cards.jsx
@@ -1,6 +1,6 @@
import Card from "./Card.jsx";
-function Cards() {
+export default function Cards() {
return (
+
{judul}
{isi}
-
)
-}
-
-export default LearnBasics
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/partials/main/SBK.jsx b/src/partials/main/SBK.jsx
index 911bb2b..615aaa2 100644
--- a/src/partials/main/SBK.jsx
+++ b/src/partials/main/SBK.jsx
@@ -1,4 +1,4 @@
-function SBK() {
+export default function SBK() {
return (
-
learn basics
-+
+
@@ -17,6 +17,4 @@ function LearnBasics() {
learn basics
+Belajar dasar jaringan dengan materi yang praktis dan interaktif
@@ -13,6 +13,4 @@ function SBK() {
+
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/partials/member/Petinggi.jsx b/src/partials/member/Petinggi.jsx
index 9b55359..1b7b145 100644
--- a/src/partials/member/Petinggi.jsx
+++ b/src/partials/member/Petinggi.jsx
@@ -1,12 +1,14 @@
-function Petinggi({jabatan, nama, gambar, alt, marginTop}) {
+import style from '../../stylesheet/member.module.css'
+
+export default function Petinggi({jabatan, nama, gambar, alt, mt, my}) {
return (
-
+
-
+
)
-}
-
-export default Petinggi
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/partials/member/Struktur.jsx b/src/partials/member/Struktur.jsx
new file mode 100644
index 0000000..11de5d0
--- /dev/null
+++ b/src/partials/member/Struktur.jsx
@@ -0,0 +1,7 @@
+export default function Struktur({children}) {
+ return (
+
-
+
{jabatan}
@@ -14,6 +16,4 @@ function Petinggi({jabatan, nama, gambar, alt, marginTop}) {
+ {children}
+
+ )
+}
\ No newline at end of file
diff --git a/src/partials/member/struktur/Leader.jsx b/src/partials/member/struktur/Leader.jsx
new file mode 100644
index 0000000..25ca8dd
--- /dev/null
+++ b/src/partials/member/struktur/Leader.jsx
@@ -0,0 +1,15 @@
+import StrukturalCard from "./StrukturalCard.jsx";
+
+const leaderGrid = {
+ gridTemplateColumns: '.5fr .5fr',
+ gap: '2vw'
+}
+
+export default function Leader({members}) {
+ return (
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/partials/member/struktur/StrukturalCard.jsx b/src/partials/member/struktur/StrukturalCard.jsx
new file mode 100644
index 0000000..540a6df
--- /dev/null
+++ b/src/partials/member/struktur/StrukturalCard.jsx
@@ -0,0 +1,17 @@
+import style from "../../../stylesheet/member.module.css";
+
+export default function StrukturalCard({jabatan = '', members = []}) {
+ return (
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/stylesheet/index.css b/src/stylesheet/index.css
index a4e4333..21f4d56 100644
--- a/src/stylesheet/index.css
+++ b/src/stylesheet/index.css
@@ -37,10 +37,6 @@
& > h1 {
font-weight: 900;
}
-
- & > p {
- max-width: 32vw;
- }
}
.icon {
@@ -120,10 +116,6 @@
padding-bottom: 280px;
}
-.text > p {
- padding-right: 6vw;
-}
-
.grid-4 {
grid-template-areas: 'first' 'second';
column-gap: 3vw;
@@ -253,7 +245,11 @@
& .icon {
width: 120px;
- aspect-ratio: 4/3;
+ height: 96px;
+ }
+
+ .text {
+ height: 96px;
}
}
@@ -288,7 +284,7 @@
div {
& > span {
- transition: .3s;
+ transition: .4s;
}
&:hover > span {
@@ -300,10 +296,4 @@ div {
.translate-50 {
transform: translateY(20vw);
}
-}
-
-@media (min-width: 1280px) {
- .text > p {
- padding-right: 10vw;
- }
}
\ No newline at end of file
diff --git a/src/stylesheet/member.css b/src/stylesheet/member.css
deleted file mode 100644
index db6ec2e..0000000
--- a/src/stylesheet/member.css
+++ /dev/null
@@ -1,134 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Barlow&display=swap");
-* {
- padding: 0;
- margin: 0;
- font-family: "Barlow", sans-serif;
- box-sizing: border-box;
- scroll-behavior: smooth;
- -webkit-user-select: none;
- -moz-user-select: none;
- user-select: none;
-}
-
-h1,
-h2,
-a {
- text-transform: capitalize;
-}
-
-a {
- color: white;
- text-decoration: none;
- transition: 0.4s;
-}
-
-nav {
- background-color: black;
- height: 60px;
- position: sticky;
- top: 0;
- z-index: 3;
-}
-
-nav > a > img {
- left: 3%;
- transform: translateY(-50%) scale(0.8);
-}
-nav > a > i {
- right: 2%;
-}
-nav > div {
- width: -moz-fit-content;
- width: fit-content;
- -moz-column-gap: 2rem;
- column-gap: 2rem;
-}
-nav > div a {
- display: inline-block;
- position: relative;
-}
-nav > div a:after {
- content: "";
- position: absolute;
- width: 100%;
- transform: scaleX(0);
- height: 1px;
- bottom: 0;
- left: 0;
- background-color: white;
- transform-origin: bottom right;
- transition: transform 0.25s ease-out;
-}
-nav > div a:hover:after {
- transform: scaleX(1);
- transform-origin: bottom left;
-}
-
-footer {
- background-color: black;
- color: white;
-}
-
-footer > p {
- text-align: center;
- padding-top: 20px;
-}
-footer > hr {
- border: none;
- height: 0.08px;
- margin: 60px 20% 0 20%;
-}
-footer > p:last-child {
- padding-bottom: 20px;
- margin-bottom: 0;
-}
-
-.title {
- font-weight: bolder;
- color: #004669;
-}
-
-.ms-4:first-child {
- scale: 80%;
-}
-
-button {
- background-color: white;
- color: #004669;
- transition: 0.3s;
- padding: 0.7vw 2.5vw;
- border: 0;
- font-weight: bolder;
-}
-
-button:hover {
- background-color: rgba(0, 70, 105, 0.5137254902);
- color: white;
-}
-
-button.active {
- background-color: #004669;
- color: white;
-}
-
-button.active:hover {
- background-color: rgba(0, 70, 105, 0.5137254902);
- color: #004669;
-}
-
-.member-container {
- background-color: #004669;
-}
-
-.custom-container {
- max-width: 60%;
-}
-
-.custom-container > h1 {
- width: -moz-fit-content;
- width: fit-content;
-}
-
-p {
- text-transform: capitalize;
-}/*# sourceMappingURL=member.css.map */
\ No newline at end of file
diff --git a/src/stylesheet/member.css.map b/src/stylesheet/member.css.map
deleted file mode 100644
index 8ab38c1..0000000
--- a/src/stylesheet/member.css.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"sources":["_main.scss","member.css","member.scss"],"names":[],"mappings":"AAAQ,2EAAA;AAER;EACE,UAAA;EACA,SAAA;EACA,iCAAA;EACA,sBAAA;EACA,uBAAA;EACA,yBAAA;KAAA,sBAAA;UAAA,iBAAA;ACAF;;ADGA;;;EAGE,0BAAA;ACAF;;ADGA;EACE,YAAA;EACA,qBAAA;EACA,gBAAA;ACAF;;ADGA;EACE,uBAAA;EACA,YAAA;EACA,gBAAA;EACA,MAAA;EACA,UAAA;ACAF;;ADKI;EACE,QAAA;EACA,sCAAA;ACFN;ADKI;EACE,SAAA;ACHN;ADOE;EACE,uBAAA;EAAA,kBAAA;EACA,qBAAA;OAAA,gBAAA;ACLJ;ADSI;EACE,qBAAA;EACA,kBAAA;ACPN;ADUI;EACE,WAAA;EACA,kBAAA;EACA,WAAA;EACA,oBAAA;EACA,WAAA;EACA,SAAA;EACA,OAAA;EACA,uBAAA;EACA,8BAAA;EACA,oCAAA;ACRN;ADYI;EACE,oBAAA;EACA,6BAAA;ACVN;;ADeA;EACE,uBAAA;EACA,YAAA;ACZF;;ADgBE;EACE,kBAAA;EACA,iBAAA;ACbJ;ADgBE;EACE,YAAA;EACA,cAAA;EACA,sBAAA;ACdJ;ADiBE;EACE,oBAAA;EACA,gBAAA;ACfJ;;AC1EA;EACI,mBAAA;EACA,cALY;ADkFhB;;AC1EA;EACI,UAAA;AD6EJ;;AC1EA;EACI,uBAAA;EACA,cAdY;EAeZ,gBAAA;EACA,oBAAA;EACA,SAAA;EACA,mBAAA;AD6EJ;;AC1EA;EACI,gDArBkB;EAsBlB,YAAA;AD6EJ;;AC1EA;EACI,yBA3BY;EA4BZ,YAAA;AD6EJ;;AC1EA;EACI,gDA/BkB;EAgClB,cAjCY;AD8GhB;;AC1EA;EACI,yBArCY;ADkHhB;;AC1EA;EACI,cAAA;AD6EJ;;ACzEI;EACI,uBAAA;EAAA,kBAAA;AD4ER;;ACxEA;EACI,0BAAA;AD2EJ","file":"member.css"}
\ No newline at end of file
diff --git a/src/stylesheet/member.module.css b/src/stylesheet/member.module.css
new file mode 100644
index 0000000..80674e0
--- /dev/null
+++ b/src/stylesheet/member.module.css
@@ -0,0 +1,55 @@
+:root {
+ --primary-color: #004669;
+ --hover-color: rgba(0, 70, 105, 0.5137254902);
+}
+
+.title {
+ font-weight: bolder;
+ color: var(--primary-color);
+}
+
+/*.ms-4:first-child {*/
+/* scale: 80%;*/
+/*}*/
+
+.button {
+ background-color: white;
+ color: var(--primary-color);
+ transition: 0.3s;
+ padding: 0.7vw 2.5vw;
+ border: 0;
+ border-radius: 8px;
+ font-weight: bolder;
+
+ &:hover {
+ background-color: var(--hover-color);
+ color: white;
+ }
+}
+
+.active {
+ background-color: var(--primary-color);
+ color: white;
+
+ &:hover {
+ background-color: var(--hover-color);
+ color: var(--primary-color);
+ }
+}
+
+.member-container {
+ background-color: var(--primary-color);
+}
+
+.custom-container {
+ max-width: 60%;
+
+ & > h1 {
+ width: fit-content;
+ }
+}
+
+.card {
+ background-color: white;
+ border-radius: 8px;
+}
\ No newline at end of file
diff --git a/src/stylesheet/member.scss b/src/stylesheet/member.scss
deleted file mode 100644
index 0b238bf..0000000
--- a/src/stylesheet/member.scss
+++ /dev/null
@@ -1,55 +0,0 @@
-@import 'main';
-
-$primary-color: #004669;
-$primary-color-hover: #00466983;
-
-.title {
- font-weight: bolder;
- color: $primary-color;
-}
-
-.ms-4:first-child {
- scale: 80%;
-}
-
-button {
- background-color: white;
- color: $primary-color;
- transition: .3s;
- padding: 0.7vw 2.5vw;
- border: 0;
- font-weight: bolder;
-}
-
-button:hover {
- background-color: $primary-color-hover;
- color: white;
-}
-
-button.active {
- background-color: $primary-color;
- color: white;
-}
-
-button.active:hover {
- background-color: $primary-color-hover;
- color: $primary-color;
-}
-
-.member-container {
- background-color: $primary-color;
-}
-
-.custom-container {
- max-width: 60%;
-}
-
-.custom-container> {
- h1 {
- width: fit-content;
- }
-}
-
-p {
- text-transform: capitalize;
-}
\ No newline at end of file
diff --git a/vercel.json b/vercel.json
new file mode 100644
index 0000000..413cb7a
--- /dev/null
+++ b/vercel.json
@@ -0,0 +1,5 @@
+{
+ "rewrites": [
+ {"source": "/(.*)", "destination": "/"}
+ ]
+}
\ No newline at end of file
{jabatan}
+
+ {members.map((member, index) =>
+
+
+ 
+
+ )}
+ {member.nama}
+