n.kolosnaj/Globaly-CSS-Practice
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

jun 18

Browse Source
This commit is contained in:
nkolosnjaj
2024-06-18 16:52:52 +02:00
parent 252fe7ce44
commit 056aceaaaa
46 changed files with 6791 additions and 1407 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
style/_first-part.scss
View File

@@ -2,13 +2,25 @@
.first-part {
min-height: 65vh;
background-image: url('../assets/images/image36.jpg');
background-size: cover;
color: white;
background-position: center;
}
.slick-carousel{
min-height: 65vh !important;
}
// #first-part-home{
// min-height: 65vh ;
// background-image: url('../assets/images/image36.jpg');
// background-size: cover;
// color: white;
// background-position: center;
// }
.textbox {
text-align: center;
height: 100%;
@@ -54,8 +66,14 @@
}
@media only screen and (min-width: 768px){
.first-part {
min-height: 53vh;
.textbox{
button{
display: none;
}
}
}
.h2-first {
@@ -67,12 +85,14 @@
@media only screen and (min-width: 992px) {
.first-part {
min-height: 78vh;
min-height: 78vh ;
display: flex;
justify-content: center;
.textbox{
p{
margin-left: 400px;
margin-right: 400px;

22
style/_footer.scss
View File

@@ -1,6 +1,28 @@
footer{
background-color: #31353d;
.scrollToTopBtn{
button{
display: none;
position: fixed;
bottom: 70px;
right: 20px;
z-index: 99;
background-color: #15c1c6;
padding: 18px;
border-radius: 50%;
font-size: 23px;
color: white;
background-color: #15c1c6;
border: none;
}
button:hover{
background-color: #31353d;
transition: 0.3s;
}
}
.footer-copyright{
color: #ffffff;

176
style/_nav.scss
View File

@@ -1,12 +1,12 @@
@import '_variables';
.form-search{
.form-search {
width: 380px;
height: 40px ;
height: 40px;
}
.socials-ul{
.socials-ul {
display: none;
}
@@ -19,21 +19,20 @@ nav {
.navbar {
padding: 0 !important;
height: 40px ;
height: 40px;
}
.form-container {
padding: 0;
}
.btn span {
padding-top: 10px;
color: $lightblue;
width: 30px;
height: 30px;
}
.btn span:hover {
@@ -47,7 +46,7 @@ nav {
input {
color: white !important;
}
#src-input {
@@ -59,7 +58,7 @@ input::placeholder {
color: white !important;
}
.phone{
.phone {
color: #333333;
font-family: $numberfont;
font-weight: 900;
@@ -70,13 +69,14 @@ input::placeholder {
text-decoration: none;
}
.phone:hover{
.phone:hover {
color: $lightblue;
transition: 0.5s;
text-decoration: none;
}
#phone-img{
#phone-img {
width: 22px;
height: 33px;
}
@@ -95,15 +95,16 @@ input::placeholder {
font-size: 14px;
}
.logo-img{
cursor:pointer;
.logo-img {
cursor: pointer;
}
.dropdown{
.dropdown {
top: 22%;
right: 10px;
}
// .register{
// .register-link{
// color: #15c1c6;
@@ -118,32 +119,36 @@ input::placeholder {
// }
@media only screen and (min-width: 768px) {
.dropdown{
.dropdown {
position: absolute;
top: 7px;
left: 20px;
}
.form-search{
.form-search {
width: 229px !important;
background-color: #4a4e55;
padding-left: 34px;
padding-right: 15px;
}
.form-container{
padding-right: 15px;
}
.form-container {
padding-left: 0 !important;
padding-right: 15px !important;
}
.navbar{
.navbar {
background-color: #30343c;
height: 50px;
}
#src-input {
padding-left: 0px;
}
#socials{
#socials {
height: 28px !important;
width: 28px !important;
margin-top: 0 !important;
@@ -153,32 +158,27 @@ input::placeholder {
justify-content: center;
}
.horizontal-menu{
.horizontal-menu {
border-top: 1px solid #efefef;
}
.nav-ul-hor{
.nav-ul-hor {
width: 100%;
cursor: pointer;
color: #333333;
font-family: Lato, sans-serif;
font-family: Lato, sans-serif;
font-weight: 900;
font-style: normal;
text-transform: uppercase;
list-style-type: none;
padding-left: 16px !important;
.navs{
.navs {
padding: 1rem;
color: #333333 ;
// .hor-navs-a{
// color: #333333;
// }
// .hor-navs-a:hover{
// color:white !important;
// }
color: #333333;
}
.navs:hover {
@@ -186,41 +186,125 @@ input::placeholder {
color: white;
transition: 0.3s;
}
}
}
@media only screen and (min-width: 992px) {
.dropdown{
.dropdown {
position: absolute;
left: 5%;
top: 10px;
}
.navbar{
.navbar {
height: 60px;
}
.form-search{
.form-search {
margin-left: 55px;
margin-right: 72px;
margin-bottom: 0px;
}
.horizontal-menu{
.horizontal-menu {
border-top: none !important;
.dropdown-ul-2 {
display: none;
position: absolute;
}
#li-home:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 26%;
top: 18%;
z-index: 99;
font-size: .875rem;
a{
text-decoration: none;
}
li{
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
li:hover{
color: #30343c;
transition: 0.3s;
}
}
#li-people:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 30%;
top: 18%;
z-index: 99;
font-size: .875rem;
a{
text-decoration: none;
}
li{
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
li:hover{
color: #30343c;
transition: 0.3s;
}
}
#li-about:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 37%;
top: 18%;
z-index: 99;
font-size: .875rem;
a{
text-decoration: none;
}
li{
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
li:hover{
color: #30343c;
transition: 0.3s;
}
}
}
.navs{
.navs {
padding: 45px 22px !important;
}
header{
header {
padding: 0 96px !important;
}
.logo-img{
.logo-img {
width: 174px;
height: 39px;
cursor:pointer;
cursor: pointer;
}
}

104
style/style.css
View File

@@ -36,7 +36,6 @@ nav {
}
.btn span {
padding-top: 10px;
color: #15c1c6;
width: 30px;
height: 30px;
@@ -179,10 +178,87 @@ input::placeholder {
.form-search {
margin-left: 55px;
margin-right: 72px;
margin-bottom: 0px;
}
.horizontal-menu {
border-top: none !important;
}
.horizontal-menu .dropdown-ul-2 {
display: none;
position: absolute;
}
.horizontal-menu #li-home:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 26%;
top: 18%;
z-index: 99;
font-size: 0.875rem;
}
.horizontal-menu #li-home:hover .dropdown-ul-2 a {
text-decoration: none;
}
.horizontal-menu #li-home:hover .dropdown-ul-2 li {
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
.horizontal-menu #li-home:hover .dropdown-ul-2 li:hover {
color: #30343c;
transition: 0.3s;
}
.horizontal-menu #li-people:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 30%;
top: 18%;
z-index: 99;
font-size: 0.875rem;
}
.horizontal-menu #li-people:hover .dropdown-ul-2 a {
text-decoration: none;
}
.horizontal-menu #li-people:hover .dropdown-ul-2 li {
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
.horizontal-menu #li-people:hover .dropdown-ul-2 li:hover {
color: #30343c;
transition: 0.3s;
}
.horizontal-menu #li-about:hover .dropdown-ul-2 {
display: flex;
flex-direction: column;
left: 37%;
top: 18%;
z-index: 99;
font-size: 0.875rem;
}
.horizontal-menu #li-about:hover .dropdown-ul-2 a {
text-decoration: none;
}
.horizontal-menu #li-about:hover .dropdown-ul-2 li {
padding: 1em 19px;
width: 15em;
background-color: #15c1c6;
list-style: none;
text-transform: uppercase;
color: white;
border-bottom: 1px solid white;
}
.horizontal-menu #li-about:hover .dropdown-ul-2 li:hover {
color: #30343c;
transition: 0.3s;
}
.navs {
padding: 45px 22px !important;
}
@@ -325,12 +401,15 @@ span {
}
.first-part {
min-height: 65vh;
background-image: url("../assets/images/image36.jpg");
background-size: cover;
color: white;
background-position: center;
}
.slick-carousel {
min-height: 65vh !important;
}
.textbox {
text-align: center;
height: 100%;
@@ -383,6 +462,9 @@ span {
.first-part {
min-height: 53vh;
}
.first-part .textbox button {
display: none;
}
.h2-first {
font-size: 46px !important;
margin-top: 30px;
@@ -994,6 +1076,24 @@ span {
footer {
background-color: #31353d;
}
footer .scrollToTopBtn button {
display: none;
position: fixed;
bottom: 70px;
right: 20px;
z-index: 99;
background-color: #15c1c6;
padding: 18px;
border-radius: 50%;
font-size: 23px;
color: white;
background-color: #15c1c6;
border: none;
}
footer .scrollToTopBtn button:hover {
background-color: #31353d;
transition: 0.3s;
}
footer .footer-copyright {
color: #ffffff;
font-size: 0.875rem;

2
style/style.css.map
View File

File diff suppressed because one or more lines are too long