added palette
This commit is contained in:
+25
@@ -54,6 +54,31 @@ white = "#fffff8"
|
|||||||
border = "#c9d6e0"
|
border = "#c9d6e0"
|
||||||
hero_gradient = "linear-gradient(135deg, #1a3a5c 0%, #2b4c7e 50%, #3a6b5a 100%)"
|
hero_gradient = "linear-gradient(135deg, #1a3a5c 0%, #2b4c7e 50%, #3a6b5a 100%)"
|
||||||
|
|
||||||
|
# Палитра мероприятия
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#1a3a5c"
|
||||||
|
name = "Тёмный индиго"
|
||||||
|
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#2b4c7e"
|
||||||
|
name = "Глубокий синий"
|
||||||
|
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#7da0c4"
|
||||||
|
name = "Нежно-голубой"
|
||||||
|
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#3a6b5a"
|
||||||
|
name = "Изумрудный"
|
||||||
|
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#7e8e6c"
|
||||||
|
name = "Шалфей"
|
||||||
|
|
||||||
|
[[extra.palette]]
|
||||||
|
color = "#eef3f7"
|
||||||
|
name = "Жемчужный"
|
||||||
|
|
||||||
# Карточки деталей
|
# Карточки деталей
|
||||||
[[extra.details]]
|
[[extra.details]]
|
||||||
icon = "🎁"
|
icon = "🎁"
|
||||||
|
|||||||
+46
-1
@@ -275,10 +275,14 @@ a {
|
|||||||
background: var(--color-white);
|
background: var(--color-white);
|
||||||
}
|
}
|
||||||
|
|
||||||
&--rsvp {
|
&--palette {
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-alt);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&--rsvp {
|
||||||
|
background: var(--color-white);
|
||||||
|
}
|
||||||
|
|
||||||
&__title {
|
&__title {
|
||||||
font-family: $font-serif;
|
font-family: $font-serif;
|
||||||
font-size: clamp(2rem, 4vw, 2.8rem);
|
font-size: clamp(2rem, 4vw, 2.8rem);
|
||||||
@@ -560,6 +564,38 @@ a {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ==========================
|
||||||
|
// Palette
|
||||||
|
// ==========================
|
||||||
|
.palette {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 40px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
&__item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__circle {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 1px solid var(--color-border);
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
&__name {
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: var(--color-text-light);
|
||||||
|
letter-spacing: 0.03em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// ==========================
|
// ==========================
|
||||||
// RSVP Form
|
// RSVP Form
|
||||||
// ==========================
|
// ==========================
|
||||||
@@ -759,6 +795,15 @@ a {
|
|||||||
gap: 20px;
|
gap: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.palette {
|
||||||
|
gap: 24px;
|
||||||
|
|
||||||
|
&__circle {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
padding: 70px 0;
|
padding: 70px 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -148,6 +148,22 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Palette -->
|
||||||
|
<section class="section section--palette" id="palette">
|
||||||
|
<div class="container">
|
||||||
|
<h2 class="section__title">Палитра мероприятия</h2>
|
||||||
|
<div class="section__divider"></div>
|
||||||
|
<div class="palette">
|
||||||
|
{% for swatch in config.extra.palette %}
|
||||||
|
<div class="palette__item">
|
||||||
|
<div class="palette__circle" style="background-color: {{ swatch.color }}"></div>
|
||||||
|
<span class="palette__name">{{ swatch.name }}</span>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<!-- RSVP -->
|
<!-- RSVP -->
|
||||||
<section class="section section--rsvp" id="rsvp">
|
<section class="section section--rsvp" id="rsvp">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|||||||
Reference in New Issue
Block a user