kif/portal
10
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add drag and drop creation of schedule

Browse source
This commit is contained in:
Lars Westermann 2019-05-17 22:39:42 +02:00
parent b7d6476a70
commit 84f8e71239
Signed by: lars.westermann
GPG key ID: 9D417FA5BB9D5E1D
38 changed files with 1277 additions and 548 deletions
Download patch file Download diff file Expand all files Collapse all files

154
src/jsMain/resources/style/style.scss
View file

@ -220,28 +220,6 @@ a {
.table-layout-search {
float: left;
padding-bottom: 0.5rem !important;
input {
padding-right: 4rem;
}
.btn-search {
position: absolute;
top: 0;
height: 2.5rem;
line-height: 2.5rem;
right: -3px;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
margin-top: 1px;
margin-right: 2px;
}
input:focus ~ .btn-search {
border-color: $primary-color;
border-width: 2px;
}
}
.table-layout-action {
@ -470,13 +448,106 @@ form {
width: 100%;
position: relative;
margin-top: 1rem;
}
& > div {
width: calc(100% - 6rem);
overflow-x: scroll;
overflow-y: visible;
margin-left: 6rem;
padding-bottom: 1rem;
.calendar-table {
float: left;
width: 100%;
overflow-x: scroll;
overflow-y: visible;
padding-bottom: 1rem;
position: relative;
transition: width $transitionTime;
}
.calendar-edit {
width: 16rem;
display: block;
position: absolute;
right: 0;
top: -3rem;
padding-top: 3rem;
overflow: hidden;
.calendar-edit-main {
position: relative;
left: 16rem;
opacity: 0;
transition: left $transitionTime, opacity$transitionTime;
}
}
.calendar-edit-top {
position: absolute;
right: 0;
top: 0;
}
.calendar-edit-search {
padding: 0.5rem;
}
.calendar-work-group {
position: relative;
display: block;
border-radius: 0.2rem;
line-height: 2rem;
font-size: 0.8rem;
white-space: nowrap;
text-overflow: ellipsis;
background-color: $primary-color;
color: $primary-text-color;
padding: 0 0.5rem;
margin: 0.5rem;
&::after {
content: attr(data-language);
bottom: 0;
right: 1rem;
opacity: 0.6;
position: absolute;
text-transform: uppercase;
}
&:hover .calendar-tools {
display: block;
}
&.drag {
box-shadow: 0 0.1rem 0.2rem rgba($text-primary-color, 0.8);
z-index: 2;
.calendar-tools {
display: none;
}
}
&.pending::before {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: $background-primary-color;
opacity: 0.6;
}
@include no-select()
}
.calendar[data-editable = "true"].edit {
.calendar-table {
width: calc(100% - 16rem);
border-right: solid 1px rgba($text-primary-color, 0.1);
}
.calendar-edit-main {
left: 0;
opacity: 1;
}
}
@ -507,6 +578,10 @@ form {
}
}
.calendar[data-editable=false] .calendar-tools {
display: none !important;
}
.calendar-entry {
position: absolute;
display: block;
@ -555,6 +630,8 @@ form {
background-color: $background-primary-color;
opacity: 0.6;
}
@include no-select()
}
.calendar-table-time-to-room {
@ -618,7 +695,6 @@ form {
}
.calendar-cell:first-child {
position: absolute;
width: 6rem;
left: 0;
text-align: center;
@ -663,13 +739,6 @@ form {
line-height: 2rem;
height: 1.3rem;
&:nth-child(4n + 2)::before {
content: '';
position: absolute;
width: calc(100% - 6rem);
border-top: solid 1px rgba($text-primary-color, 0.1);
}
.calendar-cell {
position: relative;
width: 12rem;
@ -677,6 +746,7 @@ form {
&::before {
content: '';
height: 100%;
width: 100%;
left: 0;
top: 0;
border-left: solid 1px rgba($text-primary-color, 0.1);
@ -694,18 +764,22 @@ form {
left: 0.1rem !important;
right: 0.1rem;
}
a {
position: relative;
}
}
.calendar-cell:first-child:not(:empty)::before {
width: 100%;
top: 0;
.calendar-cell:first-child::before {
border-left: none;
}
&:nth-child(4n + 2) .calendar-cell::before {
border-top: solid 1px rgba($text-primary-color, 0.1);
}
}
.calendar-cell:first-child {
position: absolute;
width: 6rem;
left: 0;
text-align: center;