From 35094a96e1071e6c4dca114ed727adff5ee7b992 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Tue, 6 Dec 2022 08:44:01 +0100 Subject: [PATCH] wait #5624 @0.5 --- Michelin/Michelin.zip | Bin 19928 -> 20004 bytes Michelin/index.html | 2 +- Michelin/style.css | 13 +- Michelin/style.css.map | 2 +- Michelin/style.less | 372 +++++++++++++++++++++-------------------- 5 files changed, 207 insertions(+), 182 deletions(-) diff --git a/Michelin/Michelin.zip b/Michelin/Michelin.zip index a11481f5f210391a518bd8106c9ea7412e021392..1ca800b8d642dce3cb120840aae76f23a43cde1b 100644 GIT binary patch delta 2031 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 P7LyQ84hHQ;000009T}sA diff --git a/Michelin/index.html b/Michelin/index.html index 9a3b2c2..6b8bfa3 100644 --- a/Michelin/index.html +++ b/Michelin/index.html @@ -50,7 +50,7 @@
- + diff --git a/Michelin/style.css b/Michelin/style.css index 836051f..024a231 100644 --- a/Michelin/style.css +++ b/Michelin/style.css @@ -3,6 +3,17 @@ margin: 0; box-sizing: border-box; } +::-webkit-scrollbar { + width: 9px; +} +::-webkit-scrollbar-track { + background: transparent; +} +::-webkit-scrollbar-thumb { + background-color: rgba(155, 155, 155, 0.5); + border-radius: 20px; + border: transparent; +} body { font-family: "Open Sans", Arial, Helsans-serif, sans-serif; color: #fff; @@ -172,7 +183,7 @@ header ul li.active.last::after { display: none; } #holder { - width: 320px; + width: 100%; margin: 0 auto; overflow: hidden; position: relative; diff --git a/Michelin/style.css.map b/Michelin/style.css.map index ef12334..b3db01a 100644 --- a/Michelin/style.css.map +++ b/Michelin/style.css.map @@ -1 +1 @@ -{"version":3,"sources":["style.less"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file +{"version":3,"sources":["style.less"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file diff --git a/Michelin/style.less b/Michelin/style.less index 1e97eb2..64021c2 100644 --- a/Michelin/style.less +++ b/Michelin/style.less @@ -1,221 +1,235 @@ * { - padding: 0; - margin: 0; - box-sizing: border-box; + padding: 0; + margin: 0; + box-sizing: border-box; +} + +::-webkit-scrollbar { + width: 9px; +} + +::-webkit-scrollbar-track { + background: transparent; +} + +::-webkit-scrollbar-thumb { + background-color: rgba(155, 155, 155, 0.5); + border-radius: 20px; + border: transparent; } body { - font-family: "Open Sans", Arial, Helsans-serif, sans-serif; - color: #fff; - background-color: #004f9e; - font-size: 16px; + font-family: "Open Sans", Arial, Helsans-serif, sans-serif; + color: #fff; + background-color: #004f9e; + font-size: 16px; } h2 { - font-size: 16px; - font-weight: 400; - height: 60px; - padding: 18px 30px; + font-size: 16px; + font-weight: 400; + height: 60px; + padding: 18px 30px; } form { - .field { - display: none; - padding: 40px 0; - - &.select { - padding: 40px 20px; - } - } - - select { - width: 100%; - padding: 20px; - border: 0; - font-size: 16px; - } + .field { + display: none; + padding: 40px 0; + + &.select { + padding: 40px 20px; + } + } + + select { + width: 100%; + padding: 20px; + border: 0; + font-size: 16px; + } } #noresult { - padding: 40px 20px; + padding: 40px 20px; } #results { - padding: 40px 0; + padding: 40px 0; - li { - .list-item(); - } + li { + .list-item(); + } } .selectlist { - li { - .list-item(); + li { + .list-item(); - label { - input { - visibility: hidden; - position: absolute; - } + label { + input { + visibility: hidden; + position: absolute; + } - img { - vertical-align: middle; - margin-right: 15px; - } + img { + vertical-align: middle; + margin-right: 15px; + } - height: 82px; + height: 82px; - &:after { - top: 33px; - } - } - } + &:after { + top: 33px; + } + } + } } header { - position: relative; - white-space: nowrap; - font-size: 0; - - ul { - display: inline; - - &.tyre, &.set { - display: none; - } - - li { - position: relative; - font-size: 16px; - display: inline-block; - width: 320px; - height: 50px; - list-style: none; - color: rgba(255, 255, 255, 0.2); - background-color: #004f9e; - background-image: linear-gradient(to left, #4974B8 0%, #004f9e 10%, #004f9e 90%, #4974B8 100%); - font-weight: bold; - padding: 14px 14px 14px 70px; - z-index: 2; - overflow: hidden; - - &.previous { - left: 30px; - } - - &.next { - padding-left: 14px; - left: -30px; - } - - &.active { - background-image: none; - background-color: #FCE500; - color: #000; - z-index: 1; - left: 0; - - &::after, &::before { - content: ""; - position: absolute; - top: -1px; - display: block; - height: 52px; - width: 26px; - - background-position: 0 0; - background-size: auto 100%; - - } - - &::after { - background-image: url("images/arrow-header-right.svg"); - right: 30px; - } - - &::before { - background-image: url("images/arrow-header-left.svg"); - left: 30px; - } - - &.first { - padding-left: 14px; - - &::before { - display: none; - } - } - - &.last { - &::after { - display: none; - } - } - } - } - } + position: relative; + white-space: nowrap; + font-size: 0; + + ul { + display: inline; + + &.tyre, &.set { + display: none; + } + + li { + position: relative; + font-size: 16px; + display: inline-block; + width: 320px; + height: 50px; + list-style: none; + color: rgba(255, 255, 255, 0.2); + background-color: #004f9e; + background-image: linear-gradient(to left, #4974B8 0%, #004f9e 10%, #004f9e 90%, #4974B8 100%); + font-weight: bold; + padding: 14px 14px 14px 70px; + z-index: 2; + overflow: hidden; + + &.previous { + left: 30px; + } + + &.next { + padding-left: 14px; + left: -30px; + } + + &.active { + background-image: none; + background-color: #FCE500; + color: #000; + z-index: 1; + left: 0; + + &::after, &::before { + content: ""; + position: absolute; + top: -1px; + display: block; + height: 52px; + width: 26px; + + background-position: 0 0; + background-size: auto 100%; + + } + + &::after { + background-image: url("images/arrow-header-right.svg"); + right: 30px; + } + + &::before { + background-image: url("images/arrow-header-left.svg"); + left: 30px; + } + + &.first { + padding-left: 14px; + + &::before { + display: none; + } + } + + &.last { + &::after { + display: none; + } + } + } + } + } } #holder { - width: 320px; - margin: 0 auto; - overflow: hidden; - position: relative; - padding-bottom: 20px; + width: 100%; + margin: 0 auto; + overflow: hidden; + position: relative; + padding-bottom: 20px; } #back { - cursor: pointer; - color: #fff; - text-decoration: none; - position: absolute; - left: 20px; - bottom: 20px; - - &:before { - content: ''; - display: inline-block; - width: 10px; - height: 16px; - background-image: url("images/back.svg"); - margin-right: 20px; - position: relative; - top: 1px - } + cursor: pointer; + color: #fff; + text-decoration: none; + position: absolute; + left: 20px; + bottom: 20px; + + &:before { + content: ''; + display: inline-block; + width: 10px; + height: 16px; + background-image: url("images/back.svg"); + margin-right: 20px; + position: relative; + top: 1px + } } .list-item { - list-style: none; - - a, label { - display: block; - padding: 15px 20px; - color: #fff; - text-decoration: none; - cursor: pointer; - position: relative; - transition: background-color 300ms; - - &:hover { - background-color: #4874b9; - } - - &::after { - content: ''; - position: absolute; - height: 15px; - width: 10px; - top: 18px; - right: 20px; - background-image: url("images/list.svg"); - } - } + list-style: none; + + a, label { + display: block; + padding: 15px 20px; + color: #fff; + text-decoration: none; + cursor: pointer; + position: relative; + transition: background-color 300ms; + + &:hover { + background-color: #4874b9; + } + + &::after { + content: ''; + position: absolute; + height: 15px; + width: 10px; + top: 18px; + right: 20px; + background-image: url("images/list.svg"); + } + } } #preload { - opacity: 0; - position: absolute; - pointer-events: none; + opacity: 0; + position: absolute; + pointer-events: none; } \ No newline at end of file -- 2.39.5