calendar/app/assets/stylesheets/calendar_widget2.css

145 lines
3.0 KiB
CSS

a.event-container{
color: inherit;
}
.event-container {
display: flex;
flex-wrap: wrap;
width: 100%;
border-radius: 10px;
margin-bottom: 1em;
transition: all .3s ease;
cursor: pointer;
padding: 0.5em;
min-height: 3em;
position: relative;
}
.close_box{
font-weight: bold;
position: relative;
float: right;
padding: 0.5em;
cursor: pointer;
}
.close_box:hover{
color: red;
}
.event-bullet-event {
width: 100%;
height: 100%;
border-radius: 50%;
}
.event-bullet-event {
width: 2em;
height: 2em;
border-radius: 1em;
}
.event-container:hover {
background-color: #fff;
box-shadow: 0 0.1em 0.7em -0.25em rgba(0, 0, 0, 0.65);
}
.event-container > .event-icon {
position: absolute;
display: flex;
justify-content: center;
width: 15%;
height: 100%;
z-index: 5;
}
.event-container > .event-icon::before {
content: '';
position: absolute;
top: 1em;
left: 50%;
width: 0.1em;
height: calc(100% + 1.5em);
background-color: #eaeaea;
z-index: -1;
}
.event-container:first-child > .event-icon::before {
top: 1.5em;
position: absolute;
}
.event-container:last-child > .event-icon::before {
height: 0;
}
.event-container:only-child > .event-icon::before {
background-color: unset;
}
.event-header{
width: 100%;
text-align: center;
font-size: 1.7em;
font-weight: bold;
padding: 0.35em 0;
}
.event-info{
padding-left: 15%;
}
.calendar-events{
position: relative;
background: #fbfbfb;
}
.month_template{
position: relative;
}
.w-calendar.widget-calendar-2{
flex-wrap: wrap;
margin-top: 2em;
}
.widget-calendar-2 .w-calendar-table td:hover {
background-color: #eaeaea;
color: #333;
}
.widget-calendar-2 .w-calendar-table td {
background: inherit;
color: inherit;
cursor: pointer;
border: 0;
}
.widget-calendar-2 .w-calendar-table td div{
display: inline-flex;
justify-content: center;
align-items: center;
margin: auto;
width: 3em;
height: 3em;
}
.widget-calendar-2 .w-calendar-table th {
background: unset;
color: unset;
border: 0;
width: 3em;
height: 3em;
}
.widget-calendar-2.w-calendar .widget-title {
padding: 0.2em;
font-size: 1.5em;
}
.widget-calendar-2 table.w-calendar-table td.w-calendar-toggle div {
background: #6f0007;
border-radius: 1.5em;
color: white;
}
.widget-calendar-2 .w-calendar-table td.w-calendar-event div{
border: 1px #6f0007 solid;
background: #eee;
border-radius: 1.5em;
}
.widget-calendar-2 .w-calendar-title{
background: rgb(146, 8, 17);
color: rgb(255, 255, 255);
padding: 0px 10%;
display: flex;
flex-flow: row-reverse wrap;
line-height: 2em;
justify-content: space-between;
font-size: 1.85em;
width: 100%;
}
.calendar-dialog div.ui-dialog-content {
max-height: 20em !important;
overflow-wrap: break-word;
}
.widget-calendar-2 table td.w-calendar-other-month {
color: #999797;
}