first migration
This commit is contained in:
zino
486
seatmap-client/style.css
Normal file
486
seatmap-client/style.css
Normal file
@@ -0,0 +1,486 @@
|
||||
body {
|
||||
background-color: #e9e9e9;
|
||||
margin: 2em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #b71a4c;
|
||||
}
|
||||
|
||||
.front-indicator {
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.2vw;
|
||||
margin-bottom: 1vw;
|
||||
margin-top: 5vw;
|
||||
display: inline-grid;
|
||||
}
|
||||
|
||||
.stage-indicator {
|
||||
display: inline-grid;
|
||||
background-color: none;
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
width: 100% !important;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.booking-details {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.booking-details p,li {
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.booking-details h2 {
|
||||
margin: 0px 0 10px 0;
|
||||
font-size: 1.2vw;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.booking-details h3 {
|
||||
margin: 0px 0 10px 0;
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
div.seatCharts-cell {
|
||||
color: #182C4E;
|
||||
background-color: #e9e9e9;
|
||||
}
|
||||
|
||||
div.seatCharts-seat {
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.seatCharts-row {
|
||||
/*height: 35px;*/
|
||||
height: 1vw;
|
||||
}
|
||||
|
||||
div.seatCharts-seat.available {
|
||||
background-color: #B9DEA0;
|
||||
}
|
||||
|
||||
div.seatCharts-seat.available.first-class {
|
||||
/* background: url(vip.png); */
|
||||
background-color: #3a78c3;
|
||||
}
|
||||
|
||||
div.seatCharts-seat.focused {
|
||||
background-color: #76B474;
|
||||
}
|
||||
|
||||
div.seatCharts-seat.selected {
|
||||
background-image: url("img/iconfinder_tick_216457.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
/*background-size: 100% 100%, auto;*/
|
||||
background-size: 100% 100%, auto;
|
||||
}
|
||||
|
||||
div.seatCharts-seat.unavailable {
|
||||
/*background-color: red;*/
|
||||
cursor: not-allowed;
|
||||
background: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><path d='M100 0 L0 100 ' stroke='black' stroke-width='10'/><path d='M0 0 L100 100 ' stroke='black' stroke-width='10'/></svg>");
|
||||
background-image: url("img/iconfinder_basics-22_296812.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: 100% 100%, auto;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
/*div.seatCharts-seat.unavailable:before {*/
|
||||
|
||||
/* background: #037CA9;*/
|
||||
|
||||
/* content: "";*/
|
||||
|
||||
/* width: 10px;*/
|
||||
|
||||
/* height: 5px;*/
|
||||
|
||||
/* position: absolute;*/
|
||||
|
||||
/* top: 5px;*/
|
||||
|
||||
/* left: -5px;*/
|
||||
|
||||
/*}*/
|
||||
|
||||
div.seatCharts-container {
|
||||
/*border-right: 1px dotted #adadad;*/
|
||||
width: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div.seatCharts-legend {
|
||||
/*padding-left: 0px;*/
|
||||
/*position: absolute;*/
|
||||
/*bottom: 16px;*/
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
||||
ul.seatCharts-legendList {
|
||||
padding-left: 0px;
|
||||
display: grid;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
span.seatCharts-legendDescription {
|
||||
margin-left: 0.5vw;
|
||||
line-height: 1.2vw;
|
||||
/*font-size: 1vw;*/
|
||||
}
|
||||
|
||||
.checkout-button {
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#selected-seats {
|
||||
max-height: 90px;
|
||||
overflow-y: scroll;
|
||||
overflow-x: none;
|
||||
width: 170px;
|
||||
}
|
||||
|
||||
#spacer {
|
||||
/*margin: 40px 0px 0px 0px;*/
|
||||
margin: 2vw 0vw 0vw 0vw;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0px !important;
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.top-buffer-20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.top-buffer-25 {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.top-buffer-30 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
div.seatCharts-cell {
|
||||
margin: 0.2vw;
|
||||
}
|
||||
|
||||
#logo {
|
||||
width: 50%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
;
|
||||
}
|
||||
|
||||
.container-fluid {
|
||||
visibility: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
/*padding-right: 1vw;*/
|
||||
/*padding-left: 1vw;*/
|
||||
/*margin-right: auto;*/
|
||||
/*margin-left: auto;*/
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.2vw;
|
||||
}
|
||||
|
||||
/*.row {*/
|
||||
|
||||
/* display: -webkit-box;*/
|
||||
|
||||
/* display: -webkit-flex;*/
|
||||
|
||||
/* display: -ms-flexbox;*/
|
||||
|
||||
/* display: flex;*/
|
||||
|
||||
/* flex-wrap: wrap;*/
|
||||
|
||||
/*}*/
|
||||
|
||||
/*.row > [class*='col-'] {*/
|
||||
|
||||
/* display: flex;*/
|
||||
|
||||
/* flex-direction: column;*/
|
||||
|
||||
/*}*/
|
||||
|
||||
.centered {
|
||||
position: fixed;
|
||||
/* or absolute */
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
/* bring your own prefixes */
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
/*SHOPPING CART*/
|
||||
|
||||
/*.badge-notify{*/
|
||||
|
||||
/* background:red;*/
|
||||
|
||||
/* position:relative;*/
|
||||
|
||||
/* top: -20px;*/
|
||||
|
||||
/* right: 10px;*/
|
||||
|
||||
/*}*/
|
||||
|
||||
/*.my-cart-icon-affix {*/
|
||||
|
||||
/* position: fixed;*/
|
||||
|
||||
/* z-index: 999;*/
|
||||
|
||||
/*}*/
|
||||
|
||||
.glyphicon {
|
||||
font-size: 2vw;
|
||||
top: -.2vw;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
width: 20px;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
#my-cart-table td {
|
||||
vertical-align: middle;
|
||||
padding: 10px 0px 10px 0px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.selectBuyerTypes {
|
||||
width: 200px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.badge {
|
||||
padding: 0.3vw 0.5vw 0.5vw 0.5vw !important;
|
||||
font-size: 0.7vw !important;
|
||||
display: inline-block;
|
||||
padding: 3px 7px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.modal-backdrop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.badge-notify {
|
||||
background: red;
|
||||
position: relative;
|
||||
top: -0.8vw;
|
||||
right: 0.5vw;
|
||||
}
|
||||
|
||||
.my-cart-icon-affix {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
li.seatCharts-legendItem {
|
||||
margin-top: 0.2vw;
|
||||
line-height: 1.8vw;
|
||||
}
|
||||
|
||||
#border {
|
||||
width: 80vw;
|
||||
margin: auto;
|
||||
border-bottom: 1px dotted #ccc;
|
||||
}
|
||||
|
||||
#eventDesc {
|
||||
text-decoration: underline;
|
||||
font-weight: bold;
|
||||
font-family: "Bodoni","Times New Roman",Times,serif;
|
||||
}
|
||||
|
||||
#venueList {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#venueDesc {
|
||||
font-family: "Franklin Gothic Medium","Times New Roman",Times,serif;
|
||||
}
|
||||
|
||||
#datetime_DE {
|
||||
font-family: "Franklin Gothic Medium","Times New Roman",Times,serif;
|
||||
}
|
||||
|
||||
.buttonOpenCart {
|
||||
background-color: dimgrey;
|
||||
color: floralwhite;
|
||||
font-size: 1vw;
|
||||
opacity: 0.8;
|
||||
text-align: center;
|
||||
transition: 0.3s;
|
||||
cursor: pointer;
|
||||
padding-top: 1vw;
|
||||
width: 20vw;
|
||||
}
|
||||
|
||||
.buttonOpenCart:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#divCart {
|
||||
margin-top: 1vw;
|
||||
}
|
||||
|
||||
#mycart {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Start by setting display:none to make this hidden.
|
||||
Then we position it in relation to the viewport window
|
||||
with position:fixed. Width, height, top and left speak
|
||||
for themselves. Background we set to 80% white with
|
||||
our animation centered, and no-repeating */
|
||||
|
||||
.modal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: rgba( 255, 255, 255, .8) url('img/30.svg') 50% 60% no-repeat;
|
||||
}
|
||||
|
||||
.modal:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba( 255, 255, 255, .8) url('img/Tickets-small.png') 50% 50% no-repeat;
|
||||
}
|
||||
|
||||
.modal.special:before {
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* When the body has the loading class, we turn
|
||||
the scrollbar off with overflow:hidden */
|
||||
|
||||
body.loading .modal {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Anytime the body has the loading class, our
|
||||
modal element will be visible */
|
||||
|
||||
body.loading .modal {
|
||||
display: block;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
#seatmap_version {
|
||||
text-align: right;
|
||||
font-style: italic;
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: #e9e9e9;
|
||||
min-width: 400px;
|
||||
}
|
||||
|
||||
.jBox-closeButton-box:before {
|
||||
top: 0.7vw;
|
||||
}
|
||||
|
||||
.jBox-closeButton-box .jBox-closeButton {
|
||||
top: 0.7vw;
|
||||
}
|
||||
|
||||
.jBox-content {
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 2vw;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.cartFont {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#screenTooSmall {
|
||||
display: none;
|
||||
font-size: 1.5vw;
|
||||
}
|
||||
|
||||
#IEdetected {
|
||||
display: none;
|
||||
font-size: 1.5vw;
|
||||
}
|
||||
|
||||
.rowBooking {
|
||||
width: 60%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/*ONLY IE < 10*/
|
||||
|
||||
/*@media all and (-ms-high-contrast: none),*/
|
||||
/*(-ms-high-contrast: active) {*/
|
||||
/* div.seatCharts-cell {*/
|
||||
/* height: 1.36vw;*/
|
||||
/* width: 1.36vw;*/
|
||||
/* }*/
|
||||
/*}*/
|
||||
|
||||
/*@media (min-width: 531px) and (max-width:770px) {*/
|
||||
/* div.seatCharts-cell {*/
|
||||
/* height: 1.33vw;*/
|
||||
/* width: 1.33vw;*/
|
||||
/* }*/
|
||||
/*}*/
|
||||
|
||||
/*@media (min-width: 400px) and (max-width:530px) {*/
|
||||
/* div.seatCharts-cell {*/
|
||||
/* height: 1.301vw;*/
|
||||
/* width: 1.301vw;*/
|
||||
/* }*/
|
||||
/* .glyphicon {*/
|
||||
/* display: none;*/
|
||||
/* }*/
|
||||
/*}*/
|
||||
Reference in New Issue
Block a user