Project-Pro/cdnPRO
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add initial HTML and CSS files for responsive design

Browse Source
This commit is contained in:
Jacek Pyziak
2024-12-16 18:44:40 +01:00
parent 9dac017c03
commit baa5befc99
4 changed files with 170 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
ocelio.pl/index.html Normal file
View File

1
ocelio.pl/style.css Normal file
View File

@@ -0,0 +1 @@
@media(max-width: 767px){#box_mainproducts .product{padding:0 !important}#box_mainproducts .product .product-inner-wrap{padding:15px !important}#box_mainproducts .product .product-inner-wrap .price{padding-top:0 !important;margin-top:0 !important}.logo-bar{display:none}.menu{display:grid;grid-template-columns:150px 1fr}.menu:before{display:none !important}.menu .link-logo{display:block;padding:0 10px}.menu .innermenu{border:0 !important}}#box_mainproducts .product{padding:15px !important;margin:0 !important;height:auto !important}#box_mainproducts .product .prodname{margin:0 !important}#box_mainproducts .product .productname{font-size:15px !important;font-weight:600 !important;padding-top:0 !important}#box_mainproducts .product .price em{font-size:20px !important}#box_specialoffer .product>a,#box_lastadded .product>a{display:block;padding:15px 15px 0 15px}#box_specialoffer .product>a .productnamewrap,#box_lastadded .product>a .productnamewrap{margin-bottom:0;height:auto !important;padding-bottom:10px}#box_specialoffer .product>a .productnamewrap .productname,#box_lastadded .product>a .productnamewrap .productname{font-size:15px !important;font-weight:600 !important}#box_specialoffer .product .price,#box_lastadded .product .price{padding:0 15px;margin:0}#box_specialoffer .product .price p em,#box_lastadded .product .price p em{font-size:20px !important}#box_specialoffer .product .price .price__inactive,#box_lastadded .product .price .price__inactive{font-size:13px !important}#box_specialoffer .product form,#box_lastadded .product form{padding:15px 15px 0}#box_newsletter:before{background:rgba(0,0,0,.6);width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;display:block}#box_newsletter .boxhead{z-index:2;position:relative}#box_newsletter .boxhead span{color:#fff !important}#box_newsletter .innerbox{z-index:2;position:relative}#box_newsletter .innerbox h5{color:#fff;font-weight:400 !important;letter-spacing:0 !important}#box_newsletter .innerbox form input{border:0 !important}#box_newsletter .innerbox form fieldset{color:#fff;font-weight:400 !important}#box_custom40{padding:0 25px}#box_custom40 a.read-more{font-weight:600;color:#f59e01}#box_custom40 .more{display:none}#box_custom40 .more.open{display:block}#box_custom40 p{font-size:13px;line-height:1.25 !important}/*# sourceMappingURL=style.css.map */

1
ocelio.pl/style.css.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["style.scss"],"names":[],"mappings":"AAAA,yBAEI,2BACE,oBAAA,CAEA,+CACE,uBAAA,CAEA,sDACE,wBAAA,CACA,uBAAA,CAMR,UACE,YAAA,CAGF,MACE,YAAA,CACA,+BAAA,CAEA,aACE,uBAAA,CAGF,iBACE,aAAA,CACA,cAAA,CAGF,iBACE,mBAAA,CAAA,CAMJ,2BACE,uBAAA,CACA,mBAAA,CACA,sBAAA,CAEA,qCACE,mBAAA,CAGF,wCACE,yBAAA,CACA,0BAAA,CACA,wBAAA,CAIA,qCACE,yBAAA,CASJ,uDACE,aAAA,CACA,wBAAA,CAEA,yFACE,eAAA,CACA,sBAAA,CACA,mBAAA,CAEA,mHACE,yBAAA,CACA,0BAAA,CAKN,iEACE,cAAA,CACA,QAAA,CAGE,2EACE,yBAAA,CAIJ,mGACE,yBAAA,CAIJ,6DACE,mBAAA,CAMJ,uBACE,yBAAA,CACA,UAAA,CACA,WAAA,CACA,iBAAA,CACA,KAAA,CACA,MAAA,CACA,SAAA,CACA,aAAA,CAGF,yBACE,SAAA,CACA,iBAAA,CAEA,8BACE,qBAAA,CAIJ,0BACE,SAAA,CACA,iBAAA,CAEA,6BACE,UAAA,CACA,0BAAA,CACA,2BAAA,CAIA,qCACE,mBAAA,CAGF,wCACE,UAAA,CACA,0BAAA,CAMR,cACE,cAAA,CAEA,0BACE,eAAA,CACA,aAAA,CAGF,oBACE,YAAA,CAEA,yBACE,aAAA,CAIJ,gBACE,cAAA,CACA,2BAAA","file":"style.css","sourcesContent":["@media(max-width: 767px) {\r\n #box_mainproducts {\r\n .product {\r\n padding: 0 !important;\r\n\r\n .product-inner-wrap {\r\n padding: 15px !important;\r\n\r\n .price {\r\n padding-top: 0 !important;\r\n margin-top: 0 !important;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .logo-bar {\r\n display: none;\r\n }\r\n\r\n .menu {\r\n display: grid;\r\n grid-template-columns: 150px 1fr;\r\n\r\n &:before {\r\n display: none !important;\r\n }\r\n\r\n .link-logo {\r\n display: block;\r\n padding: 0 10px;\r\n }\r\n\r\n .innermenu {\r\n border: 0 !important;\r\n }\r\n }\r\n}\r\n\r\n#box_mainproducts {\r\n .product {\r\n padding: 15px !important;\r\n margin: 0 !important;\r\n height: auto !important;\r\n\r\n .prodname {\r\n margin: 0 !important;\r\n }\r\n\r\n .productname {\r\n font-size: 15px !important;\r\n font-weight: 600 !important;\r\n padding-top: 0 !important;\r\n }\r\n\r\n .price {\r\n em {\r\n font-size: 20px !important;\r\n }\r\n }\r\n }\r\n}\r\n\r\n#box_specialoffer,\r\n#box_lastadded {\r\n .product {\r\n >a {\r\n display: block;\r\n padding: 15px 15px 0 15px;\r\n\r\n .productnamewrap {\r\n margin-bottom: 0;\r\n height: auto !important;\r\n padding-bottom: 10px;\r\n\r\n .productname {\r\n font-size: 15px !important;\r\n font-weight: 600 !important;\r\n }\r\n }\r\n }\r\n\r\n .price {\r\n padding: 0 15px;\r\n margin: 0;\r\n\r\n p {\r\n em {\r\n font-size: 20px !important;\r\n }\r\n }\r\n\r\n .price__inactive {\r\n font-size: 13px !important;\r\n }\r\n }\r\n\r\n form {\r\n padding: 15px 15px 0;\r\n }\r\n }\r\n}\r\n\r\n#box_newsletter {\r\n &:before {\r\n background: rgba(0, 0, 0, 0.6);\r\n width: 100%;\r\n height: 100%;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n z-index: 1;\r\n display: block;\r\n }\r\n\r\n .boxhead {\r\n z-index: 2;\r\n position: relative;\r\n\r\n span {\r\n color: #FFF !important;\r\n }\r\n }\r\n\r\n .innerbox {\r\n z-index: 2;\r\n position: relative;\r\n\r\n h5 {\r\n color: #FFF;\r\n font-weight: 400 !important;\r\n letter-spacing: 0 !important;\r\n }\r\n\r\n form {\r\n input {\r\n border: 0 !important;\r\n }\r\n\r\n fieldset {\r\n color: #FFF;\r\n font-weight: 400 !important;\r\n }\r\n }\r\n }\r\n}\r\n\r\n#box_custom40 {\r\n padding: 0 25px;\r\n\r\n a.read-more {\r\n font-weight: 600;\r\n color: #f59e01;\r\n }\r\n\r\n .more {\r\n display: none;\r\n\r\n &.open {\r\n display: block;\r\n }\r\n }\r\n\r\n p {\r\n font-size: 13px;\r\n line-height: 1.25 !important;\r\n }\r\n}"]}

168
ocelio.pl/style.scss Normal file
View File

@@ -0,0 +1,168 @@
@media(max-width: 767px) {
#box_mainproducts {
.product {
padding: 0 !important;
.product-inner-wrap {
padding: 15px !important;
.price {
padding-top: 0 !important;
margin-top: 0 !important;
}
}
}
}
.logo-bar {
display: none;
}
.menu {
display: grid;
grid-template-columns: 150px 1fr;
&:before {
display: none !important;
}
.link-logo {
display: block;
padding: 0 10px;
}
.innermenu {
border: 0 !important;
}
}
}
#box_mainproducts {
.product {
padding: 15px !important;
margin: 0 !important;
height: auto !important;
.prodname {
margin: 0 !important;
}
.productname {
font-size: 15px !important;
font-weight: 600 !important;
padding-top: 0 !important;
}
.price {
em {
font-size: 20px !important;
}
}
}
}
#box_specialoffer,
#box_lastadded {
.product {
>a {
display: block;
padding: 15px 15px 0 15px;
.productnamewrap {
margin-bottom: 0;
height: auto !important;
padding-bottom: 10px;
.productname {
font-size: 15px !important;
font-weight: 600 !important;
}
}
}
.price {
padding: 0 15px;
margin: 0;
p {
em {
font-size: 20px !important;
}
}
.price__inactive {
font-size: 13px !important;
}
}
form {
padding: 15px 15px 0;
}
}
}
#box_newsletter {
&:before {
background: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
display: block;
}
.boxhead {
z-index: 2;
position: relative;
span {
color: #FFF !important;
}
}
.innerbox {
z-index: 2;
position: relative;
h5 {
color: #FFF;
font-weight: 400 !important;
letter-spacing: 0 !important;
}
form {
input {
border: 0 !important;
}
fieldset {
color: #FFF;
font-weight: 400 !important;
}
}
}
}
#box_custom40 {
padding: 0 25px;
a.read-more {
font-weight: 600;
color: #f59e01;
}
.more {
display: none;
&.open {
display: block;
}
}
p {
font-size: 13px;
line-height: 1.25 !important;
}
}