ivabus/www
1
0
Fork 0
mirror of https://github.com/ivabus/www synced 2024-11-25 21:45:06 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Grid system for products page

Browse source
This commit is contained in:
Thomas Smith 2022-10-30 17:12:58 -04:00
parent cdcd30f70d
commit b049a7ce0f
4 changed files with 27 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
src/static/Images/prouct-large-grid-generative-art.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 86 KiB

BIN
src/static/Images/prouct-medium-grid-generative-art.gif Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 57 KiB

24
src/static/css/products.css
View file

@ -16,14 +16,38 @@
@media only screen and (min-width: 992px) and (max-width: 1200px) { @media only screen and (min-width: 992px) and (max-width: 1200px) {
.product-hero-section{
background-image: url("/Images/prouct-large-grid-generative-art.gif") !important;
background-attachment: scroll;
background-position: top;
background-repeat: repeat;
background-size: cover;
}
} }
@media only screen and (min-width: 768px) and (max-width: 992px) { @media only screen and (min-width: 768px) and (max-width: 992px) {
.product-hero-section{
background-image: url("/Images/prouct-large-grid-generative-art.gif") !important;
background-attachment: scroll;
background-position: top;
background-repeat: repeat;
background-size: cover;
}
} }
@media only screen and (min-width: 576px) and (max-width: 768px) { @media only screen and (min-width: 576px) and (max-width: 768px) {
.product-hero-section{
background-image: url("/Images/prouct-medium-grid-generative-art.gif") !important;
background-attachment: scroll;
background-position: top;
background-repeat: repeat;
background-size: cover;
}
} }
@media only screen and (max-width: 576px) { @media only screen and (max-width: 576px) {

6
src/static/css/typography.css
View file

@ -200,10 +200,10 @@ a:hover{
@media only screen and (min-width: 576px) and (max-width: 768px){ @media only screen and (min-width: 576px) and (max-width: 768px){
h1{ h1{
font-size: 18.5vw; font-size: 14vw;
line-height: 20vw; line-height: 20vw;
margin-top: 1vw; margin-top: 2vw;
margin-left: -2vw; margin-left: -0.7vw;
} }
h2{ h2{