more home page styling

This commit is contained in:
Idaapayo 2021-05-21 18:26:00 +03:00
parent 0d9473f564
commit 8640b07b2a
5 changed files with 92 additions and 26 deletions

View File

@ -1,9 +1,6 @@
.row-one-words{
text-align: center;
font-size: 40px;
padding-top: 100px;
padding-left: 150px;
padding-right: 150px;
}
.row-one-img{
padding: 20px;
@ -11,8 +8,39 @@
.height-row{
height: 60%;
}
/*.wrapper-col{*/
/* !*left: 25%; !important;*!*/
/* padding-right: 40px; !important;*/
/* padding-left: 40px; !important;*/
/*}*/
.img-style{
padding-left: 180px;
padding-top: 60px;
max-height: 700px;
max-width: 700px;
}
.wrapper-col{
margin-top: 100px;
margin-left: 150px;
border-style: solid;
border-color: #ffffff;
box-sizing: border-box;
max-height: 400px;
max-width: 300px;
}
@media only screen and (max-width: 480px){
.img-style{
padding-left: 20px;
padding-top: 10px;
max-height: 400px;
max-width: 400px;
}
.row-one-words{
font-size: 30px;
}
.wrapper-col{
margin-top: 20px;
margin-left: 70px;
/*margin-right: 20px;*/
max-width: 200px;
max-height: 400px;
border-color: #ff4c85;
}
}

View File

@ -8,11 +8,11 @@
{% block content %}
<div class="container-fluid">
<div class="row height-row">
<div class="col-6">
<img src="{{SITEURL}}/theme/images/home-imgs/home-img1.gif" class="img-fluid" alt="img-gif" >
<div class="row gx-0 height-row">
<div class="col-lg-6 col-md-12 col-sm-12">
<img src="{{SITEURL}}/theme/images/home-imgs/home-img1.gif" class=" img-fluid img-style" alt="img-gif" >
</div>
<div class="col-6 px-5">
<div class="col-lg-6 col-md-12 col-sm-12">
<div class="wrapper-col">
<p class="row-one-words">Prospering economies built by thriving communities</p>
<img class="img-fluid mx-auto d-block row-one-img" src="{{SITEURL}}/theme/images/home-imgs/home-logo.webp">

View File

@ -50,11 +50,11 @@
<!--</div>-->
<div class="container-fluid">
<div class="row height-row">
<div class="col-6">
<img src="../theme/images/home-imgs/home-img1.gif" class="img-fluid" alt="img-gif" >
<div class="row gx-0 height-row">
<div class="col-lg-6 col-md-12 col-sm-12">
<img src="../theme/images/home-imgs/home-img1.gif" class=" img-fluid img-style" alt="img-gif" >
</div>
<div class="col-6 px-5">
<div class="col-lg-6 col-md-12 col-sm-12">
<div class="wrapper-col">
<p class="row-one-words">Prospering economies built by thriving communities</p>
<img class="img-fluid mx-auto d-block row-one-img" src="../theme/images/home-imgs/home-logo.webp">

View File

@ -1,9 +1,6 @@
.row-one-words{
text-align: center;
font-size: 40px;
padding-top: 100px;
padding-left: 150px;
padding-right: 150px;
}
.row-one-img{
padding: 20px;
@ -11,8 +8,39 @@
.height-row{
height: 60%;
}
/*.wrapper-col{*/
/* !*left: 25%; !important;*!*/
/* padding-right: 40px; !important;*/
/* padding-left: 40px; !important;*/
/*}*/
.img-style{
padding-left: 180px;
padding-top: 60px;
max-height: 700px;
max-width: 700px;
}
.wrapper-col{
margin-top: 100px;
margin-left: 150px;
border-style: solid;
border-color: #ffffff;
box-sizing: border-box;
max-height: 400px;
max-width: 300px;
}
@media only screen and (max-width: 480px){
.img-style{
padding-left: 20px;
padding-top: 10px;
max-height: 400px;
max-width: 400px;
}
.row-one-words{
font-size: 30px;
}
.wrapper-col{
margin-top: 20px;
margin-left: 70px;
/*margin-right: 20px;*/
max-width: 200px;
max-height: 400px;
border-color: #ff4c85;
}
}

View File

@ -1,9 +1,19 @@
.row-one-words{
text-align: center;
font-size: 40px;
padding-top: 100px;
padding-left: 150px;
padding-right: 150px;
}
.row-one-img{
padding: 20px;
/*padding-left: 20px;*/
/*padding-right: 20px;*/
}
.height-row{
height: 60%;
}
.img-style{
height: 400px;
width: 400px;
}
/*.wrapper-col{*/