Changed datepicker style.

This commit is contained in:
Alex Tselegidis 2015-10-05 23:16:50 +02:00
parent 29a6c0f136
commit 1ab65f433f
2 changed files with 56 additions and 35 deletions

View file

@ -9,17 +9,17 @@
* @since v1.0.0 * @since v1.0.0
* ---------------------------------------------------------------------------- */ * ---------------------------------------------------------------------------- */
root { root {
display: block; display: block;
} }
html, html,
body { body {
height: 100%; height: 100%;
} }
body { body {
background-color: #CAEDF3; background-color: #CAEDF3;
} }
@ -46,12 +46,12 @@ body {
#book-appointment-wizard #header { #book-appointment-wizard #header {
padding: 5px; padding: 5px;
height: 80px; height: 90px;
background: #3DD481; background: #3DD481;
border-bottom: 4px solid #1A865F; border-bottom: 4px solid #1A865F;
} }
#book-appointment-wizard #company-name { #book-appointment-wizard #company-name {
font-weight: bold; font-weight: bold;
color: #FFF; color: #FFF;
font-size: 22px; font-size: 22px;
@ -167,9 +167,9 @@ body {
} }
#book-appointment-wizard #appointment-details p, #book-appointment-wizard #appointment-details p,
#book-appointment-wizard #customer-details p { #book-appointment-wizard #customer-details p {
font-size: 16px; font-size: 16px;
line-height: 28px; line-height: 28px;
} }
#book-appointment-wizard #wizard-frame-1 label { #book-appointment-wizard #wizard-frame-1 label {
@ -183,8 +183,8 @@ body {
/* BOOK SUCCESS & MESSAGE /* BOOK SUCCESS & MESSAGE
------------------------------------------------------------------------- */ ------------------------------------------------------------------------- */
#message-frame, #message-frame,
#success-frame { #success-frame {
background: #FFF; background: #FFF;
border: 1px solid #DDDADA; border: 1px solid #DDDADA;
padding: 70px; padding: 70px;
@ -201,7 +201,7 @@ body {
} }
/* CANCEL APPOINTMENT /* CANCEL APPOINTMENT
------------------------------------------------------------------------- */ ------------------------------------------------------------------------- */
#cancel-appointment-frame { #cancel-appointment-frame {
padding: 15px 0; padding: 15px 0;
@ -220,7 +220,7 @@ body {
/** /**
* BOOKING WIZARD * BOOKING WIZARD
*/ */
html, html,
body { body {
min-height: 100%; min-height: 100%;
} }
@ -240,17 +240,17 @@ body {
height: auto; height: auto;
} }
#book-appointment-wizard #company-name { #book-appointment-wizard #company-name {
float: none; float: none;
display: block; display: block;
text-align: center; text-align: center;
} }
#book-appointment-wizard #steps { #book-appointment-wizard #steps {
float: none; float: none;
display: block; display: block;
overflow: auto; overflow: auto;
margin: 20px auto; margin: 20px auto;
} }
#book-appointment-wizard .wizard-frame { #book-appointment-wizard .wizard-frame {
@ -310,18 +310,18 @@ body {
} }
.popover .popover-title { .popover .popover-title {
text-align: center; text-align: center;
} }
.popover .popover-content #language-list .language { .popover .popover-content #language-list .language {
margin: 10px 0; margin: 10px 0;
} }
/** /**
* BOOK SUCCESS * BOOK SUCCESS
*/ */
#message-frame, #message-frame,
#success-frame { #success-frame {
text-align: center; text-align: center;
height: 100%; height: 100%;
border: none; border: none;
@ -346,4 +346,4 @@ body {
.ui-dialog .ui-dialog-title { .ui-dialog .ui-dialog-title {
font-size: 1.2em; font-size: 1.2em;
} }
} }

View file

@ -45,36 +45,57 @@ body .ui-dialog .ui-dialog-buttonpane {
} }
body .ui-datepicker { body .ui-datepicker {
border: 1px solid #EDEDED; border: 1px solid #3DD481;
border-top-left-radius: 5px; border-radius: 2px;
border-top-right-radius: 5px; padding: 0;
} }
body .ui-datepicker .ui-widget-header { body .ui-datepicker .ui-widget-header {
border: none; border: none;
border-top-left-radius: 4px !important; background: #3DD481;
border-top-right-radius: 4px !important; }
body .ui-datepicker th {
background: #3DD481;
color: #FFF;
}
body .ui-datepicker tbody tr:first-child td {
margin-top: 5px;
} }
body .ui-datepicker td a, body .ui-datepicker td a,
body .ui-datepicker td span { body .ui-datepicker td span {
border-radius: 2px; border: none !important;
background: none !important;
color: #1A865F !important;
text-align: center !important; text-align: center !important;
box-sizing: border-box; width: 32px;
height: 32px; height: 32px;
line-height: 2;
} }
body .ui-datepicker td a.ui-state-active { html body .ui-datepicker td a.ui-state-active {
background: #80E1AC url("images/ui-bg_flat_65_80e1ac_40x100.png") 50% 50% repeat-x !important;
color: #FFF !important; color: #FFF !important;
font-weight: bold !important; font-weight: bold !important;
border-bottom: 2px solid #33C073 !important; background: #3DD481 !important;
box-shadow: inset 0 0px 3px #FFF; border-radius: 50px;
} }
body .ui-datepicker td a.ui-state-highlight { body .ui-datepicker td a.ui-state-highlight {
border: none; background: #80E3AD !important;
color: #E29656; border-radius: 67px;
color: #FFF !important;
}
body .ui-datepicker .ui-datepicker-prev-hover {
top: 2px !important;
left: 2px !important;
}
body .ui-datepicker .ui-datepicker-next-hover {
top: 2px !important;
right: 2px !important;
} }
.breaks tr:hover td { .breaks tr:hover td {