| Server IP : 85.13.141.101 / Your IP :
216.73.216.95 [
Web Server : Apache System : Linux dd40236 6.8.0-134-generic #134-Ubuntu SMP PREEMPT_DYNAMIC Fri Jun 26 18:43:11 UTC 2026 x86_64 User : w00ad34b ( 1052) PHP Version : 8.2.30-nmm1 Disable Function : NONE Domains : 429 Domains MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /www/htdocs/w00ad34b/spd-cloud/apps/tasks/css/ |
Upload File : |
$color-border: nc-darken($color-main-background, 8%);
#app-navigation {
& > ul {
display: flex;
flex-direction: column;
& > li {
display: inline-flex;
flex-wrap: wrap;
order: 1;
flex-shrink: 0;
& > a,
& > ul > li > a {
flex: 1 1 0;
z-index: 100;
}
& .app-navigation-entry-bullet,
& > ul > li > .app-navigation-entry-bullet {
position: absolute;
display: block;
margin: 16px;
width: 12px;
height: 12px;
border: none;
border-radius: 50%;
cursor: pointer;
}
& .app-navigation-entry-menu,
& > ul > li > .app-navigation-entry-menu {
top: 44px;
}
& > a,
& > .app-navigation-entry-deleted {
padding-left: 44px !important;
}
}
}
& .app-navigation-entry-utils {
flex: 0 1 auto;
position: unset;
}
& .active.with-menu > a,
& .with-counter > a {
padding-right: 12px;
}
li .app-navigation-entry-menu > ul > li > a {
line-height: 36px;
height: 36px;
min-height: 36px;
display: flex;
}
.app-navigation-entry-edit {
height: auto;
form {
display: inline-flex;
width: 100%;
}
}
}
.bubble,
.app-navigation-entry-menu,
.popovermenu {
box-shadow: unset;
filter: drop-shadow(0 1px 3px rgba(179, 179, 179, .75));
}
$border-radius: 3px;
/* ---- jQuery UI datepicker ---- */
.ui-widget.ui-datepicker {
margin-top: 10px;
padding: 4px 8px;
width: auto;
border-radius: $border-radius;
border: none;
background: unset;
background-color: $color-main-background;
filter: drop-shadow(0 1px 3px rgba(179, 179, 179, .75));
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
border: 1px solid transparent;
background: inherit;
}
.ui-widget-header {
padding: 7px;
font-size: 13px;
border: none;
background-color: $color-main-background;
color: $color-main-text;
.ui-datepicker-title {
line-height: 1;
font-weight: 300;
}
.ui-icon {
opacity: .5;
&.ui-icon-circle-triangle-e {
background: url('../img/arrow-right.svg') center center no-repeat;
}
&.ui-icon-circle-triangle-w {
background: url('../img/arrow-left.svg') center center no-repeat;
}
}
.ui-state-hover .ui-icon {
opacity: 1;
}
}
.ui-datepicker-calendar {
th {
font-weight: normal;
color: nc-lighten($color-main-text, 33%);
opacity: .8;
}
tr:hover {
background-color: inherit;
}
td {
> * {
border-radius: 50%;
text-align: center;
font-weight: normal;
color: $color-main-text;
padding: 6px;
line-height: 12px;
}
&.ui-datepicker-today a:not(.ui-state-hover) {
background-color: nc-lighten($color-main-text, 86%);
}
&.ui-datepicker-current-day a.ui-state-active,
.ui-state-hover,
.ui-state-focus {
background-color: $color-primary;
color: $color-primary-text;
font-weight: bold;
}
&.ui-datepicker-week-end :not(.ui-state-hover),
.ui-priority-secondary:not(.ui-state-hover) {
color: nc-lighten($color-main-text, 33%);
opacity: .8;
}
}
}
}
.ui-datepicker-prev,
.ui-datepicker-next {
border: nc-darken($color-main-background, 14%);
background: $color-main-background;
}
/* ---- jQuery UI timepicker ---- */
.ui-widget.ui-timepicker {
margin-top: 10px !important;
width: auto !important;
border-radius: $border-radius;
filter: drop-shadow(0 1px 3px rgba(179, 179, 179, .75));
.ui-widget-content {
border: none !important;
background: unset;
background-color: $color-main-background;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
border: 1px solid transparent;
background: inherit;
}
.ui-widget-header {
padding: 7px;
font-size: 13px;
border: none;
background-color: $color-main-background;
color: $color-main-text;
.ui-timepicker-title {
line-height: 1;
font-weight: 300;
}
}
.ui-timepicker-table {
th {
font-weight: normal;
color: nc-lighten($color-main-text, 33%);
opacity: .8;
}
tr:hover {
background-color: inherit;
}
td {
> * {
border-radius: 50%;
text-align: center;
font-weight: normal;
color: $color-main-text;
padding: 8px 7px;
font-size: .9em;
line-height: 12px;
}
&.ui-timepicker-hour-cell a.ui-state-active,
&.ui-timepicker-minute-cell a.ui-state-active,
.ui-state-hover,
.ui-state-focus {
background-color: $color-primary;
color: $color-primary-text;
font-weight: bold;
}
&.ui-timepicker-minutes:not(.ui-state-hover) {
color: nc-lighten($color-main-text, 33%);
}
&.ui-timepicker-hours {
border-right: 1px solid $color-border;
}
}
}
}
.ui-datepicker::after,
.ui-timepicker.ui-widget::after {
left: 47%;
bottom: 100%;
border: solid transparent;
content: ' ';
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(0, 0, 0, 0);
border-bottom-color: #fff;
border-width: 9px;
margin-left: -9px;
}
.icon {
background: url("../img/sprites.svg") no-repeat;
}
.icon-add {
background-position: 20% 0;
}
.icon-all {
background-position: 80% 20%;
}
.icon-alphabetically {
background-position: 0 20%;
}
.icon-calendar {
background-position: 20% 20%;
}
.icon-calendar-due {
background-position: 40% 0;
}
.icon-calendar-overdue {
background-position: 40% 20%;
}
.icon-checkmark {
background-position: 0 40%;
}
.icon-checkmark-color {
background-position: 20% 40%;
}
.icon-clock {
background-position: 40% 40%;
}
.icon-clock-due {
background-position: 60% 0;
}
.icon-clock-overdue {
background-position: 60% 20%;
}
.icon-close {
background-position: 60% 40%;
}
.icon-current {
background-position: 0 60%;
}
.icon-hide {
background-position: 20% 60%;
}
.icon-list {
background-position: 40% 60%;
}
.icon-manual {
background-position: 60% 60%;
}
.icon-note {
background-position: 80% 0;
}
.icon-percent {
background-position: 0 0;
}
.icon-percent-active {
background-position: 80% 40%;
}
.icon-random {
background-position: 80% 60%;
}
.icon-settings {
background-position: 0 80%;
}
.icon-sort-down {
background-position: 20% 80%;
}
.icon-sort-up {
background-position: 40% 80%;
}
.icon-subtasks-hidden,
.icon-subtasks-hidden\:regular {
background-position: 60% 80%;
}
.icon-subtasks-hidden:hover,
.icon-subtasks-hidden\:hover {
background-position: 80% 80%;
}
.icon-subtasks-visible {
background-position: 100% 0;
}
.icon-tag {
background-position: 100% 20%;
}
.icon-tag-active {
background-position: 100% 40%;
}
.icon-task-star {
background-position: 100% 60%;
}
.icon-task-star-high {
background-position: 100% 80%;
}
.icon-task-star-low {
background-position: 0 100%;
}
.icon-task-star-medium {
background-position: 20% 100%;
}
.icon-toggle {
background-position: 40% 100%;
}
.icon-trash {
background-position: 60% 100%;
}
/**
* SCSS variables
*/
//colors
$red: $color-error; // warnings and errors
$red_overdue: #b3312d; // overdue dates and high importance
$yellow: #fd0; // medium importance
$blue_due: #4271a6; // due dates and low importance
$gray_dark: #404040; // text
$gray: #a0a0a0; // inactive text, checkbox-borders and separators
$gray_light: #ccc;
$gray_easy: #f7f7f7;
$black: #000;
$white: #fff;
/**
* rules for app-navigation
*/
#app-navigation {
> ul {
> li {
background-image: unset;
> a {
background-image: unset;
background-position: inherit;
}
.sprite::before {
content: '';
position: absolute;
z-index: -1;
width: 16px;
height: 16px;
background: url('../../../apps/tasks/css/../img/sprites.svg') no-repeat;
margin: 14px;
margin-left: -30px;
background-position: inherit;
}
&.active .app-navigation-entry-bullet {
height: 16px;
width: 16px;
margin: 14px;
}
&.edit {
> a,
.app-navigation-entry-utils,
.app-navigation-entry-menu {
display: none;
}
.app-navigation-entry-edit.name {
display: inline-block;
position: relative;
}
}
&.animate-up {
display: none;
}
&.list:not(.active) .app-navigation-entry-utils-menu-button {
display: none;
}
&.caldav .app-navigation-entry-edit.caldav {
display: inline-block;
height: auto;
}
.app-navigation-entry-edit {
padding-left: 5px !important;
&.name,
&.caldav {
display: none;
}
}
.error input.edit {
color: $red;
border-color: $red !important;
box-shadow: 0 0 6px rgba($red, .3);
}
}
}
.app-navigation-entry-edit {
&.name input[type="text"] {
width: calc(100% - 72px);
}
&.caldav input[type="text"] {
width: calc(100% - 36px);
}
input.action {
background-color: $gray_easy;
width: 36px;
border-left: 0 none;
background-position: center;
cursor: pointer;
&:hover {
border-left: 1px solid;
margin-left: -1px;
width: 37px;
}
}
}
.app-navigation-entry-utils li {
font-size: 100%;
}
.app-navigation-entry-menu li {
float: inherit;
width: auto !important;
cursor: pointer;
&:hover a {
opacity: 1 !important;
}
&.confirmed a {
&.confirmation-confirm {
display: inline-block !important;
opacity: 1;
}
&.confirmation-abort {
display: inline-block !important;
opacity: 1;
}
}
img {
cursor: pointer;
margin-right: 5px;
vertical-align: text-bottom;
}
span {
cursor: pointer;
}
button {
float: inherit;
}
}
> ul ul.colorpicker-list {
display: inline-flex;
}
}
/**
* rules for colorpicker
*/
.colorpicker {
display: block;
height: 30px;
height: auto;
padding-bottom: 3px;
padding-top: 3px;
.colorpicker-list {
display: flex;
flex-wrap: wrap;
width: 100%;
height: 100%;
text-align: center;
justify-content: center;
align-items: center;
li {
height: 24px;
width: calc(100% / 10) !important;
&.selected {
border: 1px solid $gray_dark;
}
&.randomcolour {
cursor: pointer;
.icon-random {
filter: invert(1);
opacity: 1;
}
}
}
}
}
/**
* rules for confirmation directive
*/
.app-navigation-entry-menu {
li > a {
&:not(:empty).confirmation-confirm {
padding: 0 !important;
}
span.countdown {
background-color: inherit;
color: $white;
display: block;
text-align: center;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
}
}
}
.confirmation-default {
overflow: hidden;
}
.confirmed {
.confirmation-default {
display: none !important;
}
&.active {
.confirmation-confirm {
cursor: pointer !important;
}
.countdown {
visibility: hidden;
}
}
}
.confirmation-abort {
width: 50% !important;
display: none !important;
padding: 0 !important;
background-position: center !important;
}
.confirmation-confirm {
@extend .confirmation-abort;
background-color: $red !important;
cursor: default !important;
}
/**
* rules for settings area
*/
#app-settings-content {
.icon {
margin-top: -3px;
}
li {
line-height: 3em;
position: relative;
height: 40px;
&.headline {
font-weight: bold;
line-height: 1.5em;
}
.label-container {
white-space: nowrap;
padding-right: 115px;
text-overflow: ellipsis;
width: 100%;
overflow: hidden;
height: 100%;
float: left;
}
select {
position: absolute;
right: 0;
float: right;
min-width: 105px;
}
}
}
#collection_today > a > span.date {
position: absolute;
font-size: 7px;
left: 18px;
top: 1.5px;
}
#app-settings .label-container span.icon {
font-size: 7px;
font-weight: bold;
line-height: 21px;
text-align: center;
}
/**
* rules for app-content
*/
* {
margin: 0;
padding: 0;
text-decoration: none;
}
#content {
color: $gray_dark;
}
#app-content {
overflow-x: hidden;
#add-task {
margin: 12px 0;
position: relative;
border: 1px solid $gray_light;
width: calc(100% - 56px);
float: left;
height: 34px;
&.focus {
background-color: $white;
}
.icon {
position: absolute;
top: 6px;
}
input {
font-size: 13px;
width: 100%;
color: $gray_dark;
border: medium none !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 60px 0 32px;
margin: 0;
cursor: text;
outline: none;
min-height: 32px;
}
}
.content-wrapper {
padding: 6px 17px 75px;
box-sizing: border-box;
height: 100%;
overflow: hidden;
.task-list {
height: 100%;
width: 100%;
overflow-y: auto;
}
.task-body .title-wrapper span.title a {
cursor: pointer;
text-decoration: underline;
}
}
.task-list {
.loadmore {
font-size: 11px;
margin-top: 10px;
text-align: center;
span {
color: $gray;
background-color: $gray_easy;
border-radius: 10px;
padding: 3px 6px;
&:hover {
cursor: pointer;
color: $gray_dark;
}
}
}
.grouped-tasks {
position: relative;
}
.completed-hidden ol.completed-tasks {
display: none;
}
}
h2 {
font-weight: bold;
font-size: 13px;
margin-bottom: 10px;
margin-top: 20px !important;
word-wrap: break-word;
opacity: .5;
&:hover {
opacity: .7;
}
&.heading-hiddentasks {
display: inline-block;
padding-right: 16px;
background-position: right center;
cursor: pointer;
}
}
}
ol[dnd-list] {
.dndDraggingSource {
display: none;
}
.dndPlaceholder {
display: block;
background-color: $gray_light;
min-height: 37px;
}
.copy.dndDraggingSource {
display: block;
}
}
.dropzone-visible > ol[dnd-list] {
min-height: 50px;
}
/**
* rules for task-items
*/
.task-item {
cursor: default;
min-height: 37px;
list-style: none outside none;
overflow: hidden;
margin-top: -1px;
&:first-child {
margin-top: 0;
.task-body {
border-width: 1px;
}
}
&.done .task-body {
opacity: .6;
.title {
text-decoration: line-through;
}
}
&.add-subtask {
background: $white;
border: 1px solid $gray_light;
input {
background: transparent none repeat scroll 0 0 !important;
border: medium none !important;
border-radius: 0 !important;
box-shadow: none !important;
box-sizing: border-box;
color: $gray_dark;
cursor: text;
font-size: 100%;
margin: 0;
padding: 0 60px 0 32px;
width: 100%;
min-height: 36px;
}
}
.subtasks-container {
margin-left: 35px;
&.subtaskshidden li.subtask {
display: none;
}
.task-item {
margin-top: -1px;
}
}
}
.task-body {
background-color: $white;
height: 37px;
list-style: none outside none;
margin: 0;
position: relative;
border-style: solid;
border-width: 1px;
border-color: $gray_light;
overflow: hidden;
&:hover,
&.active {
background-color: $gray_easy;
box-shadow: inset 4px 0 var(--color-primary);
}
&.attachment .icon.icon-note {
display: inline-block;
float: right;
}
&.subtasks .icon.subtasks {
display: inline-block;
}
&.completedsubtasks .icon.toggle-completed-subtasks {
display: inline-block;
}
.categories-list {
display: inline-block;
vertical-align: middle;
li {
background-color: $gray_easy;
border: 1px solid $gray_light;
border-radius: 2px;
color: $gray;
float: left;
font-weight: bold;
margin: -2px 4px 0;
padding: 2px 5px;
}
}
.icon {
&.large {
margin: 8px;
}
&.task-separator {
cursor: default;
height: 100%;
left: 34px;
position: absolute;
top: 1px;
background: unset;
width: 2px;
border-left: 1px dotted $gray;
}
&.icon-add {
&:hover {
opacity: 1;
}
}
&.subtasks {
display: none;
}
&.toggle-completed-subtasks {
display: none;
}
}
.title-wrapper {
cursor: pointer;
color: $gray_dark;
display: block;
line-height: 16px;
margin: 0 0 0 44px;
overflow: hidden;
padding: 9px 0;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
.title {
cursor: text;
}
}
.duedate {
color: $blue_due;
float: right;
font-size: 11px;
line-height: 14px;
margin: 10px;
&.overdue {
color: $red_overdue;
}
}
.listname {
color: $gray;
float: right;
font-size: 11px;
line-height: 14px;
margin: 10px;
}
.percentbar {
height: 3px;
position: relative;
top: 28px;
left: 42px;
margin-right: 103px;
margin-bottom: -5px;
background-color: $gray_light;
border-radius: 2px;
.percentdone {
height: 3px;
border-radius: 2px 0 0 2px;
opacity: .75;
}
}
}
.template {
display: none;
}
/**
* rules for app-sidebar
*/
#app-sidebar {
.flex-container {
display: flex;
flex-direction: column;
height: 100%;
}
.content-wrapper {
padding: 0;
box-sizing: border-box;
height: 100%;
overflow: hidden;
.notice {
color: $gray;
font-size: 16px;
position: absolute;
text-align: center;
top: 50%;
width: 100%;
}
.footer {
border-top: 1px solid $gray_light;
flex: 0 0 auto;
height: 30px;
a {
padding: 7px;
&.left {
float: left;
}
&.right {
float: right;
}
.icon {
display: block;
}
}
}
.title {
flex: 0 0 auto;
background-color: $gray_easy;
border-bottom: 1px solid $gray_light;
font-size: 16px;
font-weight: bold;
min-height: 50px;
word-wrap: break-word;
&.editing {
.title-text {
display: none !important;
}
.expandable-container {
display: inline-block !important;
}
}
.title-text {
cursor: text;
display: inline-block;
min-height: 24px;
margin: 13px 0;
width: calc(100% - 115px);
padding: 0 6px;
line-height: 22px;
// this border is to adjust the size of the div to the size
// of the input field for editing the title
// (setting a padding always led to a small flickering)
border: 1px solid transparent;
&.strike-through {
text-decoration: line-through;
}
a {
cursor: pointer;
text-decoration: underline;
}
}
.expandable-container {
background: none repeat scroll 0 0 $white;
border: 1px solid $gray;
padding: 0 6px;
display: none !important;
margin: 13px 0;
width: calc(100% - 115px);
line-height: 24px;
min-height: 24px;
.expandingArea {
position: relative;
}
}
.checkbox {
float: left;
padding: 16px 17px 18px;
.icon {
cursor: pointer;
margin: 0;
}
}
.star {
padding: 13px;
float: right;
.icon {
height: 24px;
width: 24px;
background-size: 144px 144px;
}
}
textarea,
pre {
box-shadow: none;
font-size: 16px;
font-weight: bold;
line-height: 22px;
min-height: 22px;
background: none repeat scroll 0 0 transparent;
border: medium none;
padding: 0;
white-space: pre-wrap;
word-wrap: break-word;
}
textarea {
margin: 0;
border-radius: 0;
height: 100%;
left: 0;
overflow: hidden;
position: absolute;
resize: none;
top: 0;
width: 100%;
}
pre {
border: 0 none !important;
display: block;
margin: 0;
outline: 0 none;
padding: 0 !important;
visibility: hidden;
}
}
.body {
flex: 1 1 auto;
overflow-y: auto;
position: relative;
.section {
border-bottom: 1px dotted $gray;
padding: 0;
position: relative;
margin-bottom: 0;
width: 100%;
color: $gray;
&:last-of-type {
border-bottom: unset;
}
&.low,
&.date {
color: $blue_due;
}
&.high {
color: $red_overdue;
}
&.medium {
color: $yellow;
}
&.date:hover .icon.icon-trash {
display: block;
}
&.date .icon {
&.icon-calendar-due,
&.icon-calendar-overdue,
&.icon-percent {
opacity: 1;
}
}
&.detail-note {
padding: 20px 0;
height: auto;
}
&.detail-all-day {
div,
span {
cursor: pointer;
}
}
&.editing {
.icon {
&.detail-save,
&.icon-trash {
display: block;
}
}
.section-title {
display: none;
}
.section-edit {
display: inline-block;
}
}
.icon {
&.icon-trash {
display: none;
margin-left: auto;
right: 22px;
}
&.detail-save {
display: none;
margin-left: auto;
right: 44px;
}
}
> div {
padding-left: 12px;
line-height: 44px;
&.utils {
position: absolute;
right: 0;
top: 0;
padding-right: 15px;
a {
vertical-align: middle;
display: inline-block;
}
}
.section-title {
font-weight: bold;
margin-left: 12px;
line-height: 22px;
width: calc(100% - 100px);
display: inline-block;
vertical-align: middle;
}
.icon {
margin: 0;
float: unset;
}
}
input[type="range"] {
border: medium none;
box-shadow: none;
width: calc(100% - 50px);
vertical-align: middle;
}
input[type="text"] {
background: none repeat scroll 0 0 $gray_easy;
margin: 0;
min-height: 0;
}
input {
background-color: $white;
border-radius: 0;
margin-top: 0;
color: $gray_dark;
font-weight: 500;
outline: medium none;
padding: 4px;
&.datepicker-input {
width: 60%;
}
&.timepicker-input {
width: calc(40% - 10px);
}
&.duration-input {
margin: 2px 0 0 .3em;
width: 35px;
}
&.percent-input,
&.priority-input {
width: 35px;
margin-top: 0;
}
}
select {
background-color: rgba(0, 0, 0, 0);
border-radius: 0;
border: 1px solid $gray_light;
padding: 0;
width: 98px;
margin: 0;
font-weight: normal;
height: 19px;
}
.section-edit {
display: none;
margin-left: 12px;
vertical-align: middle;
width: calc(100% - 80px);
line-height: 0;
}
.detail-categories-container {
width: calc(100% - 40px);
display: inline-block;
margin-left: 12px;
}
&.detail-categories .select2-container-multi {
.select2-choices {
border: 1px solid transparent;
.select2-search-choice {
color: $blue_due;
font-weight: bold;
line-height: 14px;
margin: 2px 0 3px 5px;
background-image: none;
background-color: $gray_easy;
box-shadow: none;
border-color: $gray_light;
padding: 3px 5px 3px 18px;
a.select2-search-choice-close {
opacity: .4;
display: initial;
@extend .icon;
@extend .icon-close;
&:hover {
opacity: 1;
}
}
}
}
&.select2-container-disabled .select2-choices {
background-color: $white;
background-image: none;
border: none;
cursor: default;
}
}
.select2-search-field input {
border: 0 none;
box-shadow: none;
font-weight: bold;
margin-top: 0;
font-family: inherit;
}
&.active .select2-search-field input {
color: $blue_due;
}
.note {
border-width: 1px;
border-style: solid;
border-color: $gray_light;
font-size: 13px;
line-height: 26px;
margin: 0 20px;
padding: 5px 15px;
cursor: text;
.expandingArea {
position: relative;
margin-left: -1px;
textarea,
pre {
box-shadow: none;
background: none repeat scroll 0 0 transparent;
border: medium none;
line-height: 26px;
padding: 0;
white-space: pre-wrap;
word-wrap: break-word;
}
textarea {
margin: 0 0 0 1px;
border-radius: 0;
height: 100%;
left: 0;
overflow: hidden;
position: absolute;
resize: none;
top: 0;
width: 100%;
color: $gray_dark;
font-weight: 500;
outline: medium none;
}
pre {
border: 0 none !important;
display: block;
margin: 0;
outline: 0 none;
padding: 0 !important;
visibility: hidden;
}
}
.note-body,
.note-edit {
min-height: 140px;
word-wrap: break-word;
cursor: text;
.content-fakeable {
&.editing {
.display-view {
display: none !important;
}
.edit-view {
display: block !important;
}
}
.display-view {
cursor: text;
display: block;
white-space: pre-wrap;
}
.edit-view {
display: none !important;
}
}
}
}
}
}
.disabled .body .section {
.select2-search-field input {
width: auto;
display: block !important;
}
&.date:hover .icon.icon-trash {
display: none;
}
}
}
}
/**
* timepicker fixes
*/
.ui-timepicker-table td a {
display: block;
width: 14px;
}
/**
* datepicker fixes
*/
.ui-widget.ui-datepicker .ui-datepicker-calendar td > a {
width: 18px;
line-height: 18px;
height: 18px;
}
/**
* rules for icons
*/
.collection .icon {
opacity: 1;
}
.disabled .icon.detail-star:hover {
cursor: not-allowed;
}
.reactive {
&:hover {
.icon {
opacity: .7;
}
.detail-checkbox:not(.disabled) {
border-color: $black;
}
}
.icon {
cursor: pointer;
}
}
.icon {
height: 16px;
width: 16px;
display: inline-block;
vertical-align: middle;
opacity: .5;
transition: opacity 100ms ease 0s;
cursor: default;
&.reactive {
cursor: pointer;
&:hover {
opacity: .7;
}
}
&.active {
opacity: .7;
}
&.icon-checkmark,
&.icon-tag-active,
&[class*=" icon-task-star-"] {
opacity: 1 !important;
}
&.task-checkbox,
&.detail-checkbox {
border-radius: 3px;
border: 1px solid $gray;
float: left;
margin: 9px;
&:not(.icon-checkmark) {
background: unset;
}
&:not(.disabled):hover {
border-color: $black;
}
&.disabled {
cursor: not-allowed;
}
}
&.icon-note {
display: none;
}
&.right {
float: right;
}
}
#status {
padding: 10px 0 18px !important;
height: 22px !important;
background-color: transparent !important;
font-weight: bold;
color: $gray;
font-size: 13px !important;
&.emptycontent {
position: relative;
}
}
/**
* rules for sortorder-dropdown
*/
.sortorder-dropdown-button {
background-color: $gray_easy;
border: 1px solid $gray_light;
width: 42px;
height: 34px;
margin: 12px 0 12px 12px;
padding: 0;
float: right;
cursor: pointer;
.sort-indicator {
margin-left: 0;
visibility: visible;
}
}
.sortorder-dropdown {
display: none;
top: 68px;
right: 3px;
&.open {
display: block;
}
.icon {
margin: 12px 8px;
&.sort-indicator {
margin-left: auto;
margin-right: 0;
float: right;
visibility: hidden;
}
}
.label {
margin-right: 10px;
}
.active .icon.sort-indicator {
visibility: visible;
}
li {
float: inherit;
width: auto !important;
cursor: pointer;
opacity: .57;
& > a span {
opacity: 1 !important;
&[class*=" icon-"] {
padding: 0;
background-size: auto;
&.icon-list {
@extend .icon-list;
}
&.icon-calendar {
@extend .icon-calendar;
}
&.icon-task-star {
@extend .icon-task-star;
}
&.icon-alphabetically {
@extend .icon-alphabetically;
}
&.icon-manual {
@extend .icon-manual;
}
&.icon-sort-up {
@extend .icon-sort-up;
}
&.icon-sort-down {
@extend .icon-sort-down;
}
}
}
a {
width: 100% !important;
}
&.active {
opacity: 1 !important;
}
&:hover {
opacity: 1 !important;
}
}
}