parent
b90f078137
commit
445bfe3e01
@ -0,0 +1,16 @@ |
||||
Сайт для сервиса доставки пиццы. |
||||
|
||||
[Ссылка на сайт](https://pizza.krasnikov.pro/) |
||||
|
||||
### Задание на завтра |
||||
1. [x] Исправить размер модального окна с добавление пиццы в корзину |
||||
2. [ ] Перенести кнопку закрытия модального окна в верхний левый угол |
||||
|
||||
### Изменения 11.07.22 |
||||
1. Изменил размеры модального окна с карточкой пиццы под разные расширения экрана. |
||||
2. Изменил внутренни размеры компонентов модального окна, что бы все помещались. |
||||
3. Убрал появление синего цвета при нажатии. |
||||
|
||||
### Изменения 12.07.22 |
||||
1. Изменил расположение нижней панели карточки пиццы. |
||||
2. |
@ -0,0 +1,16 @@ |
||||
Сайт для сервиса доставки пиццы. |
||||
|
||||
[Ссылка на сайт](https://pizza.krasnikov.pro/) |
||||
|
||||
### Задание на завтра |
||||
1. [x] Исправить размер модального окна с добавление пиццы в корзину |
||||
2. [ ] Перенести кнопку закрытия модального окна в верхний левый угол |
||||
|
||||
### Изменения 11.07.22 |
||||
1. Изменил размеры модального окна с карточкой пиццы под разные расширения экрана. |
||||
2. Изменил внутренни размеры компонентов модального окна, что бы все помещались. |
||||
3. Убрал появление синего цвета при нажатии. |
||||
|
||||
### Изменения 12.07.22 |
||||
1. Изменил расположение нижней панели карточки пиццы. |
||||
2. Перенастроил корзину. Но пака не доделал новый дизайн карточки продукта. |
@ -0,0 +1,16 @@ |
||||
Сайт для сервиса доставки пиццы. |
||||
|
||||
[Ссылка на сайт](https://pizza.krasnikov.pro/) |
||||
|
||||
### Задание на завтра |
||||
1. [x] Исправить размер модального окна с добавление пиццы в корзину |
||||
2. [ ] Перенести кнопку закрытия модального окна в верхний левый угол |
||||
|
||||
### Изменения 11.07.22 |
||||
1. Изменил размеры модального окна с карточкой пиццы под разные расширения экрана. |
||||
2. Изменил внутренни размеры компонентов модального окна, что бы все помещались. |
||||
3. Убрал появление синего цвета при нажатии. |
||||
|
||||
### Изменения 12.07.22 |
||||
1. Изменил расположение нижней панели карточки пиццы. |
||||
2. Перенастроил корзину. Но пака не доделал новый дизайн карточки продукта. |
@ -0,0 +1,104 @@ |
||||
import React, { useState, useEffect } from 'react'; |
||||
import Image from 'next/image'; |
||||
import Link from "next/link"; |
||||
import classNames from 'classnames'; |
||||
import { useSelector } from 'react-redux'; |
||||
import { HiMinus, HiPlus } from "react-icons/hi"; |
||||
import { CardBasketProduct, CardAdditionally } from './' |
||||
import { BoxScroll, Box } from '../../../../../../components/customer/containers'; |
||||
import {ButtonImg, Button } from '../../../../../UI'; |
||||
|
||||
type PizzaProps = { |
||||
id: number; |
||||
title: string; |
||||
heft: string[]; |
||||
description: string; |
||||
img: string[]; |
||||
price: string[]; |
||||
size: string[]; |
||||
}; |
||||
|
||||
const types=[0,1], sizes=[30,40,50], sum=0, typeNames = ['традиционное тесто','тонкое тесто'] ; |
||||
|
||||
export const PizzaModalsContentCart: React.FC<PizzaProps> = ({ |
||||
id, |
||||
title, |
||||
img, |
||||
heft, |
||||
description, |
||||
price, |
||||
size, |
||||
}) => { |
||||
//const { totalPrice, totalCount } = useSelector(({ cart }) => cart);
|
||||
const totalCount =0; |
||||
const [basket, setBasket] = useState([{name:'Ggg', size:'30 ffv', sum:345}, {name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345}]); |
||||
const [quantityGoods, setQuantityGoods] = useState(basket.length); |
||||
const [additionally, setAdditionally] = useState([{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100},]); |
||||
|
||||
const [delivery, setDelivery] = useState(0); |
||||
|
||||
const [sum, setSum] = useState<number>(0); |
||||
|
||||
const addBasket = () => { |
||||
console.log('add'); |
||||
} |
||||
|
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<Link href={"/"} as={"/"} scroll={false}> |
||||
<button className={classNames('button_close')} onClick={addBasket}>X</button> |
||||
</Link> |
||||
<div className='header'> |
||||
<p>{totalCount} товар(а)</p> |
||||
</div> |
||||
<div className='body'> |
||||
<div className='body_order'> |
||||
{Object.keys(basket).length > 0 ? basket.map((rows, count) => |
||||
<CardBasketProduct |
||||
key={count} |
||||
src={'/assets/img/smal_pizza.png'} |
||||
alt={'pizza'} |
||||
title_name={rows.name} |
||||
title_size={rows.size} |
||||
sum={rows.sum}/> |
||||
): ' Корзина пуста'} |
||||
</div> |
||||
<div className='body_additionally'> |
||||
<p className='body_additionally_text'>Добавить к заказу?</p> |
||||
<BoxScroll> |
||||
{additionally.map((name, count) => |
||||
<CardAdditionally key={count} alt={'pizza'} src={name.src}/>) |
||||
} |
||||
</BoxScroll> |
||||
</div> |
||||
</div> |
||||
<div className='basket_footer'> |
||||
<div className='promo_code_box'> |
||||
<input className='input' type="text" name="promo_code" id="promo_code" placeholder="Промокод"/> |
||||
<button className='promo_button' type="submit">Применить</button> |
||||
</div> |
||||
<div className='check'> |
||||
<div className='check_box'> |
||||
<p >Доставка </p> <p className='check_text'>{delivery} ₽</p> |
||||
</div> |
||||
<div className='check_box'> |
||||
<p >{quantityGoods} товар(а) </p> |
||||
<p className='check_text'>{sum} ₽</p> |
||||
</div> |
||||
</div> |
||||
<Button styles={'yellow button_size_48'} |
||||
align={'button_align_center'} |
||||
onClick={() => console.log('add')}>Оформить заказ {sum} ₽ |
||||
</Button> |
||||
</div> |
||||
</> |
||||
); |
||||
}; |
||||
|
||||
|
@ -0,0 +1,104 @@ |
||||
import React, { useState, useEffect } from 'react'; |
||||
import Image from 'next/image'; |
||||
import Link from "next/link"; |
||||
import classNames from 'classnames'; |
||||
import { useSelector } from 'react-redux'; |
||||
import { HiMinus, HiPlus } from "react-icons/hi"; |
||||
import { CardBasketProduct, CardAdditionally } from './' |
||||
import { BoxScroll, Box } from '../../../../../../components/customer/containers'; |
||||
import {ButtonImg, Button } from '../../../../../UI'; |
||||
|
||||
type PizzaProps = { |
||||
id: number; |
||||
title: string; |
||||
heft: string[]; |
||||
description: string; |
||||
img: string[]; |
||||
price: string[]; |
||||
size: string[]; |
||||
}; |
||||
|
||||
const types=[0,1], sizes=[30,40,50], sum=0, typeNames = ['традиционное тесто','тонкое тесто'] ; |
||||
|
||||
export const PizzaModalsContentCart: React.FC<PizzaProps> = ({ |
||||
id, |
||||
title, |
||||
img, |
||||
heft, |
||||
description, |
||||
price, |
||||
size, |
||||
}) => { |
||||
//const { totalPrice, totalCount } = useSelector(({ cart }) => cart);
|
||||
const totalCount =0; |
||||
const [basket, setBasket] = useState([{name:'Ggg', size:'30 ffv', sum:345}, {name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345}]); |
||||
const [quantityGoods, setQuantityGoods] = useState(basket.length); |
||||
const [additionally, setAdditionally] = useState([{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100},]); |
||||
|
||||
const [delivery, setDelivery] = useState(0); |
||||
|
||||
const [sum, setSum] = useState<number>(0); |
||||
|
||||
const addBasket = () => { |
||||
console.log('add'); |
||||
} |
||||
|
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<Link href={"/"} as={"/"} scroll={false}> |
||||
<button className={classNames('button_close')} onClick={addBasket}>X</button> |
||||
</Link> |
||||
<div className='header'> |
||||
<p>{totalCount} товар(а)</p> |
||||
</div> |
||||
<div className='body'> |
||||
<div className='body_order'> |
||||
{Object.keys(basket).length > 0 ? basket.map((rows, count) => |
||||
<CardBasketProduct |
||||
key={count} |
||||
src={'/assets/img/smal_pizza.png'} |
||||
alt={'pizza'} |
||||
title_name={rows.name} |
||||
title_size={rows.size} |
||||
sum={rows.sum}/> |
||||
): ' Корзина пуста'} |
||||
</div> |
||||
<div className='body_additionally'> |
||||
<p className='body_additionally_text'>Добавить к заказу?</p> |
||||
<BoxScroll> |
||||
{additionally.map((name, count) => |
||||
<CardAdditionally key={count} alt={'pizza'} src={name.src}/>) |
||||
} |
||||
</BoxScroll> |
||||
</div> |
||||
</div> |
||||
<div className='basket_footer'> |
||||
<div className='promo_code_box'> |
||||
<input className='input' type="text" name="promo_code" id="promo_code" placeholder="Промокод"/> |
||||
<button className='button' type="submit">Применить</button> |
||||
</div> |
||||
<div className='check'> |
||||
<div className='check_box'> |
||||
<p >Доставка </p> <p className='check_text'>{delivery} ₽</p> |
||||
</div> |
||||
<div className='check_box'> |
||||
<p >{quantityGoods} товар(а) </p> |
||||
<p className='check_text'>{sum} ₽</p> |
||||
</div> |
||||
</div> |
||||
<Button styles={'yellow button_size_48'} |
||||
align={'button_align_center'} |
||||
onClick={() => console.log('add')}>Оформить заказ {sum} ₽ |
||||
</Button> |
||||
</div> |
||||
</> |
||||
); |
||||
}; |
||||
|
||||
|
@ -0,0 +1,104 @@ |
||||
import React, { useState, useEffect } from 'react'; |
||||
import Image from 'next/image'; |
||||
import Link from "next/link"; |
||||
import classNames from 'classnames'; |
||||
import { useSelector } from 'react-redux'; |
||||
import { HiMinus, HiPlus } from "react-icons/hi"; |
||||
import { CardBasketProduct, CardAdditionally } from './' |
||||
import { BoxScroll, Box } from '../../../../../../components/customer/containers'; |
||||
import {ButtonImg, Button } from '../../../../../UI'; |
||||
|
||||
type PizzaProps = { |
||||
id: number; |
||||
title: string; |
||||
heft: string[]; |
||||
description: string; |
||||
img: string[]; |
||||
price: string[]; |
||||
size: string[]; |
||||
}; |
||||
|
||||
const types=[0,1], sizes=[30,40,50], sum=0, typeNames = ['традиционное тесто','тонкое тесто'] ; |
||||
|
||||
export const PizzaModalsContentCart: React.FC<PizzaProps> = ({ |
||||
id, |
||||
title, |
||||
img, |
||||
heft, |
||||
description, |
||||
price, |
||||
size, |
||||
}) => { |
||||
//const { totalPrice, totalCount } = useSelector(({ cart }) => cart);
|
||||
const totalCount =0; |
||||
const [basket, setBasket] = useState([{name:'Ggg', size:'30 ffv', sum:345}, {name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345}]); |
||||
const [quantityGoods, setQuantityGoods] = useState(basket.length); |
||||
const [additionally, setAdditionally] = useState([{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100},]); |
||||
|
||||
const [delivery, setDelivery] = useState(0); |
||||
|
||||
const [sum, setSum] = useState<number>(0); |
||||
|
||||
const addBasket = () => { |
||||
console.log('add'); |
||||
} |
||||
|
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<Link href={"/"} as={"/"} scroll={false}> |
||||
<button className={classNames('button_close')} onClick={addBasket}>X</button> |
||||
</Link> |
||||
<div className='header'> |
||||
<p>{totalCount} товар(а)</p> |
||||
</div> |
||||
<div className='body'> |
||||
<div className='body_order'> |
||||
{Object.keys(basket).length > 0 ? basket.map((rows, count) => |
||||
<CardBasketProduct |
||||
key={count} |
||||
src={'/assets/img/smal_pizza.png'} |
||||
alt={'pizza'} |
||||
title_name={rows.name} |
||||
title_size={rows.size} |
||||
sum={rows.sum}/> |
||||
): ' Корзина пуста'} |
||||
</div> |
||||
<div className='body_additionally'> |
||||
<p className='body_additionally_text'>Добавить к заказу?</p> |
||||
<BoxScroll> |
||||
{additionally.map((name, count) => |
||||
<CardAdditionally key={count} alt={'pizza'} src={name.src}/>) |
||||
} |
||||
</BoxScroll> |
||||
</div> |
||||
</div> |
||||
<div className='basket_footer'> |
||||
<div className='promo_code_box'> |
||||
<input className='input' type="text" name="promo_code" id="promo_code" placeholder="Промокод"/> |
||||
<button className='button' type="submit">Применить</button> |
||||
</div> |
||||
<div className='check'> |
||||
<div className='box'> |
||||
<p >Доставка </p> <p className='check_text'>{delivery} ₽</p> |
||||
</div> |
||||
<div className='check_box'> |
||||
<p >{quantityGoods} товар(а) </p> |
||||
<p className='check_text'>{sum} ₽</p> |
||||
</div> |
||||
</div> |
||||
<Button styles={'yellow button_size_48'} |
||||
align={'button_align_center'} |
||||
onClick={() => console.log('add')}>Оформить заказ {sum} ₽ |
||||
</Button> |
||||
</div> |
||||
</> |
||||
); |
||||
}; |
||||
|
||||
|
@ -0,0 +1,104 @@ |
||||
import React, { useState, useEffect } from 'react'; |
||||
import Image from 'next/image'; |
||||
import Link from "next/link"; |
||||
import classNames from 'classnames'; |
||||
import { useSelector } from 'react-redux'; |
||||
import { HiMinus, HiPlus } from "react-icons/hi"; |
||||
import { CardBasketProduct, CardAdditionally } from './' |
||||
import { BoxScroll, Box } from '../../../../../../components/customer/containers'; |
||||
import {ButtonImg, Button } from '../../../../../UI'; |
||||
|
||||
type PizzaProps = { |
||||
id: number; |
||||
title: string; |
||||
heft: string[]; |
||||
description: string; |
||||
img: string[]; |
||||
price: string[]; |
||||
size: string[]; |
||||
}; |
||||
|
||||
const types=[0,1], sizes=[30,40,50], sum=0, typeNames = ['традиционное тесто','тонкое тесто'] ; |
||||
|
||||
export const PizzaModalsContentCart: React.FC<PizzaProps> = ({ |
||||
id, |
||||
title, |
||||
img, |
||||
heft, |
||||
description, |
||||
price, |
||||
size, |
||||
}) => { |
||||
//const { totalPrice, totalCount } = useSelector(({ cart }) => cart);
|
||||
const totalCount =0; |
||||
const [basket, setBasket] = useState([{name:'Ggg', size:'30 ffv', sum:345}, {name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345},{name:'Ggg', size:'30 ffv', sum:345}]); |
||||
const [quantityGoods, setQuantityGoods] = useState(basket.length); |
||||
const [additionally, setAdditionally] = useState([{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100}, |
||||
{src:'/assets/img/coca.png', name: 'Coca', price: 100},]); |
||||
|
||||
const [delivery, setDelivery] = useState(0); |
||||
|
||||
const [sum, setSum] = useState<number>(0); |
||||
|
||||
const addBasket = () => { |
||||
console.log('add'); |
||||
} |
||||
|
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<Link href={"/"} as={"/"} scroll={false}> |
||||
<button className={classNames('button_close')} onClick={addBasket}>X</button> |
||||
</Link> |
||||
<div className='header'> |
||||
<p>{totalCount} товар(а)</p> |
||||
</div> |
||||
<div className='body'> |
||||
<div className='body_order'> |
||||
{Object.keys(basket).length > 0 ? basket.map((rows, count) => |
||||
<CardBasketProduct |
||||
key={count} |
||||
src={'/assets/img/smal_pizza.png'} |
||||
alt={'pizza'} |
||||
title_name={rows.name} |
||||
title_size={rows.size} |
||||
sum={rows.sum}/> |
||||
): ' Корзина пуста'} |
||||
</div> |
||||
<div className='body_additionally'> |
||||
<p className='body_additionally_text'>Добавить к заказу?</p> |
||||
<BoxScroll> |
||||
{additionally.map((name, count) => |
||||
<CardAdditionally key={count} alt={'pizza'} src={name.src}/>) |
||||
} |
||||
</BoxScroll> |
||||
</div> |
||||
</div> |
||||
<div className='basket_footer'> |
||||
<div className='promo_code_box'> |
||||
<input className='input' type="text" name="promo_code" id="promo_code" placeholder="Промокод"/> |
||||
<button className='button' type="submit">Применить</button> |
||||
</div> |
||||
<div className='check'> |
||||
<div className='box'> |
||||
<p >Доставка </p> <p className='text'>{delivery} ₽</p> |
||||
</div> |
||||
<div className='box'> |
||||
<p >{quantityGoods} товар(а) </p> |
||||
<p className='text'>{sum} ₽</p> |
||||
</div> |
||||
</div> |
||||
<Button styles={'yellow button_size_48'} |
||||
align={'button_align_center'} |
||||
onClick={() => console.log('add')}>Оформить заказ {sum} ₽ |
||||
</Button> |
||||
</div> |
||||
</> |
||||
); |
||||
}; |
||||
|
||||
|
@ -0,0 +1,36 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_card'> |
||||
<div className='dialog'> |
||||
<div className='content'> |
||||
<div className='body'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,36 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_card'> |
||||
<div className='dialog'> |
||||
<div className='content'> |
||||
<div className='body'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,36 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_cart'> |
||||
<div className='dialog'> |
||||
<div className='content'> |
||||
<div className='body'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,34 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_cart'> |
||||
<div className='dialog'> |
||||
<div className='content'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,32 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_cart'> |
||||
<div className='dialog'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,34 @@ |
||||
import React, { useEffect } from 'react'; |
||||
import { useSelector } from 'react-redux' |
||||
import { Modal } from '../../../../../UI'; |
||||
import { useAppDispatch } from '../../../../../../redux/store'; |
||||
import { fetchPizzaToCard, selectPizzaToCartData } from '../../../../../../redux/pizzaToCart/'; |
||||
import { PizzaModalsContentCart } from './'; |
||||
|
||||
type Props = { |
||||
id: any; |
||||
otherProp?: any; |
||||
}; |
||||
|
||||
export const PizzaCart: React.FC<Props> = ({id}) => { |
||||
const dispatch = useAppDispatch(); |
||||
|
||||
useEffect(() => { |
||||
// dispatch( fetchPizzaToCard({id}) );
|
||||
}, [dispatch, id]); |
||||
|
||||
//const { pizzaToCard_items, pizzaToCard_status } = useSelector(selectPizzaToCartData);
|
||||
|
||||
//const pizza = pizzaToCard_items.map((obj, index) => <PizzaModalsContent key={index} {...obj}/> );
|
||||
//const pizzaSkeleton = [...new Array(6)].map((_, index) => <PizzaSkeleton key={index} />);
|
||||
|
||||
return ( |
||||
<div id='openModal' className='pizza_modal_cart'> |
||||
<div className='dialog'> |
||||
<div className='content'> |
||||
{<PizzaModalsContentCart id={0} title={''} heft={[]} description={''} img={[]} price={[]} size={[]} />} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
); |
||||
}; |
@ -0,0 +1,139 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.cart{ |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,139 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,149 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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 */ |
||||
|
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,143 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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 */ |
||||
|
||||
|
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,188 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
|
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,45 @@ |
||||
.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;*/ |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,45 @@ |
||||
.pizza_modal_cart { |
||||
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;*/ |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,42 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
border-radius: 20px; |
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,42 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
/*border: 1px solid #888;*/ |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,41 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,33 @@ |
||||
.pizza_modal_cart { |
||||
|
||||
|
||||
.dialog { |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,41 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,41 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,48 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,53 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,60 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,66 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,73 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,81 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,104 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
} |
||||
} |
@ -0,0 +1,119 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
} |
||||
} |
@ -0,0 +1,119 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
} |
||||
} |
@ -0,0 +1,125 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
} |
||||
} |
@ -0,0 +1,133 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,133 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,141 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,142 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
background-color: #fefefe |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
|
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,147 @@ |
||||
.pizza_modal_cart { |
||||
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) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,139 @@ |
||||
.pizza_modal_cart { |
||||
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; |
||||
} |
||||
|
||||
|
||||
|
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,131 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
|
||||
} |
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,134 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,133 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,133 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 770px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,131 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,132 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,134 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,134 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,134 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
background: white; |
||||
border: white; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
background: white; |
||||
border: white; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
background: white; |
||||
border: white; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background: white; |
||||
border: white; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,134 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background: rgba(0, 0, 0, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,137 @@ |
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background: rgba(0, 0, 0, 0); |
||||
} |
||||
|
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
|
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background: rgba(0, 0, 0, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background-color: rgba(0, 125, 215, 0.7); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0.7); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 1); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,135 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
border: 3px solid #fff; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
border: 1px solid #fff; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 50%; |
||||
border: 0px solid #fff; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 40%; |
||||
border: 0px solid #fff; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,136 @@ |
||||
.pizza_modal_cart { |
||||
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 { |
||||
/* Modal Content */ |
||||
.content { |
||||
background-color: #fefefe; |
||||
margin: auto; |
||||
@media (max-width:760px) { |
||||
height: 533px; |
||||
width: 400px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
} |
||||
|
||||
.button_close{ |
||||
right: 450px; |
||||
position: absolute; |
||||
font-size: 40px; |
||||
top: 45%; |
||||
border: 0px solid #fff; |
||||
color: #FFFFFF; |
||||
background-color: rgba(255, 255, 255, 0); |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 690px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow-y: scroll; |
||||
|
||||
@import './product_box.scss'; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
position: relative; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: inherit; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
margin-bottom: 10px; |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
|
||||
.input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
|
||||
.box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
|
||||
.text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,188 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
|
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,98 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
@media (max-width:760px) { |
||||
height: 220px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
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,98 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
@media (max-width:760px) { |
||||
height: 220px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
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,98 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
@media (max-width:760px) { |
||||
height: 220px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
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,98 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
@media (max-width:760px) { |
||||
height: 180px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 220px; |
||||
} |
||||
|
||||
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,98 @@ |
||||
$color_yellow: #FED11E; |
||||
$color_none: #dad9d8; |
||||
|
||||
.ingredients{ |
||||
text-align: center; |
||||
@media (max-width:760px) { |
||||
height: 200px; |
||||
} |
||||
|
||||
@media (min-width:780px) { |
||||
height: 220px; |
||||
} |
||||
|
||||
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,188 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
|
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
.button_close{ |
||||
right: 90px; |
||||
position: relative; |
||||
font-size: 40px; |
||||
color: azure; |
||||
} |
||||
|
||||
.header{ |
||||
width: 430px; |
||||
height: 49px; |
||||
position: absolute; |
||||
padding: 15px; |
||||
background-color: #FFFFFF; |
||||
} |
||||
|
||||
.body{ |
||||
height: calc(100vh - 670px); |
||||
width: 100%; |
||||
} |
||||
|
||||
.body_order{ |
||||
width: 100%; |
||||
height: 200%; |
||||
position: relative; |
||||
overflow: scroll; |
||||
} |
||||
|
||||
.body_additionally{ |
||||
width: 100%; |
||||
|
||||
position: absolute; |
||||
bottom: 210px; |
||||
} |
||||
|
||||
.body_additionally_text{ |
||||
font-size: 18px; |
||||
line-height: 21px; |
||||
letter-spacing: 0.02em; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.basket_footer{ |
||||
position: absolute; |
||||
bottom: 0; |
||||
width: 430px; |
||||
background-color: #FFFFFF; |
||||
height: 197px; |
||||
} |
||||
|
||||
.check{ |
||||
font-size: 18px; |
||||
line-height: 28px; |
||||
padding: 15px; |
||||
} |
||||
|
||||
.check_box{ |
||||
border-bottom: 1px dashed #8E8E93; |
||||
display: flex; |
||||
} |
||||
|
||||
.check_text{ |
||||
right: 30px; |
||||
position: absolute; |
||||
} |
||||
|
||||
.promo_input{ |
||||
border: none; |
||||
margin: 0; |
||||
outline: none; |
||||
-webkit-appearance: none; |
||||
color: #252A48; |
||||
font-size: 18px; |
||||
padding: 0px 20px 0 20px; |
||||
height: 38px; |
||||
} |
||||
|
||||
.promo_code_box{ |
||||
flex: none; |
||||
padding: 5px; |
||||
order: 0; |
||||
flex-grow: 1; |
||||
margin: 0px 12px; |
||||
border: 1px solid #8E8E93; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
.promo_button{ |
||||
border: none; |
||||
margin: 0; |
||||
padding: 0; |
||||
font-size: 18px; |
||||
line-height: 30px; |
||||
color: #1C80E3; |
||||
cursor: pointer; |
||||
transition: color .2s; |
||||
|
||||
&:hover{ |
||||
color: lighten(#000000, 10%); |
||||
} |
||||
} |
||||
} |
@ -0,0 +1,112 @@ |
||||
.modal_header{ |
||||
height: 450px; |
||||
} |
||||
|
||||
.position_basket{ |
||||
padding-top: 80px; |
||||
position: absolute; |
||||
right: 0; |
||||
} |
||||
|
||||
.pizza_modal_cart{ |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
|
||||
height: 100vh; |
||||
min-height: 600px; |
||||
width: 430px; |
||||
position: absolute; |
||||
right: 0; |
||||
left: unset !important; |
||||
background-color: #F7F7F7; |
||||
|
||||
.body_left{ |
||||
margin: 0 auto; |
||||
float: left; |
||||
position: static; |
||||
display: flex; |
||||
justify-content: center; /*Центрирование по горизонтали*/ |
||||
align-items: center; /*Центрирование по вертикали */ |
||||
width: 400px; |
||||
} |
||||
|
||||
.body_right{ |
||||
background: #F7F7F7; |
||||
width: 450px; |
||||
display: table; |
||||
float: left; |
||||
position: static; |
||||
} |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
} |
@ -1,12 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
@ -1,13 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss' |
@ -1,14 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss' |
||||
@import './components/UX/Input.scss'; |
@ -1,14 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
@ -1,15 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
@ -1,15 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
@ -1,16 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import url(); |
@ -1,16 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './'; |
@ -1,16 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/'; |
@ -1,16 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
@ -1,16 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
@ -1,17 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import url(); |
@ -1,17 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './'; |
@ -1,17 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './components/'; |
@ -1,17 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './components/Categories.scss'; |
@ -1,17 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './components/Categories.scss'; |
@ -1,18 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './components/Categories.scss'; |
||||
@import ; |
@ -1,18 +0,0 @@ |
||||
@font-face { |
||||
font-family: 'Rubik'; |
||||
src: url('../public/assets/Rubik/Rubik-Italic-VariableFont_wght.ttf'); |
||||
src: url('../public/assets/Rubik/Rubik-VariableFont_wght.ttf'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
} |
||||
|
||||
@import './libs/ResetCss.scss'; |
||||
@import './components/CardStock.scss'; |
||||
@import './components/Container.scss'; |
||||
@import './components/Header.scss'; |
||||
@import './components/Login.scss'; |
||||
@import './components/UX/Input.scss'; |
||||
@import './components/UX/Button.scss'; |
||||
@import './components/MottoBlock.scss'; |
||||
@import './components/Categories.scss'; |
||||
@import './'; |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue