gil/fod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

디즈니 작업 중

Browse Source
This commit is contained in:
NEW_GIL_HOME\hyeon
2025-06-30 22:18:26 +09:00
parent 70c31fa0b2
commit aec4aef61e
7 changed files with 1070 additions and 973 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
kr/assets/css/pdp_detail.css
View File

@@ -3906,6 +3906,7 @@
}
.displayThemeDesney.comp_content .comp_wide {
max-width: 192rem;
height: 337.4rem;
padding: 12rem 0 0;
background: url(../images/kia/pdp/display_theme_disney/bg_design.jpg) no-repeat center top/100% auto;
text-align: center;
@@ -3929,6 +3930,9 @@
.displayThemeDesney.comp_content .comp_wide .comp_body {
max-width: 120rem;
}
.displayThemeDesney.comp_content .comp_wide .tab-wrap .tab-menu {
margin-bottom: 4.8rem;
}
.displayThemeDesney.comp_content .comp_wide .tab-wrap .tab-menu ul {
display: flex;
-moz-column-gap: 0.8rem;
@@ -3949,6 +3953,23 @@
border: 0;
background: linear-gradient(90deg, #ed1c24 0%, #b51016 100%);
}
.displayThemeDesney.comp_content .comp_wide .tab-wrap .text_area {
margin-top: 2rem;
text-align: left;
}
.displayThemeDesney.comp_content .comp_wide .tab-wrap h4 {
font-size: 2.4rem;
font-weight: 600;
color: #fff;
}
.displayThemeDesney.comp_content .comp_wide .tab-wrap p {
margin-top: 1rem;
font-size: 1.6rem;
color: #fff;
}
.displayThemeDesney .welcome-goodbye .image_area + .image_area {
margin-top: 2rem;
}
.desktop .displayThemeDesney .mobile {
display: none;

2
kr/assets/css/pdp_detail.css.map
View File

File diff suppressed because one or more lines are too long

25
kr/assets/css/pdp_detail.scss
View File

@@ -4440,6 +4440,7 @@
&.comp_content {
.comp_wide {
max-width: 192rem;
height: 337.4rem;
padding: 12rem 0 0;
background: url(../images/kia/pdp/display_theme_disney/bg_design.jpg) no-repeat center top / 100% auto;
text-align: center;
@@ -4464,6 +4465,7 @@
}
.tab-wrap {
.tab-menu {
margin-bottom: 4.8rem;
ul {
display: flex;
column-gap: 0.8rem;
@@ -4488,6 +4490,29 @@
}
}
}
.text_area {
margin-top: 2rem;
text-align: left;
}
h4 {
font-size: 2.4rem;
font-weight: 600;
color: #fff;
}
p {
margin-top: 1rem;
font-size: 1.6rem;
color: #fff;
}
}
}
}
.welcome-goodbye {
.image_area {
& + .image_area {
margin-top: 2rem;
}
}
}

BIN
kr/assets/images/kia/pdp/display_theme_disney/goodbye.mp4 Normal file
View File

Binary file not shown.

BIN
kr/assets/images/kia/pdp/display_theme_disney/welcome.mp4 Normal file
View File

Binary file not shown.

1857
kr/product/pdp_display_theme.html
View File

File diff suppressed because it is too large Load Diff

114
kr/product/pdp_display_theme_disney.html
View File

@@ -428,11 +428,125 @@
</li>
</ul>
</div>
<div class="tab-box box1">
<div class="welcome-goodbye">
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/welcome.mp4" type="video/mp4" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
<source src="../assets/images/kia/pdp/display_theme_disney/goodbye.mp4" type="video/mp4" />
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
</video>
</div>
<div class="text_area">
<h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Welcome & Goodbye Video</h4>
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Marvel-themed motion graphics are displayed upon vehicle start-up and shutdown.</p>
</div>
</div>
<div class="item aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-offset="9999" data-aos-duration="200">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont3.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Cluster</h4>
<p>The selected Marvel theme appears on the cluster with themed graphics and gauges.</p>
</div>
</div>
<div class="item aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-offset="9999" data-aos-duration="200">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont4.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Navigation</h4>
<p>Marvel artwork highlights your current location during navigation.</p>
</div>
</div>
<div class="item aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-offset="9999" data-aos-duration="200">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont5.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Homecard</h4>
<p>Artwork of Marvel characters and logos appear across various menu screens.</p>
</div>
</div>
<div class="item aos-init aos-animate" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-offset="9999" data-aos-duration="200">
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_cont6.png" class="themeImg" alt="디스플레이 테마1" />
</div>
<div class="text_area">
<h4>Profile</h4>
<p>Choose from Marvel-themed profile images—set a unique one for each driver.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="comp_wide">
<div class="three-reasons">
<div class="tit-area">
<h3 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">Three Reasons</h3>
<p>Why you can't miss out</p>
</div>
<ol>
<li>
<em>1</em>
<div class="text_area">
<strong>A Wonderful In-Car Experience</strong>
<p>Once you transform your display with Marvel themes, you might find it hard to return to the standard setup.</p>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons1.png" alt="A Wonderful In-Car Experience" />
</div>
</li>
<li>
<em>2</em>
<div class="text_area">
<strong>Themes for Every Taste</strong>
<p>Whether you're a fan of Spider-Man, Deadpool, or Wolverine, a variety of Marvel themes will soon be available to match your favorite character.</p>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons2.png" alt="Themes for Every Taste" />
</div>
</li>
<li>
<em>3</em>
<div class="text_area">
<strong>Your One-of-a-kind Journey Starts Here</strong>
<p>Marvel in-car experience offers something you won’t see anywhere else - made uniquely for Kia owners.</p>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_reasons3.png" alt="Your One-of-a-kind Journey Starts Here" />
</div>
</li>
</ol>
</div>
</div>
<div class="comp_wide">
<div class="coming-next">
<div class="tit-area">
<h3 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">What’s Coming Up Next?</h3>
<p>Stay tuned for the next Marvel Display Themes!</p>
</div>
<div class="image_area">
<img src="../assets/images/kia/pdp/display_theme_disney/img_next.png" alt="What’s Coming Up Next?" />
</div>
</div>
</div>
<div class="comp_wide">
<div class="comp_body">
<div class="item">