diff --git a/src/images/history-1.jpg b/src/images/history-1.jpg index 0469336..467fc5a 100644 Binary files a/src/images/history-1.jpg and b/src/images/history-1.jpg differ diff --git a/src/images/history-2.jpg b/src/images/history-2.jpg index b74b58f..a632a43 100644 Binary files a/src/images/history-2.jpg and b/src/images/history-2.jpg differ diff --git a/src/images/history-3.jpg b/src/images/history-3.jpg index fd056f0..20c1ea2 100644 Binary files a/src/images/history-3.jpg and b/src/images/history-3.jpg differ diff --git a/src/images/icon-scroll-down.svg b/src/images/icon-scroll-down.svg index 4d19fca..f669b3e 100644 --- a/src/images/icon-scroll-down.svg +++ b/src/images/icon-scroll-down.svg @@ -1,5 +1,4 @@ - - - - + + + diff --git a/src/index.html b/src/index.html index 15d64bf..fb27c67 100644 --- a/src/index.html +++ b/src/index.html @@ -44,18 +44,22 @@
+
+

Creative Development Company

THE BODA LAB

+ + @@ -88,9 +92,9 @@

HISTORY

+
2024 -
  • 12.01 @@ -110,9 +114,9 @@
+
2023 -
  • 12.01 @@ -140,9 +144,9 @@
+
2022 -
  • 11.01 @@ -166,9 +170,65 @@
+ +
+ 2023 +
    +
  • + 12.01 + 신한은행 슈퍼소울 운영 계약 +
  • +
  • + 11.01 + 한화금융 라이프 플러스 아카데미 구축 계약 +
  • +
  • + 10.01 + 대교 차세대 구축 계약 +
  • +
  • + 09.01 + 한화금융통합 서비스 구축 계약 +
  • +
  • + 05.30 + 신한은행 슈퍼소울 구축 계약 +
  • +
  • + 05.01 + 롯데 렌터카 오토리스 구축 계약 +
  • +
+
+ +
+ 2022 +
    +
  • + 11.01 + 한화금융 서비스앱 플러스 리뉴얼 2차 계약 +
  • +
  • + 09.01 + 한화금융 서비스앱 플러스 리뉴얼 1차 계약 +
  • +
  • + 08.01 + 밀레 쇼핑몰 리뉴얼 구축 계약 +
  • +
  • + 07.01 + 오뚜기 쇼핑몰 리뉴얼 구축 계약 +
  • +
  • + 05.01 + 케나다구스 코리아 쇼핑몰 구축 계약 +
  • +
+
+
2021 -
  • 11.22 @@ -196,14 +256,13 @@
+
-
- - - -
+ + +
diff --git a/src/scss/base/_reset.scss b/src/scss/base/_reset.scss index 77eaf3a..4f3aae8 100644 --- a/src/scss/base/_reset.scss +++ b/src/scss/base/_reset.scss @@ -25,7 +25,6 @@ body { img { display: block; width: 100%; - height: 100%; object-fit: cover; } diff --git a/src/scss/page/_about.scss b/src/scss/page/_about.scss index 08a4e62..48b6d66 100644 --- a/src/scss/page/_about.scss +++ b/src/scss/page/_about.scss @@ -79,22 +79,24 @@ // History .history { - background: $color-bg; + background: $color-bg-light; + padding: 0 0 0; } .history__top { - background: $color-bg-light; - padding: 80px 48px 60px; + max-width: 1280px; + padding: 120px 40px 120px; + margin: 0 auto; } .history__top .sectionTitleDark { - margin-bottom: 48px; + margin-bottom: 88px; } .history__timeline { display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 0 24px; + grid-template-columns: repeat(3, 1fr); + gap: 60px 24px; } .history__yearGroup { @@ -106,23 +108,16 @@ font-size: clamp(24px, 2.5vw, 32px); font-weight: 100; color: $color-dark; - margin-bottom: 16px; + margin-bottom: 32px; line-height: 1; } -.history__divider { - width: 0.5px; - background: $color-dark; - align-self: flex-start; - height: 0; - margin-bottom: 16px; - opacity: 0.4; -} - .history__list { display: flex; flex-direction: column; - gap: 16px; + gap: 12px; + border-left: 1px solid #0d0d0d; + padding: 0 0 0 23px; } .history__listItem { @@ -139,49 +134,40 @@ } .history__listText { - font-size: clamp(12px, 1vw, 14px); + font-size: clamp(12px, 1vw, 16px); font-weight: 300; color: $color-dark; line-height: 1.6; } .history__bottom { - background: $color-bg; - padding: 0 48px 80px; - overflow: hidden; -} - -.history__images { position: relative; - height: 400px; - margin-top: -80px; + background: $color-bg; + height: 480px; } .history__img { position: absolute; object-fit: cover; -} -.history__img1 { - width: 260px; - height: 170px; - left: 0; - bottom: 0; -} + &.history__img--1 { + width: 16.67%; + top: 0px; + left: 0; + } -.history__img2 { - width: 370px; - height: 400px; - left: 50%; - transform: translateX(-50%); - top: 0; -} + &.history__img--2 { + width: 27.1%; + left: 50%; + transform: translateX(-50%); + top: -60px; + } -.history__img3 { - width: 300px; - height: 190px; - right: 0; - bottom: 40px; + &.history__img--3 { + width: 18.23%; + top: 0px; + left: 0; + } } // Boda Intro diff --git a/src/scss/page/_intro.scss b/src/scss/page/_intro.scss index cf982dc..b628793 100644 --- a/src/scss/page/_intro.scss +++ b/src/scss/page/_intro.scss @@ -16,37 +16,38 @@ inset: 0; pointer-events: none; overflow: hidden; -} -.blob { - position: absolute; - border-radius: 50%; - filter: blur(120px); - opacity: 0.55; -} + .blob { + position: absolute; + border-radius: 50%; + filter: blur(60px); + opacity: 0.5; + } -.blobCyan { - width: 56vw; - height: 56vw; - background: $color-cyan; - top: -10%; - right: -10%; -} + .blobCyan { + width: 20vw; + height: 20vw; + background: $color-cyan; + top: 50%; + right: 20%; + transform: translateY(-50%); + } -.blobPurple { - width: 32vw; - height: 32vw; - background: $color-purple; - top: 15%; - left: 5%; -} + .blobPurple { + width: 10vw; + height: 10vw; + background: $color-purple; + top: 40%; + left: 50%; + } -.blobBlue { - width: 24vw; - height: 24vw; - background: $color-blue; - bottom: 10%; - left: -5%; + .blobBlue { + width: 10vw; + height: 10vw; + background: $color-blue; + top: 42%; + left: 30%; + } } .intro__content {