drop some shadows

This commit is contained in:
liviu 2023-08-05 08:24:00 +00:00
parent 71753d06ef
commit abe87db17b
7 changed files with 46 additions and 48 deletions

20
dist/css/styles.css vendored
View File

@ -247,7 +247,7 @@ sup {
a {
color: var(--bs-link-color);
text-decoration: underline;
text-decoration: none;
}
a:hover {
color: var(--bs-link-hover-color);
@ -2790,7 +2790,6 @@ textarea.form-control-lg {
line-height: var(--bs-btn-line-height);
color: var(--bs-btn-color);
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
@ -3129,7 +3128,7 @@ textarea.form-control-lg {
--bs-btn-disabled-border-color: transparent;
--bs-btn-box-shadow: none;
--bs-btn-focus-shadow-rgb: 200, 82, 111;
text-decoration: underline;
text-decoration: none;
}
.btn-link:focus-visible {
color: var(--bs-btn-color);
@ -3451,7 +3450,6 @@ textarea.form-control-lg {
font-weight: 400;
color: var(--bs-dropdown-link-color);
text-align: inherit;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border: 0;
@ -3625,7 +3623,6 @@ textarea.form-control-lg {
font-size: var(--bs-nav-link-font-size);
font-weight: var(--bs-nav-link-font-weight);
color: var(--bs-nav-link-color);
text-decoration: none;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
@ -3772,7 +3769,6 @@ textarea.form-control-lg {
margin-right: var(--bs-navbar-brand-margin-end);
font-size: var(--bs-navbar-brand-font-size);
color: var(--bs-navbar-brand-color);
text-decoration: none;
white-space: nowrap;
}
.navbar-brand:hover, .navbar-brand:focus {
@ -4530,7 +4526,6 @@ textarea.form-control-lg {
padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
font-size: var(--bs-pagination-font-size);
color: var(--bs-pagination-color);
text-decoration: none;
background-color: var(--bs-pagination-bg);
border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@ -4836,7 +4831,6 @@ textarea.form-control-lg {
display: block;
padding: var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);
color: var(--bs-list-group-color);
text-decoration: none;
background-color: var(--bs-list-group-bg);
border: var(--bs-list-group-border-width) solid var(--bs-list-group-border-color);
}
@ -10837,8 +10831,12 @@ p {
line-height: 1.75;
}
a {
text-decoration: none;
.text-shadow {
text-shadow: rgba(0, 0, 0, 0.15) 0 0.5rem 1rem !important;
}
.drop-shadow {
filter: drop-shadow(0 0.5rem 1rem rgba(0, 0, 0, 0.15));
}
.opacity-80 {
@ -11057,7 +11055,7 @@ header.masthead .masthead-heading {
margin-left: 0;
text-align: center;
color: white;
border: 7px solid #e9ecef;
border: 6px solid #e9ecef;
border-radius: 100%;
background-color: #BE3455;
}

31
dist/index.html vendored
View File

@ -26,9 +26,9 @@
<button class="ms-auto navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><i class="fas fa-bars mx-1 fa-beat fa-fw fa-lg"></i></button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ms-auto py-4 py-lg-0">
<li class="nav-item ms-auto"><a class="nav-link" href="#top">Nunta</a></li>
<li class="nav-item ms-auto"><a class="nav-link" href="#cind">Când</a></li>
<li class="nav-item ms-auto"><a class="nav-link" href="#unde">Unde</a></li>
<li class="nav-item ms-auto"><a class="nav-link text-shadow" href="#top">Nunta</a></li>
<li class="nav-item ms-auto"><a class="nav-link text-shadow" href="#cind">Când</a></li>
<li class="nav-item ms-auto"><a class="nav-link text-shadow" href="#unde">Unde</a></li>
</ul>
</div>
</div>
@ -36,25 +36,22 @@
<!-- Masthead-->
<header class="masthead">
<div class="container">
<div class="masthead-heading opacity-80"><i class="fas fa-heart fa-fw text-primary"></i></div>
<div class="masthead-subheading opacity-80">Ne căsătorim!</div>
<div class="masthead-heading opacity-80">Anamaria și Liviu</div>
<a class="btn btn-primary btn-xl mt-4 opacity-80" href="#cind">Detalii</a>
<div class="masthead-heading"><i class="fas fa-heart fa-fw text-primary drop-shadow"></i></div>
<div class="masthead-subheading opacity-80 text-shadow">Ne căsătorim!</div>
<div class="masthead-heading opacity-80 text-shadow">Anamaria și Liviu</div>
<a class="btn btn-primary btn-xl mt-4 shadow" href="#cind">Detalii</a>
</div>
</header>
<!-- Services-->
<section class="page-section" id="cind">
<div class="container">
<div class="text-center">
<h3 class="section-subheading text-muted mb-1">Împreună cu nașii</h3>
<h3 class="section-heading mb-4 my-2">Mihaela și Ionuț Sturzoiu</h3>
<h3 class="section-subheading text-muted mb-1">și dragii noștri părinți</h3>
</div>
<div class="text-center"></div>
<div class="row text-center">
<h3 class="section-subheading text-muted mb-1">Împreună cu dragii noștri părinți</h3>
<div class="col"><h4 class="my-1">Elena și Dan Ivașcu</h4></div>
<div class="col"><h4 class="my-1">Gabriela și Radu Rădulescu</h4></div>
</div>
<div class="text-center mt-4">
<h3 class="section-subheading text-muted mb-1">și nașii</h3>
<h3 class="section-heading mb-4 my-2">Mihaela și Ionuț Sturzoiu</h3>
<h3 class="section-subheading text-muted mb-1">vă invităm să ne fiți alături pe</h3>
<h2 class="section-heading">23 septembrie 2023</h2>
<h3 class="section-subheading text-muted mb-1">la București</h3>
@ -66,7 +63,7 @@
<div class="container">
<ul class="timeline">
<li>
<div class="timeline-image"><img class="rounded-circle img-fluid" src="assets/img/bis-sf.maria.png" alt="..." /></div>
<div class="timeline-image shadow"><img class="rounded-circle img-fluid" src="assets/img/bis-sf.maria.png" alt="..." /></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>13:30</h4>
@ -89,7 +86,7 @@
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-image"><img class="rounded-circle img-fluid" src="assets/img/casa-doina-crama.png" alt="..." /></div>
<div class="timeline-image shadow"><img class="rounded-circle img-fluid" src="assets/img/casa-doina-crama.png" alt="..." /></div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>15:00</h4>
@ -114,7 +111,7 @@
</div>
</li>
<li class="timeline">
<div class="timeline-image">
<div class="timeline-image shadow">
<h4>
<br />
<p class="text-uppercase">Mulțumim</p>

View File

@ -7,8 +7,6 @@ services:
hostname: nunta
stdin_open: true
tty: true
ports:
- 8080:80
environment:
- SPERLING_ENVIRONMENT=docker
- DANCER_ENVIRONMENT=docker

View File

@ -38,33 +38,32 @@ html(lang='en')
#navbarResponsive.collapse.navbar-collapse
ul.navbar-nav.ms-auto.py-4.py-lg-0
li.nav-item.ms-auto
a.nav-link(href='#top') Nunta
a.nav-link(href='#top').text-shadow Nunta
li.nav-item.ms-auto
a.nav-link(href='#cind') Când
a.nav-link(href='#cind').text-shadow Când
li.nav-item.ms-auto
a.nav-link(href='#unde') Unde
a.nav-link(href='#unde').text-shadow Unde
// Masthead
header.masthead
.container
.masthead-heading.opacity-80
i.fas.fa-heart.fa-fw.text-primary
.masthead-subheading.opacity-80 Ne căsătorim!
.masthead-heading.opacity-80 Anamaria și Liviu
a.btn.btn-primary.btn-xl.mt-4.opacity-80(href='#cind') Detalii
.masthead-heading
i.fas.fa-heart.fa-fw.text-primary.drop-shadow
.masthead-subheading.opacity-80.text-shadow Ne căsătorim!
.masthead-heading.opacity-80.text-shadow Anamaria și Liviu
a.btn.btn-primary.btn-xl.mt-4.shadow(href='#cind') Detalii
// Services
section#cind.page-section
.container
.text-center
h3.section-subheading.text-muted.mb-1 Împreună cu nașii
h3.section-heading.mb-4.my-2 Mihaela și Ionuț Sturzoiu
h3.section-subheading.text-muted.mb-1 și dragii noștri părinți
.row.text-center
h3.section-subheading.text-muted.mb-1 Împreună cu dragii noștri părinți
.col
h4.my-1 Elena și Dan Ivașcu
.col
h4.my-1 Gabriela și Radu Rădulescu
.text-center.mt-4
h3.section-subheading.text-muted.mb-1 și nașii
h3.section-heading.mb-4.my-2 Mihaela și Ionuț Sturzoiu
h3.section-subheading.text-muted.mb-1 vă invităm să ne fiți alături pe
h2.section-heading 23 septembrie 2023
h3.section-subheading.text-muted.mb-1 la București
@ -75,7 +74,7 @@ html(lang='en')
.container
ul.timeline
li
.timeline-image
.timeline-image.shadow
img.rounded-circle.img-fluid(src='assets/img/bis-sf.maria.png', alt='...')
.timeline-panel
.timeline-heading
@ -94,7 +93,7 @@ html(lang='en')
i.fas.fa-location-dot.fa-fw
| Harta
li.timeline-inverted
.timeline-image
.timeline-image.shadow
img.rounded-circle.img-fluid(src='assets/img/casa-doina-crama.png', alt='...')
.timeline-panel
.timeline-heading
@ -115,7 +114,7 @@ html(lang='en')
i.fas.fa-location-dot.fa-fw
| Harta
li.timeline
.timeline-image
.timeline-image.shadow
h4
br
p.text-uppercase Mulțumim

View File

@ -23,8 +23,12 @@ p {
line-height: $line-height-lg;
}
a {
text-decoration: none;
.text-shadow {
text-shadow: rgba(0, 0, 0, 0.15) 0 0.5rem 1rem !important;
}
.drop-shadow {
filter: drop-shadow(0 0.5rem 1rem rgba(0, 0, 0, 0.15));
}
.opacity-80 {

View File

@ -4,5 +4,7 @@
// Import variables from src/scss/variables
$link-decoration: none !default;
@import "./variables/colors.scss";
@import "./variables/typography.scss";

View File

@ -64,7 +64,7 @@
margin-left: 0;
text-align: center;
color: white;
border: 7px solid $gray-200;
border: 6px solid $gray-200;
border-radius: 100%;
background-color: $primary;