| 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/deck/css/ |
Upload File : |
/*
* @copyright Copyright (c) 2016 Julius Härtl <jus@bitgrid.net>
*
* @author Julius Härtl <jus@bitgrid.net>
* @author Artem Anufrij <artem.anufrij@live.de>
* @author Marin Treselj <marin@pixelipo.com>
* @author Oskar Kurz <oskar.kurz@gmail.com>
* @author Ryan Fletcher <ryan.fletcher@codepassion.ca>
*
* @license GNU AGPL version 3 or any later version
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*
*/
// colors
$color-warning-light: nc-lighten($color-warning, 15%);
$color-lightgrey: nc-darken($color-main-background, 4%);
$color-grey: nc-darken($color-main-background, 7%);
$color-darkgrey: nc-darken($color-main-background, 32%);
// margins/paddings
$board-item-margin: 10px 10px 20px 10px;
$board-last-item-margin: 10px;
$compact-board-item-margin: 5px 10px 10px 10px;
$compact-board-last-item-margin: 5px 10px 10px;
@import 'comp-appnav';
@import 'icons';
@import 'animations';
@import 'compact-mode';
@import 'autocomplete';
@import 'comments';
/**
* General styles
*/
button,
.button,
.app-deck .icon {
display: flex;
&.button-inline {
border: 0;
background-color: transparent;
}
&.button-inline:hover {
border: 0;
background-color: transparent;
}
}
input.input-inline {
font-size: inherit !important;
font-weight: inherit;
background-color: transparent;
padding: 0;
border: none;
width: 100%;
border-radius: 0;
}
#app img {
box-sizing: content-box;
}
#searchbox {
display: flex !important;
}
.editable-inline {
cursor: text;
}
/**
* Generic app layout
*/
#content {
height: 100%;
min-height: initial;
}
.app.app-deck {
width: 100%;
height: 100%;
display: flex;
}
#app-content {
display: flex;
flex-direction: column;
}
/**
* Navigation sidebar
*/
#app-navigation {
/** menu */
.board-bullet {
position: absolute;
margin-left: 17px;
margin-top: 16px;
width: 12px;
height: 12px;
border: none;
border-radius: 50%;
cursor: pointer;
}
.app-navigation-entry-utils-menu-share i {
height: 100%;
width: 100%;
}
li {
transition: height 250ms ease-in-out, opacity 250ms ease-in-out, z-index 250ms ease-in-out;
}
.editing {
height: 82px;
.icon-add {
background-position: 14px 14px;
}
}
.app-navigation-entry-edit {
.colorselect {
div, label {
height: 32px;
width: auto;
}
}
form {
display: flex;
}
}
}
#app-settings-content {
overflow: initial;
.ui-select-match-item {
border: 1px solid var(--color-background-darker) !important;
.select-label {
color: var(--color-main-text);
}
}
p.hint {
margin-top: 10px;
color: var(--color-text-light);
}
}
/**
* Board view
*/
#board-status {
position: absolute;
z-index: 999;
width: 100%;
height: 100%;
background-color: var(--color-main-background, $color-main-background);
}
#board {
position: absolute;
white-space: nowrap;
overflow: auto;
z-index: 100;
width: 100%;
bottom: 0px;
top: 44px;
&.as-sortable-un-selectable {
.card-list {
min-height: 96px;
}
}
.card {
opacity: 1;
&.file-drop {
}
}
&.card-selected {
.card {
box-shadow: 0px 0px 7px 0px var(--color-background-darker, $color-grey);
&.current {
box-shadow: 0px 0px 7px 0px var(--color-text-lighter, $color-darkgrey);
}
}
}
}
// styles to provide a drop zone in empty stacks
.as-sortable-un-selectable {
.card-list {
min-height: 96px;
flex-grow: 1;
}
// empty stack placeholders and last placeholders should fill the space
.emptyStack .as-sortable-placeholder,
li:last-child.as-sortable-placeholder {
height: 100% !important;
}
}
#innerBoard {
padding: 10px;
> .as-sortable-placeholder {
display: flex !important;
width: 320px;
min-width: 320px;
margin-top: 0;
margin-left: 0;
}
> .as-sortable-drag {
background-color: var(--color-main-background $color-main-background);
}
}
#controls {
width: inherit;
z-index: 120;
display: flex;
align-items: center;
position: inherit;
padding-left: 44px;
.crumb {
order: 0;
.bullet {
opacity: 1;
}
a:nth-child(2),
a:nth-child(3) {
padding-left: 0;
margin-left: -5px;
}
a .icon {
margin-top: 2px;
}
.board-bullet {
display: inline-block;
width: 20px;
height: 20px;
border: none;
border-radius: 50%;
}
}
button {
width: 36px;
height: 36px;
padding: 9px;
}
#stack-add form {
button {
height: auto;
width: 32px;
}
}
input[type='text'] {
padding: 6px;
border: 0 none transparent;
min-height: initial;
background-color: transparent;
height: inherit;
}
.icon-home { // TODO: deprecate this
background-position: 8px center;
padding: 10px 24px 10px 14px;
}
}
#app-navigation-toggle-custom {
width: 44px;
height: 44px;
cursor: pointer;
opacity: 1;
display: inline-block !important;
position: fixed;
}
.board-header-controls {
margin-left: auto;
align-items: center;
&.app-popover-menu-utils {
display: flex;
#popover-controls {
display: flex;
align-items: center;
}
.popovermenu {
margin-top: 35px;
margin-right: 6px;
}
}
}
.filter-select {
position: absolute;
right: auto;
top: 42px;
left: -21%;
li {
padding: 3px;
overflow: hidden;
width: auto;
span {
display: block;
float: left;
width: 20px;
height: 20px;
margin-right: 5px;
}
}
}
#stack-add {
background-color: var(--color-background-dark, $color-lightgrey);
border-radius: 3px;
margin: 3px;
display: flex;
align-content: center;
height: 34px;
> form {
display: flex;
align-content: center;
}
input {
&:invalid,
&:-moz-submit-invalid,
&:-moz-ui-invalid {
box-shadow: none;
}
}
}
.stack {
width: 100%;
vertical-align: top;
display: flex;
flex-direction: column;
h3 {
padding: 10px 10px 8px;
margin: 0;
font-size: 12pt;
font-weight: normal;
overflow: hidden;
display: flex;
min-height: 40px;
&:hover button {
display: flex;
}
input {
padding: 0;
width: 100%;
margin: 0;
font-size: 12pt;
border: 0;
background-color: var(--color-main-background, $color-main-background);
min-height: initial;
}
span {
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
}
button {
margin-left: auto;
display: flex;
opacity: 0.3;
padding-right: 0;
}
}
form {
width: 100%;
}
.as-sortable-placeholder {
margin: $board-item-margin;
border: 1px dashed $color-darkgrey;
min-height: 96px;
transition: margin 250ms linear;
&:last-child {
margin: $board-last-item-margin;
}
}
&.as-sortable-item {
height: 100%;
display: flex;
}
> ul {
display: flex;
flex-direction: column;
}
}
.card {
background-color: var(--color-main-background, $color-main-background);
margin: $board-item-margin;
white-space: normal;
position: relative;
box-shadow: 0 0 3px 1px var(--color-background-darker, $color-darkgrey);
border-radius: 3px;
transition: margin 250ms linear;
&:last-child {
margin: $board-last-item-margin;
}
&.archived .card-upper {
opacity: 0.5;
}
.card-upper {
overflow: hidden;
position: relative;
padding: 5px;
}
.card-assigned-users {
display: flex;
justify-content: flex-end;
flex-grow: 1;
.assigned-user {
z-index: 4;
margin: 6px 0 6px 6px;
}
}
.card-controls {
background: var(--color-background-dark, $color-lightgrey);
display: flex;
position: relative;
padding-left: 10px;
.card-options {
justify-content: flex-end;
}
&:hover .card-options {
opacity: 1;
}
.icon-description {
margin: 10px;
margin-left: 0px;
opacity: 0.5;
}
.due {
border-radius: 3px;
margin: 6px 4px 6px 0px;
padding: 0 4px;
font-size: 90%;
opacity: 0.5;
display: flex;
align-items: center;
.icon {
background-size: contain;
}
&.overdue {
background-color: $color-error;
color: var(--color-primary-text, $color-primary-text);
.icon-badge {
background-image: url('../img/calendar-white.svg');
}
}
&.now {
background-color: $color-warning;
}
&.next {
background-color: $color-warning-light;
}
span {
margin-left: 3px;
}
}
.card-tasks, .card-files, .card-comments {
border-radius: 3px;
margin: 4px 4px 4px 0px;
padding: 0 2px;
font-size: 90%;
opacity: 0.5;
display: flex;
align-items: center;
.icon {
background-size: contain;
margin-right: 2px;
}
}
button {
padding: 22px;
margin: 0;
}
}
a {
display: block;
}
h4 {
font-weight: normal;
font-size: 10pt;
padding: 0;
margin: 0 5px;
overflow: hidden;
text-overflow: ellipsis;
span {
padding: 6px 0;
padding-top: 7px;
display: block;
}
input {
width: 100%;
margin: 0;
}
}
.labels {
position: relative;
margin-left: 5px;
li {
padding: 0 4px;
margin: 0 2px 2px 0;
border-radius: 3px;
font-size: 75%;
border: none transparent;
float: left;
span {
display: inline-block;
font-weight: bold;
background-color: inherit;
line-height: normal;
}
}
}
&.create {
text-align: center;
margin: 20px 10px 10px;
border: 1px solid;
border-radius: 3px;
background-color: transparent;
overflow: hidden;
box-shadow: none;
cursor: pointer;
&.emptyStack {
margin-top: 10px;
}
&:hover {
text-align: center;
opacity: 1;
}
.icon-add {
padding: 20px;
}
h4 {
width: 100%;
padding: 0;
margin: 0;
input {
width: 100%;
border: 0;
font-size: 10pt;
margin: 0;
padding: 10px;
}
}
}
}
/* ng-sortable: Fix mobile touch scrolling */
.as-sortable-item,
.as-sortable-item-handle {
-ms-touch-action: auto !important;
touch-action: auto !important;
-webkit-touch-callout: inherit !important;
}
/* disable scrolling only when a card is dragged */
.as-sortable-un-selectable .as-sortable-item,
.as-sortable-un-selectable .as-sortable-item-handle {
-ms-touch-action: none !important;
touch-action: none !important;
-webkit-touch-callout: inherit !important;
}
.app-popover-menu-utils {
margin-left: auto;
min-height: 16px;
}
.popovermenu:not(.action-item__menu) {
z-index: 999;
opacity: 1;
display: block;
&.hidden {
display: none;
}
ul {
display: flex !important;
flex-direction: column;
}
}
.info {
padding-left: 5px;
padding-right: 5px;
display: inline-block;
opacity: 0.5;
i {
margin-left: 2px;
}
span {
margin-right: 2px;
}
}
/**
* App sidebar
*/
#sidebar-header {
position: sticky;
top: 0;
background-color: var(--color-main-background, $color-main-background);
z-index: 200;
h3 {
font-size: 14pt;
padding: 15px 15px 3px;
margin: 0;
overflow: hidden;
input {
min-height: 0px;
margin: 0px;
}
}
#card-dates {
font-size: 80%;
opacity: 0.5;
padding-left: 15px;
}
.icon-close {
position: absolute;
top: 0px;
right: 0px;
padding: 14px;
height: 44px;
width: 44px;
}
}
.drop-indicator {
display: none;
}
.card .nv-file-over,
.drop-indicator.nv-file-over {
display: block;
position: absolute;
width: 100%;
height: 100%;
background-color: var(--color-main-background, $color-main-background);
z-index: 100;
opacity: 0.9;
text-align: center;
p {
width: calc(100% - 20px);
height: calc(100% - 20px);
position: absolute;
padding: 20px;
border: 1px dashed #AAA;
margin: 10px;
border-radius: 5px;
}
}
#card-meta { // TODO: use .card-block instead?
height: 100%;
display: flex;
flex-direction: column;
padding: 0 15px;
.duedate {
display: flex;
align-content: center;
min-height: 38px;
.timepicker-input {
width: 50px;
border-left: 0;
border-radius: 0px 3px 3px 0px;
}
.datepicker-input {
width: 85px;
margin: 3px 0px;
border-radius: 3px 0px 0px 3px;
}
.icon {
opacity: 0.5;
&:hover {
opacity: 1;
}
}
}
.section-header {
border-bottom: 1px solid $color-lightgrey;
display: flex;
flex-shrink: 0;
margin-bottom: 5px;
margin-top: 10px;
h4 {
padding-top: 5px;
padding-bottom: 5px;
flex: 1;
}
}
.section-header-tabbed {
margin-top: 10px;
margin-bottom: 5px;
flex-shrink: 0;
display: flex;
.tabHeaders {
margin: 0;
flex-grow: 1;
}
}
.tabDetails {
display: flex;
height: 40px;
align-items: center;
justify-content: center;
input[type=button] {
width: 32px;
}
}
.save-indicator {
border-radius: 3px;
margin: 5px;
padding: 0 10px;
font-size: 8pt;
display: none;
text-align: center;
&.saved {
background-color: $color-success;
color: $color-primary-text;
}
&.unsaved {
background-color: var(--color-background-dark, $color-lightgrey);
color: var(--color-text-light, $color-darkgrey);
}
}
.icon-help {
opacity: 0.5;
padding: 5px 15px;
display: inline;
}
.card-details-assign-users {
.select2 .ui-select-choices-row-inner {
display: flex;
padding: 5px !important;
}
.card-details-assign-users-list {
display: flex;
.assigned-user {
position: relative;
.avatardiv-container {
margin-right: 5px;
}
}
.tooltip {
z-index: 998;
position: fixed;
}
}
}
.icon-upload.icon-loading-small {
background-image: none;
}
.attachment-list-wrapper {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba($color-darkgrey, 0.5);
left: 0;
top: 0;
z-index: 300;
}
.attachment-list {
&.selector {
padding: 10px;
position: absolute;
width: 30%;
max-width: 500px;
min-width: 200px;
max-height: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: var(--color-main-background, $color-main-background);
z-index: 2;
border-radius: 3px;
box-shadow: 0 0 3px var(--color-background-dark, $color-darkgrey);
overflow: scroll;
}
h3.attachment-selector {
margin: 0 0 10px;
padding: 0;
.icon-close {
display: inline-block;
float: right;
}
}
li.attachment {
display: flex;
padding: 3px;
&.deleted {
opacity: .5;
}
.fileicon {
display: inline-block;
min-width: 32px;
width: 32px;
height: 32px;
background-size: contain;
}
.details {
flex-grow: 1;
flex-shrink: 1;
min-width: 0;
flex-basis: 50%;
line-height: 110%;
padding: 2px;
}
.filename {
width: 70%;
display: flex;
.basename {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-bottom: 2px;
}
.extension {
opacity: 0.7;
}
}
.filesize, .filedate {
font-size: 90%;
color: $color-darkgrey;
}
.app-popover-menu-utils {
position: relative;
right: -10px;
button {
height: 32px;
width: 42px;
}
}
button.icon-history {
width: 44px;
}
progress {
margin-top: 3px;
}
}
}
.card-description {
&.section-header {
.save-indicator {
margin-bottom: 5px;
margin-top: 5px;
}
}
&.section-content {
height: 100%;
display: flex;
flex-direction: column;
> div {
height: 100%;
}
textarea {
width: 100%;
height: 200px;
border: none;
margin: 0;
padding: 0;
}
.container {
background-color: var(--color-main-background, $color-main-background);
}
}
}
}
.activity-icon {
opacity: 1 !important;
.avatardiv-container {
top: -4px;
left: -7px;
margin-right: 5px;
img {
max-width: 24px;
max-height: 24px;
opacity: 1;
}
}
& > img {
opacity: 0.7;
}
}
.activitysubject.commentAuthor {
margin-left: 26px;
margin-right: 0;
margin-top: 10px;
}
.activityTabView {
.activity {
margin-bottom: 20px;
}
.activitytime {
margin: 0 !important;
}
}
.activitysubject .app-popover-menu-utils {
display: inline-block;
position: relative;
a {
font-weight: normal;
}
button {
opacity: .5;
padding: 7px;
margin-left: 10px;
}
}
#commentsTabView {
.newCommentRow .avatardiv-container {
left: -7px;
}
.comment {
position: relative;
padding: 0 0 15px;
.avatardiv {
width: 24px;
height: 24px;
line-height: 24px;
}
}
.newCommentForm {
margin-left: 26px;
}
}
.card-attachments {
.error {
padding-left: 38px;
margin-bottom: 5px;
background-position: 10px;
}
}
.labels {
display: block;
overflow: hidden;
li {
padding: 0px 0px 5px 0px;
border-radius: 3px;
margin: 1px;
color: $color-primary-text;
min-width: 20px;
display: flex;
}
}
/**
* Color selection
*/
.colorselect {
overflow: hidden;
border-radius:3px;
flex-direction: row;
display: flex;
.color {
opacity: 0.7;
height: 100%;
flex-grow: 1;
border: none;
}
label.color {
flex-grow: 1;
}
.selected {
background-image: url('../../../core/img/actions/checkmark.svg');
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
&.selected {
background-image: url('../../../core/img/actions/checkmark-white.svg');
}
}
.colorselect-label, .colorselect-label-white {
background-image: url('../img/color_picker-dark.svg');
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
input {
position: absolute;
visibility: hidden;
height: 32px;
width: 40px;
}
}
.colorselect-label-white {
background-image: url('../img/color_picker.svg');
}
}
.labels {
.colorselect {
padding: 0;
clear: none;
overflow: visible;
.color {
width: 26px;
height: 26px;
}
}
.label-edit {
display: flex;
width: 100%;
.colorselect {
margin: 0px 0px 0px 3px;
}
input {
border-bottom: 1px solid $color-lightgrey;
padding: 5px 5px 4px 5px !important;
}
}
}
/**
* Board list main screen area
*/
#boardlist {
position: absolute;
overflow: auto;
width: 100%;
bottom: 0px;
top: 44px;
thead td {
opacity: .5;
padding: 15px;
}
td {
padding: 0 10px;
border-bottom: 1px solid $color-grey;
.board-bullet {
width: 32px;
height: 32px;
border-radius: 50%;
cursor: pointer;
margin: 6px;
}
form {
display: flex;
width: 100%;
}
.colorselect {
flex-grow: 1;
div,
label {
min-width: 32px;
}
}
input[type=text] {
flex-grow: 2;
}
input[type=submit] {
width: 32px;
}
.app-popover-menu-utils {
position: relative;
button {
opacity: 0.5;
padding: 22px;
}
&:hover button {
opacity: 1;
}
}
}
.icon {
padding: 25px;
margin: 0 0 0 auto;
}
tr.deleted td *,
tbody .board-create td {
opacity: 0.5;
}
.board-edit-controls {
display: flex;
}
input {
margin: 0px;
}
#assigned-users {
display: flex;
.avatardiv-container {
margin: 6px;
}
}
}
/**
* Board details
*/
#tabBoardShare .select2 .ui-select-choices-row-inner {
display: flex;
padding: 5px !important;
}
#shareWithList {
list-style-type: none;
padding: 0 0 16px;
li {
padding-top: 5px;
padding-bottom: 5px;
font-weight: bold;
white-space: normal;
display: flex;
align-items: center;
}
.username {
padding-right: 8px;
padding-left: 8px;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block;
overflow: hidden;
vertical-align: middle;
flex-grow: 1;
}
.icon-delete {
display: inline-block;
background-size: 16px 16px;
width: 16px;
height: 16px;
padding: 0;
margin-top: 10px;
}
.sharingOptionsGroup {
margin-right:10px;
}
.shareOption {
margin-top: 5px;
}
}
.avatardiv {
background-color: $color-lightgrey;
border-radius: 16px;
width: 32px;
height: 32px;
.icon-group, .icon {
padding: 16px;
opacity: 0.5;
}
&.has-contactsmenu img {
cursor: pointer;
}
}
.avatardiv-container {
position: relative;
}
.board-detail__deleted-list__item {
display: flex;
flex-direction: row;
* {
flex-basis: 44px;
}
.title {
flex-grow: 2;
}
.live-relative-timestamp {
flex-grow: 1;
}
}
#board-detail-labels {
ul li {
input {
margin: 0px;
padding: 5px;
min-height: 0px;
}
.label-title {
width: 100%;
padding: 4px;
border: none;
border-radius: 0px 0px 5px 5px;
}
a.icon {
padding: 5px;
opacity: 0.5;
&:hover {
opacity: 1;
}
}
}
.color {
width: 28px;
height: 100%;
}
}
.label-create {
width: 100%;
padding: 0px 56px 0px 0px !important;
a {
margin: 0px;
}
.icon {
margin-right: 10px;
}
}
.tabHeaders {
clear: both;
overflow: initial;
margin-bottom: 0;
.icon {
display: inline-block;
background-size: contain;
margin-right: 5px;
opacity: 0.5;
}
}
.tabsContainer {
margin-top: 15px;
height: 100%;
.tab {
height: 100%;
}
}
.ui-select-offscreen {
display: none;
}
.ui-select-match-item {
padding: 0;
float: left !important;
display: block;
border-radius: 3px !important;
.select-label {
color: $color-primary-text;
padding: 6px 23px 6px 6px;
margin-right: -23px !important;
}
.select2-search-choice-close {
z-index: 100;
position: relative;
display: inline-flex !important;
margin-right: 7px;
vertical-align: top;
}
}
.select2-container {
width: 100%;
margin: 0;
.select2-choices {
padding: 0 !important;
.select2-search-choice {
padding: 3px 0 !important;
border: 0 !important;
overflow: hidden;
}
.select2-search-field {
margin-right: -10px;
flex-grow: 1;
input {
width: 100% !important;
}
}
}
.select2-choice {
height: auto;
}
}
.ui-select-container[disabled] .ui-select-match-item {
margin-right: 0 !important;
.select-label {
padding: 4px;
min-width: 26px !important;
height: 100%;
display: inline-block;
}
}
.select2-search input {
width: 100% !important;
}
.select2-result-label {
padding: 0px !important;
display: flex;
span {
flex-grow: 1;
padding: 6px;
}
}
/**
* Markdown rendering
*/
#markdown {
width: 100% !important;
min-height: 40px;
cursor: text;
p {
margin-bottom: 15px;
}
* {
white-space: normal;
word-wrap: break-word;
overflow-wrap: break-word;
}
a {
opacity: 0.5;
text-decoration: underline;
}
ol,
ul {
margin-left: 20px;
margin-bottom: 10px;
}
ul {
list-style-type: disc;
}
h1 {
font-size: 18px;
font-weight: 600;
margin-bottom: 5px;
}
h2 {
font-size: 16px;
font-weight: 600;
}
h3 {
font-size: 14px;
font-weight: 600;
}
h4 {
font-size: 13px;
font-weight: 600;
}
h6 {
font-size: 12px;
font-weight: 600;
}
pre {
background-color: var(--color-background-dark, $color-lightgrey);
padding: 3px;
overflow: auto;
code {
white-space: pre;
}
}
img {
max-width: 100%;
max-height: 50vh;
margin: auto;
display: block;
}
input[type=checkbox] {
margin: 0px 10px 0px 0px;
line-height: 10px;
font-size: 10px;
display: inline-block;
min-height: 12px;
}
li input[type="checkbox"].checkbox + label::before {
margin-left: -15px;
}
input[type="checkbox"].checkbox + label::before {
position: relative;
z-index: 100;
margin-right: 10px;
margin-top: 0;
}
li input[type="checkbox"].checkbox:not(:checked) + label::before {
background-color: $color-main-background;
}
table {
margin-bottom: 10px;
border-collapse: collapse;
thead {
background-color: var(--color-background-dark, $color-lightgrey);
}
td, th {
border: 1px solid var(--color-background-darker, $color-darkgrey);
padding: 3px;
}
}
}
.section-wrapper {
display: flex;
max-width: 100%;
margin-top: 10px;
}
.section-label {
background-position: 0px center;
width:28px;
flex-shrink: 0;
}
.section-details {
flex-grow: 1;
}
/**
* Mobile optimizations
*/
@media (min-width: 481px) {
/* hide board actions on mobile */
.board-header-controls {
display: flex;
&.app-popover-menu-utils {
display: none;
}
}
#innerBoard {
display: flex;
}
.stack {
width: 320px;
min-width: 320px;
border-right: 1px solid $color-lightgrey;
margin-right: 10px;
padding-right: 10px;
&:last-child {
border-right: 1px solid transparent;
}
h3 button {
display: none;
}
h2:hover button {
display: inline-flex;
}
}
}
/**
* Hotfix for https://github.com/angular-ui/ui-select/issues/1652
*/
.ui-select-dropdown.select2-drop-active {
opacity: 1 !important;
}
/**
* Custom app sidebar handling
*/
body:not(.snapjs-left) {
.app-navigation-hide {
#app-content {
margin-left: 0 !important; /* overwrite margin since we want the translateX to handle it*/
}
#app-navigation {
transform: translateX(-300px);
}
}
}
@media only screen and (max-width: 768px) {
#app-navigation-toggle-custom {
display: none;
}
}
/**
* Print settings, better leave them at the eof
*/
@import 'print.scss';