autowp/autowp-frontend

View on GitHub
src/app/gallery/gallery.component.scss

Summary

Maintainability
Test Coverage
@import 'bootstrap/scss/functions';
@import 'bootstrap/scss/variables';
@import '../variables';
@import 'bootstrap/scss/mixins';
 
.gallery {
position: fixed;
inset: 0;
z-index: 1031;
overflow: hidden;
background: #000;
background: rgb(0 0 0 / 90%);
touch-action: none;
 
.carousel {
width: 100%;
height: 100%;
 
.carousel-numbers {
bottom: auto;
top: 20px;
position: absolute;
left: 50%;
z-index: 15;
padding: 0;
list-style: none;
text-align: center;
color: $color-white;
transform: translate(-50%, 0);
text-shadow: 0 0 4px #000;
}
}
 
.carousel-indicators {
bottom: auto;
top: 17px;
 
li {
width: 14px;
height: 14px;
background: transparent;
border-radius: 7px;
cursor: pointer;
border: 1px solid #fff;
margin: 0 4px;
display: block;
 
&.active {
background: #fff;
}
}
}
 
.carousel-control {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 15%;
text-align: center;
background-color: transparent;
}
 
.carousel-control-close {
position: absolute;
top: 0;
right: 0;
left: auto;
height: 15%;
width: 15%;
color: #fff;
z-index: 1;
background: none;
border: none;
outline: none;
 
&:focus, &:active {
border: none;
outline: none;
}
 
.fa {
margin-top: 15px;
}
}
 
.carousel-inner {
height: 100%;
}
}