add button for discovery set and remove upsell section

This commit is contained in:
anielsen99 2026-03-27 18:50:24 +01:00
parent aba904f796
commit 2da092a6f2
2 changed files with 39 additions and 42 deletions

View File

@ -306,20 +306,46 @@
color: #fff;
padding: 14px 16px;
border-radius: 18px;
justify-content: space-between;
display: flex;
gap: 20px;
}
.discovery-note strong {
.discovery-note-text strong {
display: block;
margin-bottom: 6px;
font-size: 13px;
}
.discovery-note p {
.discovery-note-text p {
font-size: 11px;
color: #d0d0d0;
margin: 0;
}
.discovery-note-btn {
border: none;
border-radius: 999px;
background-color: #ff6a00;
color: #fff;
padding: 12px 18px;
font-size: 14px;
cursor: pointer;
margin-left: auto;
flex-shrink: 0;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.discovery-note-btn:hover {
transform: translateY(-1px);
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}
.discovery-note-btn:active {
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
background: rgba(255, 106, 0, 0.8);
}
.buy-button {
width: 100%;
border: none;
@ -361,33 +387,6 @@
/* --- Description Columns End --- */
/* --- Bottom Upsell Bar Start --- */
.detail-upsell-bar {
margin-top: auto;
background-color: #1f1f1f;
color: #fff;
padding: 12px 16px;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 999px;
}
.detail-upsell-bar strong {
display: block;
margin-bottom: 4px;
font-size: 13px;
}
.detail-upsell-bar p {
font-size: 11px;
color: rgba(255, 255, 255, 0.7);
margin: 0;
}
/* --- Bottom Upsell Bar End --- */
/* --- Bottom CTA Start --- */
.detail-bottom-cta {

View File

@ -167,11 +167,17 @@ function ProductDetailPage({ perfumeSlug = "kalter-beton" }) {
</div>
<div className="discovery-note">
<strong>Discovery Set wird angerechnet</strong>
<p>
Hast du das Discovery Set gekauft, wird der volle Preis beim Kauf
automatisch abgezogen.
</p>
<div className="discovery-note-text">
<strong>Discovery Set wird angerechnet</strong>
<p>
Hast du das Discovery Set gekauft, wird der volle Preis beim Kauf
automatisch abgezogen.
</p>
</div>
<button className="discovery-note-btn" type="button">
Zum Set
</button>
</div>
<button className="buy-button" type="button">
@ -199,14 +205,6 @@ function ProductDetailPage({ perfumeSlug = "kalter-beton" }) {
<p>{perfume.edition}</p>
</div>
</div>
<div className="detail-upsell-bar">
<div>
<strong>Noch unsicher?</strong>
<p>Discovery Set bestellen und Düfte testen</p>
</div>
<span></span>
</div>
</div>
</section>