parent
3fcf7fd325
commit
53262b4af3
@ -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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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; |
||||||
|
} |
@ -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'); |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
||||||
|
} |
||||||
|
} |
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -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; |
|
||||||
} |
|
||||||
} |
|
@ -1,31 +1,47 @@ |
|||||||
.onion{ |
.onion { |
||||||
background: url('/assets/img/onion.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/onion.png'); |
||||||
} |
} |
||||||
|
|
||||||
.bacon{ |
.bacon { |
||||||
background: url('/assets/img/bacon.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/bacon.png'); |
||||||
} |
} |
||||||
|
|
||||||
.cheese{ |
.cheese { |
||||||
background: url('/assets/img/cheese.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/cheese.png'); |
||||||
} |
} |
||||||
|
|
||||||
.jalapeno{ |
.jalapeno { |
||||||
background: url('/assets/img/jalapeno.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/jalapeno.png'); |
||||||
} |
} |
||||||
|
|
||||||
.mushroom{ |
.mushroom { |
||||||
background: url('/assets/img/mushroom.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/mushroom.png'); |
||||||
} |
} |
||||||
|
|
||||||
.pickles{ |
.pickles { |
||||||
background: url('/assets/img/pickles.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/pickles.png'); |
||||||
} |
} |
||||||
|
|
||||||
.pineapple{ |
.pineapple { |
||||||
background: url('/assets/img/pineapple.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/pineapple.png'); |
||||||
} |
} |
||||||
|
|
||||||
.tomato{ |
.tomato { |
||||||
background: url('/assets/img/tomato.png') 100% 100% no-repeat; |
background-repeat: no-repeat; |
||||||
|
background-position: center; |
||||||
|
background-image: url('/assets/img/tomato.png'); |
||||||
} |
} |
Loading…
Reference in new issue