Your IP : 18.118.166.45
.noselect {
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.left-align {
text-align: left;
}
.right-align {
text-align: right;
}
.cal1 .clndr {
.clndr-controls {
width: 100%;
position: relative;
display: flex;
padding: 15px;
border: 1px solid #f0f0f4;
border-bottom: 0;
background-color: #f9fbfd;
.month {
float: left;
width: 33%;
text-align: center;
line-height: 32px;
font-size: 18px;
font-weight: 700;
}
.clndr-control-button {
float: left;
width: 33%;
&.rightalign {
text-align: right;
width: 34%;
}
.clndr-next-button, .clndr-previous-button {
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
padding: 6px 8px;
min-width: 80px;
text-align: center;
display: inline-block;
&:hover {
color: $white;
}
&.inactive {
opacity: 0.5;
&:hover {
background: none;
cursor: default;
}
}
}
}
}
.clndr-table {
table-layout: fixed;
width: 100%;
.header-days {
height: 50px;
font-size: 10px;
.header-day {
vertical-align: middle;
text-align: center;
color: $black;
font-size: 15px;
border: #f2f3f9 solid 1px;
}
}
tr {
height: 85px;
td {
vertical-align: top;
}
.day {
width: 100%;
height: inherit;
&.today, &.my-today {
color: $black;
}
&.event:hover, &.my-event:hover {
background: #f5f6fb7a;
color: $black;
}
&.inactive, &.my-inactive {
background: #f2f4f8;
}
.day-contents {
box-sizing: border-box;
padding: 8px;
font-size: 12px;
text-align: right;
}
}
.empty, .adjacent-month, .my-empty, .my-adjacent-month {
width: 100%;
height: inherit;
}
.empty:last-child, .adjacent-month:last-child, .my-empty:last-child, .my-adjacent-month:last-child {
border-right: 1px solid #f0f0f4;
}
&:last-child {
.day, .my-day {
border-bottom: 1px solid #f0f0f4;
}
.empty, .my-empty {
border-bottom: 1px solid #d7e7ff;
}
}
}
}
}
@media (max-width: 380px) {
.cal1 .clndr .clndr-controls {
.month {
padding-left: 7px;
}
padding: 10px;
}
}
.cal2 {
max-width: 177px;
margin: 30px auto;
font-family: 'Droid Sans Mono';
.clndr {
.clndr-controls {
display: block;
display: inline-block;
width: 100%;
margin-bottom: 3px;
.clndr-previous-button {
float: left;
width: 10%;
text-align: left;
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
&:hover {
background-color: #f4f4f4;
}
}
.month {
float: left;
width: 80%;
text-align: center;
}
.clndr-next-button {
float: left;
width: 10%;
text-align: right;
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
&:hover {
background-color: #f4f4f4;
}
}
}
.clndr-grid {
text-align: center;
border: 1px solid #FF4545;
display: inline-block;
.header-day {
float: left;
width: 25px;
height: 25px;
background: #FF4545;
}
.day {
float: left;
width: 25px;
height: 25px;
&.event {
background-color: #B4E09F;
}
&.today {
background-color: #E3C57F;
}
&.selected {
background-color: #E37FD6;
}
&.inactive {
color: gray;
}
}
.empty, .adjacent-month {
float: left;
width: 25px;
height: 25px;
background: #ddd;
}
}
.clndr-today-button {
width: 100%;
text-align: center;
cursor: pointer;
&:hover {
background-color: #ddd;
}
}
}
.multi-month-controls .quarter-button {
display: inline-block;
width: 25%;
&:hover {
cursor: pointer;
background-color: #f4f4f4;
}
}
.day.inactive {
background-color: #aaa;
}
}
.cal3 {
max-width: 354px;
margin: 0 auto;
font-family: 'Droid Sans Mono';
.cal {
float: left;
width: 177px;
}
.clndr {
.clndr-controls {
display: block;
display: inline-block;
width: 100%;
margin-bottom: 8px;
&.top {
margin-bottom: -22px;
position: relative;
z-index: 1;
}
.clndr-previous-button {
float: left;
width: 10%;
text-align: left;
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
&:hover {
background-color: #f4f4f4;
}
}
.month {
text-align: center;
width: 80%;
margin: 0 auto;
}
.clndr-next-button {
float: right;
width: 10%;
text-align: right;
cursor: pointer;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
&:hover {
background-color: #f4f4f4;
}
}
}
.clndr-grid {
text-align: center;
border: 1px solid #FF4545;
display: inline-block;
.header-day {
float: left;
width: 25px;
height: 25px;
background: #FF4545;
}
.day {
float: left;
width: 25px;
height: 25px;
&.event {
background-color: #B4E09F;
}
&.today {
background-color: #E3C57F;
}
}
.empty, .adjacent-month {
float: left;
width: 25px;
height: 25px;
background: #ddd;
}
}
.clndr-today-button {
width: 100%;
text-align: center;
cursor: pointer;
&:hover {
background-color: #ddd;
}
}
}
.multi-month-controls .quarter-button {
display: inline-block;
width: 25%;
&:hover {
cursor: pointer;
background-color: #f4f4f4;
}
}
}
.clndr-next-button, .clndr-previous-button, .clndr-next-year-button, .clndr-previous-year-button {
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
}
.clndr-next-button.inactive, .clndr-previous-button.inactive, .clndr-next-year-button.inactive, .clndr-previous-year-button.inactive {
opacity: 0.5;
cursor: default;
}