From 53262b4af37a3d17ae10a67b354eee60b8afa1f7 Mon Sep 17 00:00:00 2001 From: "Krasnikov.pro" Date: Mon, 11 Jul 2022 23:53:13 +0300 Subject: [PATCH] joker --- .../_block_selector_20220618153801.scss | 58 +++++++ .../_block_selector_20220711235011.scss | 59 +++++++ .../_block_selector_20220711235017.scss | 60 +++++++ .../_block_selector_20220711235027.scss | 59 +++++++ .../styles/_ingredients_20220711222549.scss | 91 +++++++++++ .../styles/_ingredients_20220711223021.scss | 91 +++++++++++ .../styles/_ingredients_20220711224900.scss | 91 +++++++++++ .../styles/_ingredients_20220711224904.scss | 91 +++++++++++ .../styles/_ingredients_20220711224908.scss | 91 +++++++++++ .../styles/_products_20220711225240.scss | 31 ++++ .../styles/_products_20220711230102.scss | 47 ++++++ .../styles/_products_20220711230143.scss | 47 ++++++ .../pizza/styles/index_20220711222608.scss | 141 +++++++++++++++++ .../pizza/styles/index_20220711222741.scss | 128 +++++++++++++++ .../pizza/styles/index_20220711222836.scss | 128 +++++++++++++++ .../pizza/styles/index_20220711224137.scss | 134 ++++++++++++++++ .../pizza/styles/index_20220711224155.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711224248.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711224556.scss | 141 +++++++++++++++++ .../pizza/styles/index_20220711224707.scss | 140 ++++++++++++++++ .../pizza/styles/index_20220711224759.scss | 140 ++++++++++++++++ .../pizza/styles/index_20220711225942.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711230609.scss | 138 ++++++++++++++++ .../pizza/styles/index_20220711230729.scss | 138 ++++++++++++++++ .../pizza/styles/index_20220711231054.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711232023.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711232059.scss | 139 ++++++++++++++++ .../pizza/styles/index_20220711232152.scss | 136 ++++++++++++++++ .../pizza/styles/index_20220711233115.scss | 137 ++++++++++++++++ .../pizza/styles/index_20220711233213.scss | 142 +++++++++++++++++ .../pizza/styles/index_20220711233241.scss | 144 +++++++++++++++++ .../pizza/styles/index_20220711233427.scss | 144 +++++++++++++++++ .../pizza/styles/index_20220711234657.scss | 149 ++++++++++++++++++ .../styles/libs/ResetCss_20220517155440.scss | 87 ---------- .../styles/libs/ResetCss_20220529151737.scss | 79 ---------- .../styles/libs/ResetCss_20220529152753.scss | 79 ---------- .../styles/libs/ResetCss_20220529155109.scss | 79 ---------- .../styles/libs/ResetCss_20220530180616.scss | 79 ---------- .../styles/libs/ResetCss_20220530180617.scss | 79 ---------- .../styles/libs/ResetCss_20220530180621.scss | 79 ---------- .../styles/libs/ResetCss_20220530180724.scss | 79 ---------- .../styles/libs/ResetCss_20220530180731.scss | 79 ---------- .../styles/libs/ResetCss_20220530180732.scss | 79 ---------- ...0246.scss => ResetCss_20220711235221.scss} | 1 + ...1626.scss => ResetCss_20220711235254.scss} | 2 + .../modals/pizza/styles/_block_selector.scss | 1 + .../modals/pizza/styles/_ingredients.scss | 13 +- .../index/modals/pizza/styles/_products.scss | 48 ++++-- .../index/modals/pizza/styles/index.scss | 90 ++++++----- styles/libs/ResetCss.scss | 1 + 50 files changed, 3817 insertions(+), 867 deletions(-) create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220618153801.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235011.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235017.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235027.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711222549.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711223021.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224900.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224904.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224908.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_products_20220711225240.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_products_20220711230102.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/_products_20220711230143.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711222608.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711222741.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711222836.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224137.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224155.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224248.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224556.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224707.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711224759.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711225942.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711230609.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711230729.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711231054.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711232023.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711232059.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711232152.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711233115.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711233213.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711233241.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711233427.scss create mode 100644 .history/components/customer/pages/index/modals/pizza/styles/index_20220711234657.scss delete mode 100644 .history/styles/libs/ResetCss_20220517155440.scss delete mode 100644 .history/styles/libs/ResetCss_20220529151737.scss delete mode 100644 .history/styles/libs/ResetCss_20220529152753.scss delete mode 100644 .history/styles/libs/ResetCss_20220529155109.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180616.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180617.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180621.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180724.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180731.scss delete mode 100644 .history/styles/libs/ResetCss_20220530180732.scss rename .history/styles/libs/{ResetCss_20220531140246.scss => ResetCss_20220711235221.scss} (97%) rename .history/styles/libs/{ResetCss_20220529151626.scss => ResetCss_20220711235254.scss} (96%) diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220618153801.scss b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220618153801.scss new file mode 100644 index 0000000..e30c5d1 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220618153801.scss @@ -0,0 +1,58 @@ +.block { + display: block ruby; + margin-bottom: 15px; + margin-left: 15px; + border-spacing: 0; + border-collapse: separate; + + &_selector { + -moz-transition: border 250ms, color 250ms; + -o-transition: border 250ms, color 250ms; + -webkit-transition: border 250ms, color 250ms; + transition: border 250ms, color 250ms; + cursor: pointer; + + ul { + margin-left: -25px; + + &:first-of-type { + margin-bottom: 6px; + } + li { + padding: 5px; + cursor: pointer; + font-size: 14px; + display: table-cell; + height: 24px; + vertical-align: middle; + text-align: center; + position: relative; + padding-left: 8px; + padding-right: 8px; + border-radius: 32px; + + &.active { + background: #FED11E; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); + cursor: auto; + } + + &.size{ + width: 60px; + height: 32px; + border-radius: 8px; + } + + &.type{ + width: 178px; + height: 24px; + border-radius: 12px; + -webkit-border-radius: 12px; + -moz-border-radius: 12px; + -ms-border-radius: 12px; + -o-border-radius: 12px; + } + } + } + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235011.scss b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235011.scss new file mode 100644 index 0000000..43452ab --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235011.scss @@ -0,0 +1,59 @@ +.block { + display: block ruby; + margin-bottom: 15px; + margin-left: 15px; + border-spacing: 0; + border-collapse: separate; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + + &_selector { + -moz-transition: border 250ms, color 250ms; + -o-transition: border 250ms, color 250ms; + -webkit-transition: border 250ms, color 250ms; + transition: border 250ms, color 250ms; + cursor: pointer; + + ul { + margin-left: -25px; + + &:first-of-type { + margin-bottom: 6px; + } + li { + padding: 5px; + cursor: pointer; + font-size: 14px; + display: table-cell; + height: 24px; + vertical-align: middle; + text-align: center; + position: relative; + padding-left: 8px; + padding-right: 8px; + border-radius: 32px; + + &.active { + background: #FED11E; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); + cursor: auto; + } + + &.size{ + width: 60px; + height: 32px; + border-radius: 8px; + } + + &.type{ + width: 178px; + height: 24px; + border-radius: 12px; + -webkit-border-radius: 12px; + -moz-border-radius: 12px; + -ms-border-radius: 12px; + -o-border-radius: 12px; + } + } + } + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235017.scss b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235017.scss new file mode 100644 index 0000000..9a254b0 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235017.scss @@ -0,0 +1,60 @@ +.block { + display: block ruby; + margin-bottom: 15px; + margin-left: 15px; + border-spacing: 0; + border-collapse: separate; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + + &_selector { + -moz-transition: border 250ms, color 250ms; + -o-transition: border 250ms, color 250ms; + -webkit-transition: border 250ms, color 250ms; + transition: border 250ms, color 250ms; + cursor: pointer; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + + ul { + margin-left: -25px; + + &:first-of-type { + margin-bottom: 6px; + } + li { + padding: 5px; + cursor: pointer; + font-size: 14px; + display: table-cell; + height: 24px; + vertical-align: middle; + text-align: center; + position: relative; + padding-left: 8px; + padding-right: 8px; + border-radius: 32px; + + &.active { + background: #FED11E; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); + cursor: auto; + } + + &.size{ + width: 60px; + height: 32px; + border-radius: 8px; + } + + &.type{ + width: 178px; + height: 24px; + border-radius: 12px; + -webkit-border-radius: 12px; + -moz-border-radius: 12px; + -ms-border-radius: 12px; + -o-border-radius: 12px; + } + } + } + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235027.scss b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235027.scss new file mode 100644 index 0000000..249e8a5 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_block_selector_20220711235027.scss @@ -0,0 +1,59 @@ +.block { + display: block ruby; + margin-bottom: 15px; + margin-left: 15px; + border-spacing: 0; + border-collapse: separate; + + &_selector { + -moz-transition: border 250ms, color 250ms; + -o-transition: border 250ms, color 250ms; + -webkit-transition: border 250ms, color 250ms; + transition: border 250ms, color 250ms; + cursor: pointer; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + + ul { + margin-left: -25px; + + &:first-of-type { + margin-bottom: 6px; + } + li { + padding: 5px; + cursor: pointer; + font-size: 14px; + display: table-cell; + height: 24px; + vertical-align: middle; + text-align: center; + position: relative; + padding-left: 8px; + padding-right: 8px; + border-radius: 32px; + + &.active { + background: #FED11E; + box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04); + cursor: auto; + } + + &.size{ + width: 60px; + height: 32px; + border-radius: 8px; + } + + &.type{ + width: 178px; + height: 24px; + border-radius: 12px; + -webkit-border-radius: 12px; + -moz-border-radius: 12px; + -ms-border-radius: 12px; + -o-border-radius: 12px; + } + } + } + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711222549.scss b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711222549.scss new file mode 100644 index 0000000..10b68f0 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711222549.scss @@ -0,0 +1,91 @@ +$color_yellow: #FED11E; +$color_none: #dad9d8; + +.ingredients{ + text-align: center; + height: 250px; + overflow-y: scroll; + margin-left: 10px; + + @media (min-width: 640px) { + ul { + padding-top: 8px; + flex-wrap: wrap; + } + } + + .ul { + padding-top: 16px; + display: flex; + flex-wrap: wrap; + } + + .li { + list-style-type: none; + margin: 5px; + width: 83px; + + .text_box { + border-radius: 30%; + height: 128px; + + &.none_ing { + background-color: $color_none; + padding: 5px 5px 5px 5px; + } + + &.yellow_ing { + background-color: $color_yellow; + padding: 5px 5px 5px 5px; + } + + .img_ing { + color: rgb(0, 0, 0); + height: 52px; + width: 52px; + margin: 0 auto; + border-radius: 50%; + background-color: #fff; + } + + .title_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .price_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .button_ing{ + display: inline-block; + -webkit-border-radius: 12px; + -moz-border-radius: 50%; + border-radius: 50%; + -khtml-border-radius: 50%;; + width: 28px; + height: 25px; + margin-top: 10px; + border: aliceblue; + } + + @import 'products'; + } + } + + .buttonCheck{ + font-size: 24px; + } + +} + +.plus{ + background: url('/assets/img/plus.png') 100% 100% no-repeat; + } + + .minus{ + background: url('/assets/img/minus.png') 0% no-repeat; + margin-right: auto !important; + margin-left: auto !important; + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711223021.scss b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711223021.scss new file mode 100644 index 0000000..7750530 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711223021.scss @@ -0,0 +1,91 @@ +$color_yellow: #FED11E; +$color_none: #dad9d8; + +.ingredients{ + text-align: center; + height: 200px; + overflow-y: scroll; + margin-left: 10px; + + @media (min-width: 640px) { + ul { + padding-top: 8px; + flex-wrap: wrap; + } + } + + .ul { + padding-top: 16px; + display: flex; + flex-wrap: wrap; + } + + .li { + list-style-type: none; + margin: 5px; + width: 83px; + + .text_box { + border-radius: 30%; + height: 128px; + + &.none_ing { + background-color: $color_none; + padding: 5px 5px 5px 5px; + } + + &.yellow_ing { + background-color: $color_yellow; + padding: 5px 5px 5px 5px; + } + + .img_ing { + color: rgb(0, 0, 0); + height: 52px; + width: 52px; + margin: 0 auto; + border-radius: 50%; + background-color: #fff; + } + + .title_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .price_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .button_ing{ + display: inline-block; + -webkit-border-radius: 12px; + -moz-border-radius: 50%; + border-radius: 50%; + -khtml-border-radius: 50%;; + width: 28px; + height: 25px; + margin-top: 10px; + border: aliceblue; + } + + @import 'products'; + } + } + + .buttonCheck{ + font-size: 24px; + } + +} + +.plus{ + background: url('/assets/img/plus.png') 100% 100% no-repeat; + } + + .minus{ + background: url('/assets/img/minus.png') 0% no-repeat; + margin-right: auto !important; + margin-left: auto !important; + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224900.scss b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224900.scss new file mode 100644 index 0000000..9114198 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224900.scss @@ -0,0 +1,91 @@ +$color_yellow: #FED11E; +$color_none: #dad9d8; + +.ingredients{ + text-align: center; + height: 100px; + overflow-y: scroll; + margin-left: 10px; + + @media (min-width: 640px) { + ul { + padding-top: 8px; + flex-wrap: wrap; + } + } + + .ul { + padding-top: 16px; + display: flex; + flex-wrap: wrap; + } + + .li { + list-style-type: none; + margin: 5px; + width: 83px; + + .text_box { + border-radius: 30%; + height: 128px; + + &.none_ing { + background-color: $color_none; + padding: 5px 5px 5px 5px; + } + + &.yellow_ing { + background-color: $color_yellow; + padding: 5px 5px 5px 5px; + } + + .img_ing { + color: rgb(0, 0, 0); + height: 52px; + width: 52px; + margin: 0 auto; + border-radius: 50%; + background-color: #fff; + } + + .title_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .price_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .button_ing{ + display: inline-block; + -webkit-border-radius: 12px; + -moz-border-radius: 50%; + border-radius: 50%; + -khtml-border-radius: 50%;; + width: 28px; + height: 25px; + margin-top: 10px; + border: aliceblue; + } + + @import 'products'; + } + } + + .buttonCheck{ + font-size: 24px; + } + +} + +.plus{ + background: url('/assets/img/plus.png') 100% 100% no-repeat; + } + + .minus{ + background: url('/assets/img/minus.png') 0% no-repeat; + margin-right: auto !important; + margin-left: auto !important; + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224904.scss b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224904.scss new file mode 100644 index 0000000..7750530 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224904.scss @@ -0,0 +1,91 @@ +$color_yellow: #FED11E; +$color_none: #dad9d8; + +.ingredients{ + text-align: center; + height: 200px; + overflow-y: scroll; + margin-left: 10px; + + @media (min-width: 640px) { + ul { + padding-top: 8px; + flex-wrap: wrap; + } + } + + .ul { + padding-top: 16px; + display: flex; + flex-wrap: wrap; + } + + .li { + list-style-type: none; + margin: 5px; + width: 83px; + + .text_box { + border-radius: 30%; + height: 128px; + + &.none_ing { + background-color: $color_none; + padding: 5px 5px 5px 5px; + } + + &.yellow_ing { + background-color: $color_yellow; + padding: 5px 5px 5px 5px; + } + + .img_ing { + color: rgb(0, 0, 0); + height: 52px; + width: 52px; + margin: 0 auto; + border-radius: 50%; + background-color: #fff; + } + + .title_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .price_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .button_ing{ + display: inline-block; + -webkit-border-radius: 12px; + -moz-border-radius: 50%; + border-radius: 50%; + -khtml-border-radius: 50%;; + width: 28px; + height: 25px; + margin-top: 10px; + border: aliceblue; + } + + @import 'products'; + } + } + + .buttonCheck{ + font-size: 24px; + } + +} + +.plus{ + background: url('/assets/img/plus.png') 100% 100% no-repeat; + } + + .minus{ + background: url('/assets/img/minus.png') 0% no-repeat; + margin-right: auto !important; + margin-left: auto !important; + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224908.scss b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224908.scss new file mode 100644 index 0000000..3d4ce63 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_ingredients_20220711224908.scss @@ -0,0 +1,91 @@ +$color_yellow: #FED11E; +$color_none: #dad9d8; + +.ingredients{ + text-align: center; + height: 180px; + overflow-y: scroll; + margin-left: 10px; + + @media (min-width: 640px) { + ul { + padding-top: 8px; + flex-wrap: wrap; + } + } + + .ul { + padding-top: 16px; + display: flex; + flex-wrap: wrap; + } + + .li { + list-style-type: none; + margin: 5px; + width: 83px; + + .text_box { + border-radius: 30%; + height: 128px; + + &.none_ing { + background-color: $color_none; + padding: 5px 5px 5px 5px; + } + + &.yellow_ing { + background-color: $color_yellow; + padding: 5px 5px 5px 5px; + } + + .img_ing { + color: rgb(0, 0, 0); + height: 52px; + width: 52px; + margin: 0 auto; + border-radius: 50%; + background-color: #fff; + } + + .title_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .price_ing{ + color: rgb(0, 0, 0); + font-size: 12px; + } + + .button_ing{ + display: inline-block; + -webkit-border-radius: 12px; + -moz-border-radius: 50%; + border-radius: 50%; + -khtml-border-radius: 50%;; + width: 28px; + height: 25px; + margin-top: 10px; + border: aliceblue; + } + + @import 'products'; + } + } + + .buttonCheck{ + font-size: 24px; + } + +} + +.plus{ + background: url('/assets/img/plus.png') 100% 100% no-repeat; + } + + .minus{ + background: url('/assets/img/minus.png') 0% no-repeat; + margin-right: auto !important; + margin-left: auto !important; + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711225240.scss b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711225240.scss new file mode 100644 index 0000000..e99fb28 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711225240.scss @@ -0,0 +1,31 @@ +.onion{ + background: url('/assets/img/onion.png') 100% 100% white; +} + +.bacon{ + background: url('/assets/img/bacon.png') 100% 100% white; +} + +.cheese{ + background: url('/assets/img/cheese.png') 100% 100% white; +} + +.jalapeno{ + background: url('/assets/img/jalapeno.png') 100% 100% white; +} + +.mushroom{ + background: url('/assets/img/mushroom.png') 100% 100% white; +} + +.pickles{ + background: url('/assets/img/pickles.png') 100% 100% white; +} + +.pineapple{ + background: url('/assets/img/pineapple.png') 100% 100% white; +} + +.tomato{ + background: url('/assets/img/tomato.png') 100% 100% white; +} \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230102.scss b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230102.scss new file mode 100644 index 0000000..638f43a --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230102.scss @@ -0,0 +1,47 @@ +.onion { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/onion.png'); +} + +.bacon { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/bacon.png') 100% 100% white; +} + +.cheese { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/cheese.png') 100% 100% white; +} + +.jalapeno { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/jalapeno.png') 100% 100% white; +} + +.mushroom { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/mushroom.png') 100% 100% white; +} + +.pickles { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pickles.png') 100% 100% white; +} + +.pineapple { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pineapple.png') 100% 100% white; +} + +.tomato { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/tomato.png') 100% 100% white; +} \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230143.scss b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230143.scss new file mode 100644 index 0000000..a296b9a --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/_products_20220711230143.scss @@ -0,0 +1,47 @@ +.onion { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/onion.png'); +} + +.bacon { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/bacon.png'); +} + +.cheese { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/cheese.png'); +} + +.jalapeno { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/jalapeno.png'); +} + +.mushroom { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/mushroom.png'); +} + +.pickles { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pickles.png'); +} + +.pineapple { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pineapple.png'); +} + +.tomato { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/tomato.png'); +} \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222608.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222608.scss new file mode 100644 index 0000000..9450de2 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222608.scss @@ -0,0 +1,141 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + + + + + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + + + + + + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } + + \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222741.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222741.scss new file mode 100644 index 0000000..861dfa2 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222741.scss @@ -0,0 +1,128 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222836.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222836.scss new file mode 100644 index 0000000..83af5da --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711222836.scss @@ -0,0 +1,128 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224137.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224137.scss new file mode 100644 index 0000000..d4aed1c --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224137.scss @@ -0,0 +1,134 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + + + @media (max-width: 940px) { + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + } + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224155.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224155.scss new file mode 100644 index 0000000..1a49247 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224155.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + + @media (max-width: 940px) { + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + } + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224248.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224248.scss new file mode 100644 index 0000000..abf3bbe --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224248.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + + @media (max-width: 766px) { + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + } + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224556.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224556.scss new file mode 100644 index 0000000..be1f2e3 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224556.scss @@ -0,0 +1,141 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + + @media (min-width:600px) { + .dialog { + + height: 533px; + width: 900px; + } + } + + @media (min-width:1281px) { + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + } + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224707.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224707.scss new file mode 100644 index 0000000..b7cc791 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224707.scss @@ -0,0 +1,140 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + + @media (max-width:760px) { + .dialog { + height: 533px; + width: 900px; + } + } + + @media (min-width:780px) { + .dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + } + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224759.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224759.scss new file mode 100644 index 0000000..071753c --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711224759.scss @@ -0,0 +1,140 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + + @media (max-width:760px) { + height: 533px; + width: 900px; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711225942.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711225942.scss new file mode 100644 index 0000000..5a1a878 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711225942.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 900px; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + max-width: 400px; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230609.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230609.scss new file mode 100644 index 0000000..7e5bb61 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230609.scss @@ -0,0 +1,138 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 900px; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230729.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230729.scss new file mode 100644 index 0000000..294d88b --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711230729.scss @@ -0,0 +1,138 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711231054.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711231054.scss new file mode 100644 index 0000000..f2767bb --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711231054.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 450px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232023.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232023.scss new file mode 100644 index 0000000..1dacd4f --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232023.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 1010px; + width: 100vw; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232059.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232059.scss new file mode 100644 index 0000000..4aafb69 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232059.scss @@ -0,0 +1,139 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + .pizza_modal_card{ + padding-top: 5px; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232152.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232152.scss new file mode 100644 index 0000000..9221bd8 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711232152.scss @@ -0,0 +1,136 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233115.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233115.scss new file mode 100644 index 0000000..38f4675 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233115.scss @@ -0,0 +1,137 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); +} + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + border-radius: 20px; + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + height: 500px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233213.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233213.scss new file mode 100644 index 0000000..ebcd1aa --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233213.scss @@ -0,0 +1,142 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + @media (max-width:760px) { + + } + @media (min-width:780px) { + border-radius: 20px; + } + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + height: 500px; + display: table; + float: left; + position: static; + border-radius: 20px; + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233241.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233241.scss new file mode 100644 index 0000000..053f5f7 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233241.scss @@ -0,0 +1,144 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + @media (max-width:760px) { + + } + @media (min-width:780px) { + border-radius: 20px; + } + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + width: 100vw; + height: 500px; + display: table; + float: left; + position: static; + @media (min-width:780px) { + border-radius: 20px; + } + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233427.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233427.scss new file mode 100644 index 0000000..caa81ba --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711233427.scss @@ -0,0 +1,144 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + @media (max-width:760px) { + + } + @media (min-width:780px) { + border-radius: 20px; + } + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + height: 500px; + display: table; + float: left; + position: static; + @media (min-width:780px) { + border-radius: 20px; + width: 100vw; + } + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/components/customer/pages/index/modals/pizza/styles/index_20220711234657.scss b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711234657.scss new file mode 100644 index 0000000..d25c7f1 --- /dev/null +++ b/.history/components/customer/pages/index/modals/pizza/styles/index_20220711234657.scss @@ -0,0 +1,149 @@ +.pizza_modal_card { + display: block; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 100; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ + + .dialog { + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + } + + /* Modal Content */ + .content { + background-color: #fefefe; + margin: auto; + @media (max-width:760px) { + + } + @media (min-width:780px) { + border-radius: 20px; + } + /*border: 1px solid #888;*/ + .body{ + height: 100%; + flex-wrap: wrap; + display: flex; + + .left{ + margin: 0 auto; + float: left; + position: static; + display: flex; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + width: 400px; + + .img{ + text-align: center; + height: 100%; + display: grid;; + justify-content: center; /*Центрирование по горизонтали*/ + align-items: center; /*Центрирование по вертикали */ + } + } + + .right{ + background: #F7F7F7; + height: 500px; + display: table; + float: left; + position: static; + + @media (max-width:760px) { + width: 100vw; + } + + @media (min-width:780px) { + border-radius: 20px; + width: 400px; + } + + .header{ + height: 450px; + letter-spacing: 0.02em; + + .title{ + font-size: 20px; + line-height: 24px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + .feature{ + font-size: 13px; + line-height: 15px; + margin: 10px 10px 10px 15px; + color: #8E8E93; + } + + .description{ + font-size: 13px; + line-height: 15px; + color: #252A48; + margin: 10px 10px 10px 15px; + } + /* Блок переключения */ + @import 'block_selector'; + @import 'ingredients'; + } + } + } + } + } + + .modal_footer{ + display: table; + margin: 0 auto; + margin-top: 15px; + } + + /* The Close Button */ + .close { + color: #aaaaaa; + float: right; + font-size: 28px; + font-weight: bold; + } + + .close:hover, + .close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + } + } + + .position_product{ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ + } + + @media (max-width: 940px) { + .pizza_modal_card { + height: 100vh; + width: 100vw; + } + } \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220517155440.scss b/.history/styles/libs/ResetCss_20220517155440.scss deleted file mode 100644 index d2741e5..0000000 --- a/.history/styles/libs/ResetCss_20220517155440.scss +++ /dev/null @@ -1,87 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Выставляем основные настройки по-умолчанию для body */ -body { - min-height: 100vh; - scroll-behavior: smooth; - text-rendering: optimizeSpeed; - line-height: 1.5; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220529151737.scss b/.history/styles/libs/ResetCss_20220529151737.scss deleted file mode 100644 index 2333fe0..0000000 --- a/.history/styles/libs/ResetCss_20220529151737.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220529152753.scss b/.history/styles/libs/ResetCss_20220529152753.scss deleted file mode 100644 index 5bcb912..0000000 --- a/.history/styles/libs/ResetCss_20220529152753.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220529155109.scss b/.history/styles/libs/ResetCss_20220529155109.scss deleted file mode 100644 index d7764e4..0000000 --- a/.history/styles/libs/ResetCss_20220529155109.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180616.scss b/.history/styles/libs/ResetCss_20220530180616.scss deleted file mode 100644 index 327aff4..0000000 --- a/.history/styles/libs/ResetCss_20220530180616.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - /margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180617.scss b/.history/styles/libs/ResetCss_20220530180617.scss deleted file mode 100644 index d91e9d9..0000000 --- a/.history/styles/libs/ResetCss_20220530180617.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - /*margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180621.scss b/.history/styles/libs/ResetCss_20220530180621.scss deleted file mode 100644 index 49eaf7f..0000000 --- a/.history/styles/libs/ResetCss_20220530180621.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - /*margin: 0;*/ -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180724.scss b/.history/styles/libs/ResetCss_20220530180724.scss deleted file mode 100644 index d7764e4..0000000 --- a/.history/styles/libs/ResetCss_20220530180724.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180731.scss b/.history/styles/libs/ResetCss_20220530180731.scss deleted file mode 100644 index 5bcb912..0000000 --- a/.history/styles/libs/ResetCss_20220530180731.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220530180732.scss b/.history/styles/libs/ResetCss_20220530180732.scss deleted file mode 100644 index 5bcb912..0000000 --- a/.history/styles/libs/ResetCss_20220530180732.scss +++ /dev/null @@ -1,79 +0,0 @@ -/* Указываем box sizing */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Убираем внутренние отступы */ -ul[class], -ol[class] { - padding: 0; -} - -/* Убираем внешние отступы */ -body, -h1, -h2, -h3, -h4, -p, -ul[class], -ol[class], -li, -figure, -figcaption, -blockquote, -dl, -dd { - margin: 0; -} - -/* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ -ul[class], -ol[class] { - list-style: none; -} - -/* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ -a:not([class]) { - text-decoration-skip-ink: auto; -} -a{ - text-decoration: none; /* Отменяем подчеркивание у ссылки */ - color: black; /* Цвет ссылок */ - margin: 0; -} -a:visited { - color: black; /* Цвет посещенных ссылок */ -} -a:active { - color: black; /* Цвет активных ссылок */ -} -/* Упрощаем работу с изображениями */ -img { - max-width: 100%; - display: block; -} - -/* Указываем понятную периодичность в потоке данных у article*/ -article > * + * { - margin-top: 1em; -} - -/* Наследуем шрифты для инпутов и кнопок */ -input, -textarea, -select { - font: inherit; -} - -/* Удаляем все анимации и переходы для людей, которые предпочитай их не использовать */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - scroll-behavior: auto !important; - } -} \ No newline at end of file diff --git a/.history/styles/libs/ResetCss_20220531140246.scss b/.history/styles/libs/ResetCss_20220711235221.scss similarity index 97% rename from .history/styles/libs/ResetCss_20220531140246.scss rename to .history/styles/libs/ResetCss_20220711235221.scss index d9f8581..177afd9 100644 --- a/.history/styles/libs/ResetCss_20220531140246.scss +++ b/.history/styles/libs/ResetCss_20220711235221.scss @@ -34,6 +34,7 @@ dd { ul[class], ol[class] { list-style: none; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ diff --git a/.history/styles/libs/ResetCss_20220529151626.scss b/.history/styles/libs/ResetCss_20220711235254.scss similarity index 96% rename from .history/styles/libs/ResetCss_20220529151626.scss rename to .history/styles/libs/ResetCss_20220711235254.scss index 5bcb912..177afd9 100644 --- a/.history/styles/libs/ResetCss_20220529151626.scss +++ b/.history/styles/libs/ResetCss_20220711235254.scss @@ -27,12 +27,14 @@ blockquote, dl, dd { margin: 0; + font-family: 'Rubik'; } /* Удаляем стандартную стилизацию для всех ul и il, у которых есть атрибут class*/ ul[class], ol[class] { list-style: none; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */ diff --git a/components/customer/pages/index/modals/pizza/styles/_block_selector.scss b/components/customer/pages/index/modals/pizza/styles/_block_selector.scss index e30c5d1..249e8a5 100644 --- a/components/customer/pages/index/modals/pizza/styles/_block_selector.scss +++ b/components/customer/pages/index/modals/pizza/styles/_block_selector.scss @@ -11,6 +11,7 @@ -webkit-transition: border 250ms, color 250ms; transition: border 250ms, color 250ms; cursor: pointer; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); ul { margin-left: -25px; diff --git a/components/customer/pages/index/modals/pizza/styles/_ingredients.scss b/components/customer/pages/index/modals/pizza/styles/_ingredients.scss index a662637..3d4ce63 100644 --- a/components/customer/pages/index/modals/pizza/styles/_ingredients.scss +++ b/components/customer/pages/index/modals/pizza/styles/_ingredients.scss @@ -3,7 +3,7 @@ $color_none: #dad9d8; .ingredients{ text-align: center; - height: 250px; + height: 180px; overflow-y: scroll; margin-left: 10px; @@ -74,23 +74,12 @@ $color_none: #dad9d8; } } - - - - - - - - .buttonCheck{ font-size: 24px; } - } - - .plus{ background: url('/assets/img/plus.png') 100% 100% no-repeat; } diff --git a/components/customer/pages/index/modals/pizza/styles/_products.scss b/components/customer/pages/index/modals/pizza/styles/_products.scss index b491855..a296b9a 100644 --- a/components/customer/pages/index/modals/pizza/styles/_products.scss +++ b/components/customer/pages/index/modals/pizza/styles/_products.scss @@ -1,31 +1,47 @@ -.onion{ - background: url('/assets/img/onion.png') 100% 100% no-repeat; +.onion { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/onion.png'); } -.bacon{ - background: url('/assets/img/bacon.png') 100% 100% no-repeat; +.bacon { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/bacon.png'); } -.cheese{ - background: url('/assets/img/cheese.png') 100% 100% no-repeat; +.cheese { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/cheese.png'); } -.jalapeno{ - background: url('/assets/img/jalapeno.png') 100% 100% no-repeat; +.jalapeno { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/jalapeno.png'); } -.mushroom{ - background: url('/assets/img/mushroom.png') 100% 100% no-repeat; +.mushroom { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/mushroom.png'); } -.pickles{ - background: url('/assets/img/pickles.png') 100% 100% no-repeat; +.pickles { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pickles.png'); } -.pineapple{ - background: url('/assets/img/pineapple.png') 100% 100% no-repeat; +.pineapple { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/pineapple.png'); } -.tomato{ - background: url('/assets/img/tomato.png') 100% 100% no-repeat; +.tomato { + background-repeat: no-repeat; + background-position: center; + background-image: url('/assets/img/tomato.png'); } \ No newline at end of file diff --git a/components/customer/pages/index/modals/pizza/styles/index.scss b/components/customer/pages/index/modals/pizza/styles/index.scss index e6d62b0..d25c7f1 100644 --- a/components/customer/pages/index/modals/pizza/styles/index.scss +++ b/components/customer/pages/index/modals/pizza/styles/index.scss @@ -10,33 +10,50 @@ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ .dialog { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - height: 533px; - width: 900px; + @media (max-width:760px) { + height: 533px; + width: 400px; + margin: 0 auto; + } + + @media (min-width:780px) { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 533px; + width: 900px; + -webkit-transform: translate(-50%, -50%); + -moz-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + -o-transform: translate(-50%, -50%); + } /* Modal Content */ .content { background-color: #fefefe; margin: auto; - border-radius: 20px; + @media (max-width:760px) { + + } + @media (min-width:780px) { + border-radius: 20px; + } /*border: 1px solid #888;*/ .body{ height: 100%; flex-wrap: wrap; display: flex; - + .left{ - /* margin: 0 auto;*/ + margin: 0 auto; float: left; position: static; display: flex; justify-content: center; /*Центрирование по горизонтали*/ align-items: center; /*Центрирование по вертикали */ width: 400px; - + .img{ text-align: center; height: 100%; @@ -45,14 +62,23 @@ align-items: center; /*Центрирование по вертикали */ } } - + .right{ background: #F7F7F7; - width: 450px; + height: 500px; display: table; float: left; position: static; + @media (max-width:760px) { + width: 100vw; + } + + @media (min-width:780px) { + border-radius: 20px; + width: 400px; + } + .header{ height: 450px; letter-spacing: 0.02em; @@ -90,12 +116,7 @@ margin: 0 auto; margin-top: 15px; } - - - - - - + /* The Close Button */ .close { color: #aaaaaa; @@ -103,7 +124,7 @@ font-size: 28px; font-weight: bold; } - + .close:hover, .close:focus { color: #000; @@ -111,31 +132,18 @@ cursor: pointer; } } - - - - - - - + .position_product{ - padding-top: 100px; - /* padding-top: 100px; - right: 0; - left: unset !important; - position: absolute;*/ + padding-top: 100px; + /* padding-top: 100px; + right: 0; + left: unset !important; + position: absolute;*/ } - - + @media (max-width: 940px) { .pizza_modal_card { - height: 1010px; + height: 100vh; width: 100vw; - max-width: 400px; } - .pizza_modal_card{ - padding-top: 5px; - } - } - - \ No newline at end of file + } \ No newline at end of file diff --git a/styles/libs/ResetCss.scss b/styles/libs/ResetCss.scss index d9f8581..177afd9 100644 --- a/styles/libs/ResetCss.scss +++ b/styles/libs/ResetCss.scss @@ -34,6 +34,7 @@ dd { ul[class], ol[class] { list-style: none; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* Элементы a, у которых нет класса, сбрасываем до дефолтных стилей */