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

commit

Browse Source
This commit is contained in:
nkolosnjaj
2024-06-03 16:41:31 +02:00
parent 22222bc154
commit e16c7995c4
8 changed files with 68 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -88,7 +88,7 @@
<li class="navs">contacts</li>
</ul>
</div>
<img src="/assets/images/logo.webp" class="mt-3" alt="">
<img src="/assets/images/logo.webp" class="logo-img mt-3 mt-lg-0 mt-md-0" alt="">
<!-- site navigation-->
@@ -179,7 +179,7 @@
<!-- second part -->
<div
class="second-part d-flex flex-column align-items-center justify-content-center mx-3 my-lg-0 my-5 my-md-5 d-md-flex">
class="second-part d-flex flex-column align-items-center justify-content-center mx-3 my-lg-0 my-5 mx-lg-5 my-md-5 d-md-flex">
<div class="headline-card d-flex flex-column align-items-center justify-content-center pb-3">
<h4>business management</h4>
<h2>Services We Offer</h2>

2
style/_form.scss
View File

@@ -61,7 +61,7 @@
}
.input-text::placeholder{
color: #777777 !important;
color: #31353d !important;
}
.form-container-bot{

12
style/_nav.scss
View File

@@ -95,6 +95,12 @@ input::placeholder {
font-size: 14px;
}
.logo-img{
cursor:pointer;
}
@media only screen and (min-width: 768px) {
form {
width: 229px !important;
@@ -175,4 +181,10 @@ input::placeholder {
header{
padding: 0 96px !important;
}
.logo-img{
width: 174px;
height: 39px;
cursor:pointer;
}
}

20
style/_second-part.scss
View File

@@ -33,13 +33,13 @@
width: 80px;
height: 80px;
cursor: pointer;
margin-bottom: 10px;
margin-bottom: 18px;
font-size: 50px;
}
h4 {
text-align: center;
width: 300px;
width: 350px;
padding-bottom: 19px;
font-size: 21px;
font-weight: 400;
@@ -56,7 +56,7 @@
p {
text-align: center;
padding-top: 17px;
padding-top: 17px !important;
font-family: MerriweatherSans;
color: #777777;
letter-spacing: 0;
@@ -77,13 +77,14 @@
box-shadow: none;
outline: none;
color: white;
margin-bottom: 0px !important;
}
.view-more:hover {
background-color: #333333 !important;
color: white;
transition: 0.2s;
;
}
@media only screen and (min-width:768px) {
@@ -91,10 +92,17 @@
margin-bottom: 20px;
}
.card {
p {
padding: 0 30px ;
}
}
.card{
h4{
width: 300px;
}
}
}
@media only screen and (min-width:992px) {
@@ -102,6 +110,7 @@
.second-part {
min-height: 80vh;
padding-top: 70px;
padding-bottom: 120px;
@@ -112,7 +121,7 @@
}
p {
padding: 0 30px ;
padding: 0 25px ;
}
}
@@ -122,6 +131,7 @@
h4{
font-size: 29px;
width: 350px;
}
}

3
style/_seventh-part.scss
View File

@@ -1,7 +1,7 @@
.seventh-part {
min-height: 63vh;
min-height: 55vh;
background-image: url('/assets/images/image44.jpg');
background-size: cover;
position: relative;
@@ -13,7 +13,6 @@
@include button;
background-color: transparent;
border: solid 2px white;
// margin-bottom: 40px;
}
.learn-more:hover {
background-color: white;

8
style/_sixth-part.scss
View File

@@ -50,6 +50,9 @@
}
padding: 50px 0 100px 0;
.profile-text{
p{
width: 330px;
}
margin-bottom: 20px;
}
}
@@ -64,6 +67,11 @@
h4{
font-size: 29px !important;
}
.profile-text{
p{
width: 538px;
}
}
}
}
}

35
style/style.css
View File

@@ -101,6 +101,10 @@ input::placeholder {
font-size: 14px;
}
.logo-img {
cursor: pointer;
}
@media only screen and (min-width: 768px) {
form {
width: 229px !important;
@@ -167,6 +171,11 @@ input::placeholder {
header {
padding: 0 96px !important;
}
.logo-img {
width: 174px;
height: 39px;
cursor: pointer;
}
}
@font-face {
font-family: "MerriweatherSans";
@@ -405,12 +414,12 @@ span {
width: 80px;
height: 80px;
cursor: pointer;
margin-bottom: 10px;
margin-bottom: 18px;
font-size: 50px;
}
.card h4 {
text-align: center;
width: 300px;
width: 350px;
padding-bottom: 19px;
font-size: 21px;
font-weight: 400;
@@ -424,7 +433,7 @@ span {
}
.card p {
text-align: center;
padding-top: 17px;
padding-top: 17px !important;
font-family: MerriweatherSans;
color: #777777;
letter-spacing: 0;
@@ -450,6 +459,7 @@ span {
box-shadow: none;
outline: none;
color: white;
margin-bottom: 0px !important;
}
.view-more:hover {
@@ -465,9 +475,13 @@ span {
.card p {
padding: 0 30px;
}
.card h4 {
width: 300px;
}
}
@media only screen and (min-width: 992px) {
.second-part {
min-height: 80vh;
padding-top: 70px;
padding-bottom: 120px;
}
@@ -478,13 +492,14 @@ span {
font-size: 21px;
}
.second-part .card p {
padding: 0 30px;
padding: 0 25px;
}
.second-part h2 {
font-size: 48px;
}
.second-part h4 {
font-size: 29px;
width: 350px;
}
}
.third-part {
@@ -792,6 +807,9 @@ span {
.sixth-part .profile-text {
margin-bottom: 20px;
}
.sixth-part .profile-text p {
width: 330px;
}
}
@media only screen and (min-width: 992px) {
.sixth-part .headline-card h2 {
@@ -800,9 +818,12 @@ span {
.sixth-part .headline-card h4 {
font-size: 29px !important;
}
.sixth-part .headline-card .profile-text p {
width: 538px;
}
}
.seventh-part {
min-height: 63vh;
min-height: 55vh;
background-image: url("/assets/images/image44.jpg");
background-size: cover;
position: relative;
@@ -910,10 +931,10 @@ span {
font-family: MerriweatherSans;
}
.form .input-text::-moz-placeholder {
color: #777777 !important;
color: #31353d !important;
}
.form .input-text::placeholder {
color: #777777 !important;
color: #31353d !important;
}
.form .form-container-bot {
position: relative;

2
style/style.css.map
View File

File diff suppressed because one or more lines are too long