Refactor index.html and enhance style.css with glassmorphism effect for opening hours section
This commit is contained in:
@@ -3,8 +3,33 @@ section {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#openingHours {
|
||||
background: linear-gradient(90deg, rgb(0, 159, 155), rgb(157, 254, 175));
|
||||
}
|
||||
|
||||
.glass {
|
||||
padding: 30px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
|
||||
/* Animation */
|
||||
scale: .8;
|
||||
opacity: 0;
|
||||
animation: fade-in linear forwards;
|
||||
animation-timeline: view();
|
||||
animation-range: entry;
|
||||
}
|
||||
|
||||
.table>:not(caption)>*>* {
|
||||
background-color: transparent !important;
|
||||
border-bottom-width: 0 !important;
|
||||
}
|
||||
|
||||
footer {
|
||||
height: 240px;
|
||||
height: 160px;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
@@ -15,3 +40,7 @@ footer {
|
||||
.swiper-pagination-bullet {
|
||||
background-color: rgba(0, 0, 0, 1) !important
|
||||
}
|
||||
|
||||
@keyframes fade-in {
|
||||
to { scale: 1; opacity: 1;}
|
||||
}
|
||||
|
Reference in New Issue
Block a user