Abhishek Rathore
6a32be2191
initially the login page background image size was 5.3MB and was of very high resolution. so i reduce the size by changing its file type from jpg to webp and also decreasing its resolution by 50%. it makes a significant improvement in file size of image which is now 433KB. this increases the performance. Fixes: #1296
57 lines
965 B
SCSS
57 lines
965 B
SCSS
.cover {
|
|
background: url("../../assets/images/cover_image_resized.webp") no-repeat center center;
|
|
background-size: cover;
|
|
position: relative;
|
|
z-index: 0;
|
|
max-width: 70vw;
|
|
|
|
&::after {
|
|
content: "";
|
|
opacity: 0.5;
|
|
background: linear-gradient(#000, #000);
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
display: block;
|
|
z-index: 1;
|
|
position: absolute;
|
|
}
|
|
|
|
.cover-content {
|
|
display: block;
|
|
max-width: 80%;
|
|
margin: 100px;
|
|
color: #fff;
|
|
text-align: justify;
|
|
z-index: 2;
|
|
|
|
.cover-title {
|
|
border-bottom: 2px solid #fff;
|
|
margin: 0 0 20px;
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
.cover-description {
|
|
.cover-link {
|
|
text-decoration: underline;
|
|
color: #fff;
|
|
|
|
&:hover {
|
|
color: #d3d3d3;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.login-container {
|
|
box-shadow: 1px 1px 50px #000;
|
|
height: 100vh;
|
|
overflow: auto;
|
|
|
|
.img-container {
|
|
max-width: 18rem;
|
|
}
|
|
}
|