updated order-begin box
This commit is contained in:
arzynik
parent
249b0873f9
commit
17d5ff788a
@ -51,18 +51,21 @@
|
||||
<div class="your-order-label" style="font-weight: bold; display: none;">(we've chosen the most popular order, but you can order anything you want)</div>
|
||||
<div class="divider"></div>
|
||||
|
||||
<div ng-show="!order.cart.hasItems()" class="order-begin">
|
||||
<div class="icon">
|
||||
<i class="icon-arrow-left desktop"></i>
|
||||
<i class="icon-arrow-down mobile"></i>
|
||||
</div>
|
||||
<div class="text">
|
||||
Begin by clicking on anything from our curated menu
|
||||
<span class="desktop"> on the left!</span>
|
||||
<span class="mobile"> below!</span>
|
||||
<div ng-show="!order.cart.hasItems()" class="order-begin-wrap">
|
||||
<div class="order-begin">
|
||||
<div class="icon">
|
||||
<i class="icon-arrow-left desktop"></i>
|
||||
<i class="icon-arrow-down mobile"></i>
|
||||
</div>
|
||||
<div class="text">
|
||||
Begin by clicking on anything from our curated menu
|
||||
<span class="desktop"> on the left!</span>
|
||||
<span class="mobile"> below!</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
|
||||
<div ng-show="order.info.deliveryMinDiff && order.cart.hasItems()" class="delivery-minimum-error">
|
||||
Add $<span class="delivery-min-diff">{{order.info.deliveryMinDiff}}</span> from menu to meet delivery minimum.
|
||||
|
||||
@ -977,19 +977,6 @@ html[xmlns] .clearfix {
|
||||
|
||||
@media only screen and (max-width : 1023px) {
|
||||
|
||||
.order-begin{
|
||||
margin-right: auto !important;
|
||||
margin-left: auto !important;
|
||||
margin-bottom: 30px !important;
|
||||
}
|
||||
|
||||
.order-begin .desktop{
|
||||
display: none !important;
|
||||
}
|
||||
.order-begin .mobile{
|
||||
display: inline !important;
|
||||
}
|
||||
|
||||
.home-tagline, .home-welcome {
|
||||
text-align: center;
|
||||
}
|
||||
@ -2787,43 +2774,7 @@ strong {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.order-begin{
|
||||
background: #fdf6f0;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
border:2px solid #f34b24;
|
||||
color: #666;
|
||||
font-size:13px;
|
||||
line-height: 22px;
|
||||
text-align: left !important;
|
||||
text-shadow: 1px 1px 0 rgba(0,0,0,.10);
|
||||
width: 310px;
|
||||
color: #d74924;
|
||||
display: block;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
padding: 15px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
.order-begin .icon, .order-begin .content{
|
||||
float: left;
|
||||
display: block;
|
||||
height: 30px;
|
||||
}
|
||||
.order-begin .icon{
|
||||
font-size: 25px;
|
||||
width: 35px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.order-begin .text{
|
||||
width: 300px;
|
||||
}
|
||||
.order-begin .desktop{
|
||||
display: inline;
|
||||
}
|
||||
.order-begin .mobile{
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* unused blurs
|
||||
|
||||
|
||||
@ -641,3 +641,85 @@ html {
|
||||
.side-menu-wrap {
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.order-begin-wrap {
|
||||
background: #fff6f4;
|
||||
background: -moz-linear-gradient(top, #fff6f4 0%, #fdf6f0 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff6f4), color-stop(100%,#fdf6f0));
|
||||
background: -webkit-linear-gradient(top, #fff6f4 0%,#fdf6f0 100%);
|
||||
background: -o-linear-gradient(top, #fff6f4 0%,#fdf6f0 100%);
|
||||
background: -ms-linear-gradient(top, #fff6f4 0%,#fdf6f0 100%);
|
||||
background: linear-gradient(to bottom, #fff6f4 0%,#fdf6f0 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff6f4', endColorstr='#fdf6f0',GradientType=0 );
|
||||
|
||||
color: #d74924;
|
||||
text-shadow: rgba(255, 255, 255, 0.6) 1px 1px 0px;
|
||||
box-shadow: inset 0px 1px 0px 0px #fff;
|
||||
border: 2px solid #f34b24;
|
||||
|
||||
border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
padding: .9em;
|
||||
|
||||
line-height: 1.5em;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.order-begin {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.order-begin .icon, .order-begin .text {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.order-begin .icon {
|
||||
padding: 0 .5em 0 0;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width : 767px) {
|
||||
.order-begin .icon {
|
||||
font-size: 23px;
|
||||
}
|
||||
.order-begin-wrap {
|
||||
margin-bottom: 20px;
|
||||
background: #f34b24;
|
||||
color: #fff;
|
||||
text-shadow: none;
|
||||
text-shadow: 1px 1px 0px #b43518;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width : 768px) {
|
||||
.order-begin-wrap {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width : 1023px) {
|
||||
.order-begin .desktop{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width : 1024px) {
|
||||
.order-begin-wrap {
|
||||
width: 310px;
|
||||
}
|
||||
.order-begin .mobile {
|
||||
display: none;
|
||||
}
|
||||
.order-begin-wrap {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user