diff --git a/imac.d0e0225a.jpeg b/imac.d0e0225a.jpeg new file mode 100644 index 0000000000..1f1a90f1dc Binary files /dev/null and b/imac.d0e0225a.jpeg differ diff --git a/index.b9b409e5.css b/index.b9b409e5.css new file mode 100644 index 0000000000..ef965c57d3 --- /dev/null +++ b/index.b9b409e5.css @@ -0,0 +1,2 @@ +@import "https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";.page{margin:0}body{margin:0;font-family:Roboto,sans-serif}.product-card{box-sizing:border-box;text-align:center;background-color:#fff;border:1px solid #f3f3f3;border-radius:5px;flex-flow:column wrap;align-items:center;width:200px;height:412px;margin:20px;padding:32px 0 8px;display:flex}.product-card__bg{background-image:url(imac.202c52ff.jpeg);background-position:50%;background-size:cover;width:158px;height:134px;margin-bottom:40px;margin-left:0}.product-card__details{width:166px;height:auto}.product-card__title{text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none;color:#060b35;width:166px;margin:0;font-size:12px;font-weight:500;line-height:18px}.product-card__code{text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none;color:#616070;margin-top:5px;margin-bottom:14px;font-size:10px;font-weight:400;line-height:14px}.product-card__rating{text-align:right;text-underline-position:from-font;text-decoration-skip-ink:none;color:#060b35;justify-content:space-between;align-items:center;width:167px;margin:12px 0 3px;padding-left:2px;font-family:Roboto,sans-serif;font-size:10px;font-weight:400;line-height:14px;display:flex}.product-card__reviews{box-sizing:border-box;text-align:right;width:53px;margin-right:0;padding-top:4px;padding-bottom:0;padding-left:3px;display:flex}.product-card__price{justify-content:space-between;width:166px;margin-top:23px;margin-bottom:15px;display:flex}.product-card__price-title{text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none;color:#616070;margin-bottom:-1px;font-size:12px;font-weight:400;line-height:18px}.product-card__price-sum{box-sizing:border-box;text-align:right;text-align:end;text-underline-position:from-font;text-decoration-skip-ink:none;color:#060b35;padding-top:1px;font-size:16px;font-weight:700;line-height:18px}.product-card__link{color:#fff;text-align:center;text-underline-position:from-font;text-decoration-skip-ink:none;text-transform:uppercase;background-color:#00acdc;border-style:none;border-radius:5px;justify-content:center;align-items:center;width:166px;height:40px;margin:0 auto;font-family:Roboto,sans-serif;font-size:14px;font-weight:700;line-height:16px;text-decoration:none;display:flex}.product-card__link:hover{color:#00acdc;background-color:#fff;border:1px solid #00acdc}.product-card__stars{justify-content:left;align-items:center;width:96px;height:13px;margin:0;padding:0;list-style:none;display:flex}.product-card__star{box-sizing:border-box;background-image:url(star.0aa15587.svg);background-position:50%;background-repeat:no-repeat;background-size:contain;width:13px;height:13px;margin-left:0;margin-right:7px;padding:0;display:flex}.product-card__star:last-child{margin-right:0}.product-card__star:nth-child(-n+4){background-image:url(star-active.1a24ce14.svg);background-position:50%;background-repeat:no-repeat;background-size:contain} +/*# sourceMappingURL=index.b9b409e5.css.map */ diff --git a/index.b9b409e5.css.map b/index.b9b409e5.css.map new file mode 100644 index 0000000000..7429678e61 --- /dev/null +++ b/index.b9b409e5.css.map @@ -0,0 +1 @@ +{"mappings":"A,yJEAA,eAIA,4CCJA,qOAcE,oLAUA,+CAKA,wLAYA,oMAYA,gTAiBA,uJAWA,+GAOE,4LAWA,6NAcF,uYAqBE,uFCtIJ,oIAWA,4PAcA,8CAIA","sources":["index.b9b409e5.css","H6WaRW","src/styles/index.scss","src/styles/box/card.scss","src/styles/box/stars.scss"],"sourcesContent":["@import \"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap\";\n.page {\n margin: 0;\n}\n\nbody {\n margin: 0;\n font-family: Roboto, sans-serif;\n}\n\n.product-card {\n box-sizing: border-box;\n text-align: center;\n background-color: #fff;\n border: 1px solid #f3f3f3;\n border-radius: 5px;\n flex-flow: column wrap;\n align-items: center;\n width: 200px;\n height: 412px;\n margin: 20px;\n padding: 32px 0 8px;\n display: flex;\n}\n\n.product-card__bg {\n background-image: url(\"imac.202c52ff.jpeg\");\n background-position: center;\n background-size: cover;\n width: 158px;\n height: 134px;\n margin-bottom: 40px;\n margin-left: 0;\n}\n\n.product-card__details {\n width: 166px;\n height: auto;\n}\n\n.product-card__title {\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n width: 166px;\n margin: 0;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.product-card__code {\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #616070;\n margin-top: 5px;\n margin-bottom: 14px;\n font-size: 10px;\n font-weight: 400;\n line-height: 14px;\n}\n\n.product-card__rating {\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n justify-content: space-between;\n align-items: center;\n width: 167px;\n margin: 12px 0 3px;\n padding-left: 2px;\n font-family: Roboto, sans-serif;\n font-size: 10px;\n font-weight: 400;\n line-height: 14px;\n display: flex;\n}\n\n.product-card__reviews {\n box-sizing: border-box;\n text-align: right;\n width: 53px;\n margin-right: 0;\n padding-top: 4px;\n padding-bottom: 0;\n padding-left: 3px;\n display: flex;\n}\n\n.product-card__price {\n justify-content: space-between;\n width: 166px;\n margin-top: 23px;\n margin-bottom: 15px;\n display: flex;\n}\n\n.product-card__price-title {\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #616070;\n margin-bottom: -1px;\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.product-card__price-sum {\n box-sizing: border-box;\n text-align: right;\n text-align: end;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n padding-top: 1px;\n font-size: 16px;\n font-weight: 700;\n line-height: 18px;\n}\n\n.product-card__link {\n color: #fff;\n text-align: center;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n text-transform: uppercase;\n background-color: #00acdc;\n border-style: none;\n border-radius: 5px;\n justify-content: center;\n align-items: center;\n width: 166px;\n height: 40px;\n margin: 0 auto;\n font-family: Roboto, sans-serif;\n font-size: 14px;\n font-weight: 700;\n line-height: 16px;\n text-decoration: none;\n display: flex;\n}\n\n.product-card__link:hover {\n color: #00acdc;\n background-color: #fff;\n border: 1px solid #00acdc;\n}\n\n.product-card__stars {\n justify-content: left;\n align-items: center;\n width: 96px;\n height: 13px;\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n}\n\n.product-card__star {\n box-sizing: border-box;\n background-image: url(\"star.0aa15587.svg\");\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n width: 13px;\n height: 13px;\n margin-left: 0;\n margin-right: 7px;\n padding: 0;\n display: flex;\n}\n\n.product-card__star:last-child {\n margin-right: 0;\n}\n\n.product-card__star:nth-child(-n+4) {\n background-image: url(\"star-active.1a24ce14.svg\");\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n}\n/*# sourceMappingURL=index.b9b409e5.css.map */\n",null,".page {\n margin: 0;\n}\n\nbody {\n margin: 0;\n font-family: Roboto, sans-serif;\n}\n\n@import 'box/variables';\n@import 'https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap';\n@import 'box/card';\n@import 'box/stars';\n",".product-card {\n box-sizing: border-box;\n width: $card-width;\n height: 412px;\n display: flex;\n align-items: center;\n flex-flow: column wrap;\n border: 1px solid #f3f3f3;\n border-radius: 5px;\n background-color: #fff;\n text-align: center;\n margin: 20px;\n padding: 32px 0 8px;\n\n &__bg {\n width: 158px;\n height: 134px;\n background-image: url('../images/imac.jpeg');\n background-size: cover;\n background-position: center;\n margin-left: 0;\n margin-bottom: 40px;\n }\n\n &__details {\n width: 166px;\n height: auto;\n }\n\n &__title {\n width: 166px;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n margin: 0;\n }\n\n &__code {\n font-size: 10px;\n font-weight: 400;\n line-height: 14px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #616070;\n margin-top: 5px;\n margin-bottom: 14px;\n }\n\n &__rating {\n width: 167px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin: 12px 0 3px;\n padding-left: 2px;\n font-family: Roboto, sans-serif;\n font-size: 10px;\n font-weight: 400;\n line-height: 14px;\n text-align: right;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n }\n\n &__reviews {\n width: 53px;\n display: flex;\n box-sizing: border-box;\n text-align: right;\n padding-top: 4px;\n padding-bottom: 0;\n padding-left: 3px;\n margin-right: 0;\n }\n\n &__price {\n width: 166px;\n display: flex;\n justify-content: space-between;\n margin-top: 23px;\n margin-bottom: 15px;\n\n &-title {\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #616070;\n margin-bottom: -1px;\n }\n\n &-sum {\n box-sizing: border-box;\n font-size: 16px;\n font-weight: 700;\n line-height: 18px;\n text-align: right;\n text-align: end;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n color: #060b35;\n padding-top: 1px;\n }\n }\n\n &__link {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 166px;\n height: 40px;\n border-style: none;\n border-radius: 5px;\n margin: 0 auto;\n color: #fff;\n text-decoration: none;\n background-color: #00acdc;\n font-family: Roboto, sans-serif;\n font-size: 14px;\n font-weight: 700;\n line-height: 16px;\n text-align: center;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n text-transform: uppercase;\n\n &:hover {\n color: #00acdc;\n background-color: #fff;\n border: 1px solid #00acdc;\n }\n }\n}\n",".product-card__stars {\n width: 96px;\n display: flex;\n height: $star-height;\n align-items: center;\n justify-content: left;\n list-style: none;\n padding: 0;\n margin: 0;\n}\n\n.product-card__star {\n display: flex;\n background-image: $star-bg;\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n box-sizing: border-box;\n width: $star-width;\n height: $star-height;\n padding: 0;\n margin-right: 7px;\n margin-left: 0;\n}\n\n.product-card__star:last-child {\n margin-right: 0;\n}\n\n.product-card__star:nth-child(-n + 4) {\n background-image: $star-active-bg;\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n}\n"],"names":[],"version":3,"file":"index.b9b409e5.css.map"} \ No newline at end of file diff --git a/index.e378193d.css b/index.e378193d.css new file mode 100644 index 0000000000..da6f094ee2 --- /dev/null +++ b/index.e378193d.css @@ -0,0 +1,176 @@ +@import "https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"; +.page { + margin: 0; +} + +body { + margin: 0; + font-family: Roboto, sans-serif; +} + +.product-card { + box-sizing: border-box; + text-align: center; + background-color: #fff; + border: 1px solid #f3f3f3; + border-radius: 5px; + flex-flow: column wrap; + align-items: center; + width: 200px; + height: 412px; + margin: 20px; + padding: 32px 0 7px; + display: flex; +} + +.product-card__bg { + width: 160px; + height: 134px; + margin: 0 auto 40px; + padding: 0 19px; +} + +.product-card__title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #060b35; + width: 166px; + margin: 0; + font-size: 12px; + font-weight: 500; + line-height: 18px; +} + +.product-card__code { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #616070; + margin-top: 5px; + margin-bottom: 2px; + margin-right: 68px; + font-size: 10px; + font-weight: 400; + line-height: 14px; +} + +.product-card__rating { + text-align: right; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #060b35; + justify-content: space-between; + align-items: center; + width: 169px; + margin: 12px 0 2px 3px; + font-family: Roboto, sans-serif; + font-size: 10px; + font-weight: 400; + line-height: 14px; + display: flex; +} + +.product-card__reviews { + box-sizing: border-box; + text-align: right; + width: 52px; + margin-left: 16px; + padding-top: 4px; + padding-bottom: 0; + padding-left: 2px; + display: flex; +} + +.product-card__price { + justify-content: space-between; + width: 166px; + margin-top: 21px; + margin-bottom: 15px; + display: flex; +} + +.product-card__price-title { + text-align: left; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #616070; + margin-bottom: -1px; + font-size: 12px; + font-weight: 400; + line-height: 18px; +} + +.product-card__price-sum { + box-sizing: border-box; + text-align: right; + text-align: end; + text-underline-position: from-font; + text-decoration-skip-ink: none; + color: #060b35; + padding-top: 1px; + font-size: 16px; + font-weight: 700; + line-height: 18px; +} + +.product-card__link { + color: #fff; + text-align: center; + text-underline-position: from-font; + text-decoration-skip-ink: none; + text-transform: uppercase; + background-color: #00acdc; + border-style: none; + border-radius: 5px; + justify-content: center; + align-items: center; + width: 166px; + height: 40px; + margin: 0 auto; + font-family: Roboto, sans-serif; + font-size: 14px; + font-weight: 700; + line-height: 16px; + text-decoration: none; + display: flex; +} + +.product-card__link:hover { + color: #00acdc; + background-color: #fff; + border: 1px solid #00acdc; +} + +.product-card__stars { + justify-content: left; + align-items: center; + width: 100px; + height: 13px; + margin: 0 auto; + padding: 0; + list-style: none; + display: flex; +} + +.product-card__star { + box-sizing: border-box; + background-image: url("star.fa806e3c.svg"); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + width: 13px; + height: 13px; + margin-left: 1px; + margin-right: 6px; + padding: 0; + display: flex; +} + +.product-card__star:nth-child(-n+4) { + background-image: url("star-active.2be54011.svg"); + background-position: center; + background-repeat: no-repeat; + background-size: contain; +} +/*# sourceMappingURL=index.e378193d.css.map */ diff --git a/index.e378193d.css.map b/index.e378193d.css.map new file mode 100644 index 0000000000..ff5846e817 --- /dev/null +++ b/index.e378193d.css.map @@ -0,0 +1 @@ +{"mappings":";ACAA;;;;AAIA;;;;;ACJA;;;;;;;;;;;;;;;AAcE;;;;;;;AAQA;;;;;;;;;;;;AAYA;;;;;;;;;;;;;AAaA;;;;;;;;;;;;;;;;AAgBA;;;;;;;;;;;AAWA;;;;;;;;AAOE;;;;;;;;;;;AAWA;;;;;;;;;;;;;AAcF;;;;;;;;;;;;;;;;;;;;;;AAqBE;;;;;;AC/HJ;;;;;;;;;;;AAWA;;;;;;;;;;;;;;AAcA","sources":["H6WaRW","src/styles/index.scss","src/styles/box/card.scss","src/styles/box/stars.scss"],"sourcesContent":[null,".page {\n margin: 0;\n}\n\nbody {\n margin: 0;\n font-family: Roboto, sans-serif;\n}\n\n@import 'box/variables';\n@import 'https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap';\n@import 'box/card';\n@import 'box/stars';\n",null,null],"names":[],"version":3,"file":"index.e378193d.css.map","sourceRoot":"/__parcel_source_root/"} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000000..f4cdf98058 --- /dev/null +++ b/index.html @@ -0,0 +1,37 @@ + + +
+ + +