Yurii
4328 lines
92 KiB
Plaintext
4328 lines
92 KiB
Plaintext
@import "elements/navbar.less";
|
|
@import "elements/type.less";
|
|
@import "elements/panel.less";
|
|
@import "elements/record.less";
|
|
@import "elements/dropdown.less";
|
|
@import "elements/form.less";
|
|
@import "elements/table.less";
|
|
@import "elements/alert.less";
|
|
@import "elements/icons.less";
|
|
|
|
html {
|
|
height: 100%;
|
|
|
|
&:not(:has(> body > .container > .container-centering)):not(:has(.modal-container)) {
|
|
scrollbar-gutter: stable;
|
|
}
|
|
}
|
|
|
|
.list-container > .list,
|
|
.panel,
|
|
.dashlet-container,
|
|
#main > .calendar-container .calendar,
|
|
#main > .calendar-container .timeline,
|
|
.well,
|
|
.admin-content .table.table-admin-panel,
|
|
.list-group-panel,
|
|
.popup-notification {
|
|
box-shadow: var(--default-box-shadow);
|
|
}
|
|
|
|
.dashlet-body .list-container > .list,
|
|
.panel-body .list-container > .list,
|
|
.dashlet-container > .panel,
|
|
.note-editor.panel {
|
|
box-shadow: none;
|
|
}
|
|
|
|
#main > .calendar-container .calendar {
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
}
|
|
|
|
a:focus-visible,
|
|
a.btn:focus-visible,
|
|
button:focus-visible,
|
|
button.btn:focus-visible,
|
|
button.btn.active:focus-visible,
|
|
.dropdown-toggle:focus:focus-visible,
|
|
input[type=radio]:focus-visible,
|
|
input[type=checkbox]:focus-visible,
|
|
input[type=file]:focus-visible,
|
|
label.attach-file-label:focus-visible,
|
|
.iti__selected-flag:focus-visible {
|
|
outline: var(--1px) solid var(--input-border-focus-rgba);
|
|
outline-offset: var(--minus-1px);
|
|
}
|
|
|
|
.no-focus-outline:focus-visible {
|
|
outline: none;
|
|
}
|
|
|
|
input[type=checkbox]:focus-visible,
|
|
input[type=radio]:focus-visible{
|
|
outline-offset: var(--3px);
|
|
}
|
|
|
|
.block-center,
|
|
.block-center-8 {
|
|
max-width: calc(var(--8px) * 100);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.block-center-sm,
|
|
.block-center-4 {
|
|
max-width: calc(var(--4px) * 100);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.block-center-5 {
|
|
max-width: calc(var(--5px) * 100);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.block-center-md,
|
|
.block-center-6 {
|
|
max-width: calc(var(--6px) * 100);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.container-centering {
|
|
height: calc(100vh - var(--100px));
|
|
position: relative;
|
|
top: calc(var(--5px) * -10);
|
|
> div {
|
|
position: relative;
|
|
top: 20%;
|
|
}
|
|
}
|
|
|
|
.collapsing {
|
|
-webkit-transition: height .1s ease;
|
|
-o-transition: height .1s ease;
|
|
transition: height .1s ease;
|
|
}
|
|
|
|
img.image-preview {
|
|
border-radius: var(--border-radius-small);
|
|
}
|
|
|
|
.preset {
|
|
text-overflow: ellipsis;
|
|
//overflow: hidden !important;
|
|
}
|
|
|
|
.preset > div{
|
|
padding-right: var(--26px);
|
|
}
|
|
|
|
|
|
|
|
.chevron-right {
|
|
&::before {
|
|
content: "\203A";
|
|
display: inline-block;
|
|
}
|
|
padding: 0 0.1em;
|
|
}
|
|
|
|
.middle-dot {
|
|
&::before {
|
|
content: "\00B7";
|
|
display: inline-block;
|
|
}
|
|
|
|
padding: 0 0.1em;
|
|
user-select: none;
|
|
}
|
|
|
|
.page-header {
|
|
margin: var(--15px) 0;
|
|
border-bottom: 0;
|
|
padding-bottom: 0;
|
|
min-height: var(--input-height-base);
|
|
|
|
.header-title,
|
|
h3 {
|
|
margin-bottom: var(--7px);
|
|
font-size: var(--22px);
|
|
font-weight: 400;
|
|
|
|
a {
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
.header-title,
|
|
> h3 {
|
|
font-size: var(--21px);
|
|
}
|
|
|
|
.header-buttons {
|
|
> .btn {
|
|
max-width: calc(var(--28px) * 10);
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
&:has(:nth-child(3)) {
|
|
> .btn {
|
|
max-width: calc(var(--24px) * 10);
|
|
}
|
|
}
|
|
|
|
&:has(:nth-child(4)) {
|
|
> .btn {
|
|
max-width: calc(var(--17px) * 10);
|
|
}
|
|
}
|
|
|
|
.dropdown-group:last-child {
|
|
float: right;
|
|
}
|
|
}
|
|
}
|
|
|
|
.page-header-row {
|
|
margin-left: calc(var(--grid-gutter-width-half) * -1);
|
|
margin-right: calc(var(--grid-gutter-width-half) * -1);
|
|
&:extend(.clearfix all);
|
|
> div {
|
|
float: left;
|
|
position: relative;
|
|
min-height: var(--1px);
|
|
padding-left: var(--grid-gutter-width-half);
|
|
padding-right: var(--grid-gutter-width-half);
|
|
}
|
|
|
|
.page-header-column-1 {
|
|
width: 66.66666667%;
|
|
}
|
|
.page-header-column-2 {
|
|
width: 33.33333333%
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
.page-header-column-1,
|
|
.page-header-column-2 {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
|
|
@supports (display: grid) {
|
|
.page-header-row {
|
|
display: grid;
|
|
grid-template-columns: auto max-content;
|
|
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
grid-template-columns: auto;
|
|
}
|
|
&::before,
|
|
&::after {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
.page-header-column-1,
|
|
.page-header-column-2 {
|
|
width: unset !important;
|
|
padding-left: unset !important;
|
|
padding-right: unset !important;
|
|
min-height: unset !important;
|
|
position: unset !important;
|
|
float: unset !important;
|
|
}
|
|
}
|
|
|
|
h3 {
|
|
margin-top: 0;
|
|
margin-bottom: var(--4px);
|
|
}
|
|
|
|
.page-header-column-1 {
|
|
overflow: hidden;
|
|
|
|
.header-breadcrumbs {
|
|
.breadcrumb-separator {
|
|
padding: 0 0.26em;
|
|
}
|
|
|
|
.breadcrumb-item,
|
|
.breadcrumb-separator {
|
|
display: inline-block;
|
|
}
|
|
min-height: 1.2em;
|
|
}
|
|
|
|
&.no-break-words {
|
|
.header-breadcrumbs {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
|
|
.breadcrumb-item,
|
|
.breadcrumb-separator {
|
|
display: inline-block;
|
|
}
|
|
|
|
margin-right: var(--30px);
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
|
|
.header-breadcrumbs.overlapped {
|
|
position : relative;
|
|
&:after {
|
|
content: " ";
|
|
position: absolute;
|
|
right: 0;
|
|
background: linear-gradient(to right, transparent, @body-bg);
|
|
height: var(--30px);
|
|
width: calc(var(--8px) * 10);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.page-header > .row {
|
|
min-height: var(--input-height-base);
|
|
}
|
|
|
|
.form-group {
|
|
.left-dropdown > .btn.filters-button {
|
|
margin-right: 0;
|
|
z-index: 3;
|
|
}
|
|
|
|
.filters-button {
|
|
z-index: 1;
|
|
|
|
&:active,
|
|
&:focus {
|
|
z-index: 3;
|
|
}
|
|
}
|
|
|
|
.btn.search {
|
|
z-index: 2;
|
|
}
|
|
}
|
|
|
|
div.list-expanded > ul > li > div.expanded-row {
|
|
> .cell {
|
|
padding-right: var(--10px);
|
|
|
|
&.small.pull-right {
|
|
position: relative;
|
|
top: var(--2px);
|
|
}
|
|
|
|
&:first-child {
|
|
> .fas {
|
|
width: var(--18px);
|
|
}
|
|
|
|
&[data-name="ico"] {
|
|
padding-right: var(--8px);
|
|
}
|
|
}
|
|
|
|
&:empty {
|
|
display: none;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.list > table.table td {
|
|
> span.list-icon-container.pull-right {
|
|
margin-left: var(--5px);
|
|
}
|
|
|
|
> span.list-icon-container.pull-left {
|
|
margin-right: var(--5px);
|
|
}
|
|
}
|
|
|
|
.list[data-scope="Email"] {
|
|
> table.table td.cell[data-name="subject"] {
|
|
&:has(.list-icon-container) {
|
|
> span {
|
|
display: flex;
|
|
width: 100%;
|
|
white-space: nowrap;
|
|
|
|
> span:first-child {
|
|
display: inline-block;
|
|
width: calc(100% - var(--18px));
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
> span.list-icon-container {
|
|
width: var(--18px);
|
|
display: inline-block;
|
|
}
|
|
}
|
|
|
|
&:has(.list-icon-container[data-icon-count="2"]) {
|
|
> span {
|
|
> span:first-child {
|
|
width: calc(100% - var(--32px));
|
|
}
|
|
|
|
> span.list-icon-container {
|
|
width: var(--32px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.cell span + span.list-icon-container {
|
|
margin-left: var(--3px);
|
|
}
|
|
|
|
.list > ul.list-group > li.list-row .cell > span.glyphicon.pull-right {
|
|
margin-left: var(--5px);
|
|
margin-top: var(--4px);
|
|
}
|
|
|
|
.list.scrollable {
|
|
width: auto;
|
|
overflow-y: hidden;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.list {
|
|
.text-muted {
|
|
.fas.action,
|
|
.far.action {
|
|
&:hover {
|
|
color: var(--text-gray-color);
|
|
}
|
|
}
|
|
}
|
|
.action {
|
|
&.text-muted.fas,
|
|
&.text-muted.far {
|
|
&:hover {
|
|
color: var(--text-gray-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.numeric-text {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
table .numeric-text {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
input.numeric-text {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.field .numeric-text {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.chart-container .numeric-text {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.ui-timepicker-list {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.btn.active {
|
|
box-shadow: none;
|
|
}
|
|
|
|
#login {
|
|
.cell label {
|
|
color: var(--text-soft);
|
|
user-select: none;
|
|
}
|
|
|
|
.fallback-shown,
|
|
.another-user {
|
|
.cell[data-name="sign-in"] {
|
|
margin-bottom: var(--12px);
|
|
}
|
|
}
|
|
}
|
|
|
|
#login.panel .panel-heading {
|
|
border-bottom-width: 0;
|
|
}
|
|
|
|
#login .logo-container {
|
|
width: @login-logo-width;
|
|
height: @login-logo-height;
|
|
overflow: hidden;
|
|
border-top-left-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
#login .logo-container img.logo {
|
|
max-height: 100%;
|
|
max-width: 100%;
|
|
}
|
|
|
|
input.global-search-input {
|
|
padding-right: var(--10px);
|
|
}
|
|
|
|
.global-search-button {
|
|
border: 0;
|
|
padding: var(--5px) var(--10px);
|
|
|
|
> span.icon {
|
|
line-height: var(--21px);
|
|
}
|
|
}
|
|
|
|
.progress.pre-loading {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
height: var(--2px);
|
|
}
|
|
|
|
.edit form {
|
|
margin: 0;
|
|
}
|
|
|
|
.button-container {
|
|
padding: 0 0 var(--vertical-gap);
|
|
}
|
|
|
|
.margin.list-group-item:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.stick-sub,
|
|
.sticky-head,
|
|
.sticked-bar,
|
|
.list-sticky-bar {
|
|
box-shadow: var(--top-bar-box-shadow);
|
|
}
|
|
|
|
.sticky-head {
|
|
background-color: @body-bg;
|
|
z-index: 4;
|
|
overflow: hidden;
|
|
border-bottom-left-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
}
|
|
|
|
.button-container[tabindex="-1"]:focus-visible {
|
|
outline: none;
|
|
}
|
|
|
|
.list-container .list-buttons-container {
|
|
margin-bottom: var(--padding-large-vertical);
|
|
min-height: var(--35px);
|
|
}
|
|
|
|
.list-sticky-bar {
|
|
position: fixed;
|
|
background-color: var(--navbar-bg);
|
|
z-index: 1000;
|
|
padding-top: var(--padding-small-vertical);
|
|
padding-bottom: var(--padding-small-vertical);
|
|
padding-right: var(--15px);
|
|
}
|
|
|
|
.list-buttons-container > .actions {
|
|
min-height: var(--input-height-base);
|
|
}
|
|
|
|
.list-buttons-container > div.total-count {
|
|
float: right;
|
|
padding: var(--7px) 0;
|
|
}
|
|
|
|
.list-container {
|
|
.settings-container {
|
|
.btn > span.fa-cog.fa-sm {
|
|
position: relative;
|
|
top: calc(var(--1px) * -1);
|
|
}
|
|
}
|
|
}
|
|
|
|
.pagination {
|
|
float: right;
|
|
display: block;
|
|
margin: 0;
|
|
|
|
a.pagination-btn {
|
|
min-width: var(--40px);
|
|
text-align: center;
|
|
}
|
|
|
|
a.pagination-btn-middle {
|
|
min-width: calc(var(--7px) * 10);
|
|
text-align: right;
|
|
}
|
|
|
|
.dropdown-menu {
|
|
.page-input-group {
|
|
> .input-group-addon:first-child {
|
|
border-left: 0;
|
|
border-top-left-radius: 0;
|
|
border-bottom-left-radius: 0;
|
|
min-width: calc(var(--7px) * 10);
|
|
|
|
user-select: none;
|
|
}
|
|
|
|
> input:last-child {
|
|
border-right: 0;
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
|
|
width: 100%;
|
|
min-width: calc(var(--8px) * 10);
|
|
|
|
float: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-bottom-bar {
|
|
margin-top: var(--vertical-gap);
|
|
}
|
|
|
|
.radio-container {
|
|
> div {
|
|
> label {
|
|
margin-right: var(--10px);
|
|
margin-bottom: 0;
|
|
font-weight: normal;
|
|
font-size: var(--15px);
|
|
height: var(--20px);
|
|
cursor: pointer;
|
|
|
|
input[type="radio"] {
|
|
vertical-align: middle;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
display: inline-block;
|
|
min-width: var(--btn-s-wide-width);
|
|
}
|
|
|
|
margin-bottom: var(--10px);
|
|
user-select: none;
|
|
}
|
|
|
|
.floated-row > div {
|
|
float: left;
|
|
margin-right: var(--panel-padding);
|
|
}
|
|
|
|
.list-group {
|
|
border-radius: var(--border-radius);
|
|
|
|
&.list-group-no-border {
|
|
border-radius: 0;
|
|
border: 0;
|
|
|
|
> .list-group-item {
|
|
&:first-child {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
border-bottom-width: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
> .list-group-item {
|
|
&:first-child {
|
|
border-top-left-radius: var(--border-radius);
|
|
border-top-right-radius: var(--border-radius);
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom-left-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
border-bottom-width: var(--1px);
|
|
}
|
|
|
|
> a {
|
|
> .item-icon-container {
|
|
display: inline-block;
|
|
width: var(--20px);
|
|
margin-right: var(--8px);
|
|
color: var(--gray-soft);
|
|
}
|
|
}
|
|
}
|
|
|
|
> .list-group-item {
|
|
&.ui-sortable-handle {
|
|
cursor: default;
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-group {
|
|
&.no-side-margin,
|
|
&.no-margin {
|
|
border-radius: 0;
|
|
|
|
> .list-group-item {
|
|
&:first-child {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
margin-bottom: var(--vertical-gap);
|
|
}
|
|
|
|
.list-group-item {
|
|
margin-bottom: 0;
|
|
border-top-width: 0;
|
|
background-color: transparent;
|
|
|
|
&:first-child {
|
|
border-top-width: var(--1px);
|
|
}
|
|
|
|
&.ui-sortable-helper {
|
|
border-top-width: var(--1px) !important;
|
|
border-bottom-width: var(--1px) !important;
|
|
border-left-width: var(--1px) !important;
|
|
border-right-width: var(--1px) !important;
|
|
}
|
|
}
|
|
|
|
.list > .list-group {
|
|
> .list-group-item {
|
|
&:first-child {
|
|
border-top-left-radius: 0;
|
|
border-top-right-radius: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.panel-body .list-group-item {
|
|
background-color: @panel-bg;
|
|
|
|
&.active {
|
|
background-color: @list-group-hover-bg;
|
|
}
|
|
}
|
|
|
|
|
|
#main > .list-container {
|
|
> .no-data {
|
|
margin-top: calc(var(--4px) * 10);
|
|
}
|
|
}
|
|
|
|
#main > div > .left-container + .list-container {
|
|
> .no-data {
|
|
margin-top: var(--15px);
|
|
}
|
|
}
|
|
|
|
#main > div > .list-main-column > .nested-categories-container:not(.hidden) + .list-container {
|
|
> .no-data {
|
|
margin-top: var(--10px);
|
|
}
|
|
}
|
|
|
|
.no-data {
|
|
color: var(--text-gray-color);
|
|
user-select: none;
|
|
}
|
|
|
|
.list-container.list-container-panel {
|
|
> .no-data {
|
|
padding: var(--panel-padding);
|
|
}
|
|
}
|
|
|
|
#main > {
|
|
.list-container.list-container-panel {
|
|
> .list {
|
|
border-left-width: var(--panel-border-width);
|
|
border-right-width: var(--panel-border-width);
|
|
}
|
|
}
|
|
}
|
|
|
|
.none-value {
|
|
user-select: none;
|
|
}
|
|
|
|
.panel-body .list-container > .no-data {
|
|
color: var(--text-muted-color);
|
|
}
|
|
|
|
.nav .list-container > .no-data {
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.detail-field-container {
|
|
padding: var(--7px) 0;
|
|
}
|
|
|
|
#login.panel > .panel-heading {
|
|
background-color: @login-panel-heading-bg;
|
|
padding: 0;
|
|
}
|
|
|
|
.list-expanded .list-group > .list-group-item .list-row-buttons button {
|
|
margin-top: var(--3px);
|
|
}
|
|
|
|
.list {
|
|
.list-row.ui-draggable {
|
|
.cell {
|
|
user-select: none;
|
|
}
|
|
}
|
|
|
|
table.column-resizable {
|
|
> thead > tr {
|
|
> th {
|
|
> .column-resizer {
|
|
display: none;
|
|
position: absolute;
|
|
width: var(--4px);
|
|
height: var(--38px);
|
|
top: 0;
|
|
user-select: none;
|
|
// Important.
|
|
touch-action: none;
|
|
|
|
&:after {
|
|
content: "";
|
|
display: block;
|
|
height: var(--16px);
|
|
top: var(--11px);
|
|
width: 0;
|
|
position: absolute;
|
|
}
|
|
|
|
&:not(.column-resizer-right) {
|
|
left: 0;
|
|
|
|
&:after {
|
|
border-left: var(--1px) solid var(--default-border-color);
|
|
left: var(--1px);
|
|
}
|
|
}
|
|
|
|
&.column-resizer-right {
|
|
right: 0;
|
|
&:after {
|
|
border-right: var(--1px) solid var(--default-border-color);
|
|
right: var(--1px);
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
cursor: col-resize;
|
|
}
|
|
}
|
|
}
|
|
|
|
//&:hover,
|
|
//&.being-column-resized {
|
|
> th {
|
|
> .column-resizer {
|
|
display: block;
|
|
}
|
|
|
|
position: relative;
|
|
|
|
&.being-resized {
|
|
&:after {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
height: var(--4px);
|
|
background-color: var(--default-heading-bg-color);
|
|
bottom: 0;
|
|
left: var(--6px);
|
|
right: var(--6px);
|
|
border-radius: var(--border-radius-small);
|
|
}
|
|
|
|
&:has(.column-resizer-right) {
|
|
&:after {
|
|
right: var(--9px);
|
|
}
|
|
|
|
}
|
|
&:not(:has(.column-resizer-right)) {
|
|
&:after {
|
|
left: var(--9px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list > table {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.list > ul {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.list > table td {
|
|
.label-md {
|
|
line-height: 1.4;
|
|
}
|
|
|
|
> .label-md {
|
|
max-width: ~"calc(100%)";
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
vertical-align: top;
|
|
// Fix the label making the list row higher.
|
|
margin-top: calc(var(--1px) * -1);
|
|
margin-bottom: calc(var(--1px) * -1);
|
|
}
|
|
}
|
|
|
|
.list > table {
|
|
td, th {
|
|
input.form-checkbox-small[type="checkbox"] {
|
|
margin: 0;
|
|
position: relative;
|
|
top: var(--3px);
|
|
}
|
|
}
|
|
|
|
th.field-header-cell {
|
|
min-width: var(--10px);
|
|
}
|
|
}
|
|
|
|
.list > table th span.caret {
|
|
border-top-color: var(--text-muted-color);
|
|
}
|
|
.list > table th span.caret-up {
|
|
border-bottom-color: var(--text-muted-color);
|
|
}
|
|
|
|
.filter {
|
|
a.remove-filter {
|
|
display: none;
|
|
|
|
.fas, .far {
|
|
line-height: var(--21px);
|
|
position: relative;
|
|
top: var(--1px);
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
a.remove-filter {
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
|
|
optgroup {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.panel-body,
|
|
section {
|
|
> p:first-child,
|
|
> h1:first-child,
|
|
> h2:first-child,
|
|
> h3:first-child,
|
|
> h4:first-child,
|
|
> h5:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
> p:last-child,
|
|
ul,
|
|
li,
|
|
.table {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.panel-body > div > .list-expanded {
|
|
margin-left: calc(0rem - var(--panel-padding));
|
|
margin-right: calc(0rem - var(--panel-padding));
|
|
|
|
> .list-group-item {
|
|
border-left-width: 0;
|
|
border-right-width: 0;
|
|
}
|
|
}
|
|
.panel-body > div > .list {
|
|
margin-left: calc(0rem - var(--panel-padding));
|
|
margin-right: calc(0rem - var(--panel-padding));
|
|
}
|
|
.panel-body > div > .list > table td:first-child,
|
|
.panel-body > div > .list > table th:first-child {
|
|
padding-left: var(--panel-padding);
|
|
}
|
|
.panel-body > div > .list > table td:last-child,
|
|
.panel-body > div > .list > table th:last-child {
|
|
padding-right: var(--panel-padding);
|
|
}
|
|
|
|
.modal-body {
|
|
&,
|
|
div.list-no-side-margin-wrapper {
|
|
> div > .list {
|
|
margin-left: calc(0rem - var(--panel-padding));
|
|
margin-right: calc(0rem - var(--panel-padding));
|
|
}
|
|
|
|
> div > .list > table td:first-child,
|
|
> div > .list > table th:first-child {
|
|
padding-left: var(--panel-padding);
|
|
}
|
|
|
|
> div > .list > table td:last-child,
|
|
> div > .list > table th:last-child {
|
|
padding-right: var(--panel-padding);
|
|
}
|
|
|
|
> div > .list-expanded > ul > li {
|
|
border-left-width: 0;
|
|
border-right-width: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
#main > .list-container > .list {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
}
|
|
|
|
#main > .list-container,
|
|
.modal-body > .list-container,
|
|
.modal-body .categories-container + .list-container,
|
|
.left-container + .list-container,
|
|
.nested-categories-container + .list-container {
|
|
> .list {
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
}
|
|
|
|
> .list-expanded {
|
|
> ul > {
|
|
li:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list > {
|
|
table:first-child > tbody:first-child {
|
|
> tr:first-child {
|
|
> td {
|
|
border-top: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-container > .list {
|
|
> .list-group {
|
|
> li.list-group-item:first-child {
|
|
border-top-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
|
|
.modal-body > .list-container > .list {
|
|
border-left-width: 0;
|
|
//border-right-width: 0;
|
|
}
|
|
|
|
#main > .list-container > .list {
|
|
border-left-width: 0;
|
|
//border-right-width: 0;
|
|
}
|
|
|
|
#main > .list-container > .list-tree > ul,
|
|
.modal-body > .list-container > .list-tree > ul {
|
|
padding-top: var(--table-cell-padding);
|
|
padding-bottom: var(--table-cell-padding);
|
|
}
|
|
|
|
.modal-body > ul.no-side-margin {
|
|
border-left-width: 0;
|
|
|
|
> li {
|
|
border-left-width: 0;
|
|
border-right-width: 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: @screen-sm-min) {
|
|
#main > .list-container > .list {
|
|
> table td:first-child,
|
|
> table th:first-child {
|
|
padding-left: var(--container-padding);
|
|
}
|
|
> table td:last-child,
|
|
> table th:last-child {
|
|
padding-right: var(--container-padding);
|
|
}
|
|
}
|
|
|
|
.modal-body .categories-container + .list-container,
|
|
.list-categories-column + .list-main-column .list-container,
|
|
.left-container + .list-container {
|
|
.list {
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
border-top-left-radius: var(--panel-border-radius);
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
|
|
> table {
|
|
border-top-left-radius: var(--panel-border-radius);
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
|
|
td:last-child, th:last-child {
|
|
padding-right: var(--container-padding);
|
|
}
|
|
|
|
td.cell[data-name="buttons"] > .btn-group {
|
|
margin-right: calc(var(--11px) * -1);
|
|
}
|
|
}
|
|
|
|
> .show-more > a {
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
|
|
&:not(.has-show-more) {
|
|
> table {
|
|
> tbody {
|
|
> tr:last-child {
|
|
> td:first-child {
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.modal-body .categories-container + .list-container {
|
|
> .list {
|
|
margin-right: calc(0rem - var(--modal-inner-padding));
|
|
|
|
> table {
|
|
td:last-child, th:last-child {
|
|
padding-right: var(--modal-inner-padding);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-main-column:first-child > .nested-categories-container:not(.hidden) + .list-container {
|
|
.list {
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
|
|
border-left-width: 0;
|
|
//border-right-width: 0;
|
|
|
|
> table td:first-child,
|
|
> table th:first-child {
|
|
padding-left: var(--container-padding);
|
|
}
|
|
> table td:last-child,
|
|
> table th:last-child {
|
|
padding-right: var(--container-padding);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-kanban {
|
|
.panel.starred {
|
|
> .panel-body {
|
|
position: relative;
|
|
|
|
&::before {
|
|
content: " ";
|
|
inset: 0;
|
|
position: absolute;
|
|
left: 0;
|
|
top: calc(50% - var(--8px));
|
|
height: var(--16px);
|
|
width: var(--3px);
|
|
background-color: var(--brand-warning);
|
|
border-top-right-radius: var(--2px);
|
|
border-bottom-right-radius: var(--2px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list > {
|
|
table > tbody,
|
|
ul.list-group {
|
|
> li.list-row.starred {
|
|
position: relative;
|
|
|
|
&::before {
|
|
content: " ";
|
|
inset: 0;
|
|
position: absolute;
|
|
left: 0;
|
|
top: calc(50% - var(--8px));
|
|
height: var(--16px);
|
|
width: var(--3px);
|
|
background-color: var(--brand-warning);
|
|
border-top-right-radius: var(--2px);
|
|
border-bottom-right-radius: var(--2px);
|
|
}
|
|
}
|
|
|
|
> tr.list-row.starred {
|
|
.cell:first-child {
|
|
position: relative;
|
|
|
|
&::before {
|
|
content: " ";
|
|
inset: 0;
|
|
position: absolute;
|
|
left: 0;
|
|
top: var(--11px);
|
|
height: var(--16px);
|
|
width: var(--3px);
|
|
background-color: var(--brand-warning);
|
|
border-top-right-radius: var(--2px);
|
|
border-bottom-right-radius: var(--2px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.panel.dashlet > .panel-body > .list-container > .list {
|
|
> .list-group {
|
|
> li.list-group-item:last-child {
|
|
border-bottom-width: var(--1px);
|
|
border-bottom-left-radius: 0 !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
}
|
|
}
|
|
|
|
> .show-more {
|
|
margin-top: var(--minus-1px);
|
|
|
|
> .btn-block {
|
|
&,
|
|
&:hover {
|
|
border-top: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.field .grid-stack-item-content {
|
|
border: var(--1px) solid var(--default-border-color);
|
|
}
|
|
|
|
.list-expanded > .show-more {
|
|
padding: 0;
|
|
//margin-top: var(--minus-1px);
|
|
}
|
|
|
|
.list-expanded > li.show-more > .btn {
|
|
margin-left: var(--minus-1px);
|
|
margin-right: var(--minus-4px);
|
|
}
|
|
|
|
.list-expanded > ul > li .list-row-buttons {
|
|
margin-right: var(--minus-12px);
|
|
margin-top: var(--minus-10px);
|
|
margin-bottom: var(--minus-5px);
|
|
}
|
|
|
|
.show-more > .btn {
|
|
border-radius: 0;
|
|
border-width: 0;
|
|
}
|
|
|
|
.dashlet-container {
|
|
.dashlet {
|
|
overflow: hidden;
|
|
&.has-dropdown-opened {
|
|
overflow: visible;
|
|
}
|
|
|
|
.panel-heading .panel-title {
|
|
user-select: none;
|
|
}
|
|
|
|
> .dashlet-body {
|
|
.calendar-container > .calendar {
|
|
margin-left: var(--minus-1px);
|
|
margin-right: -var(--minus-1px);
|
|
}
|
|
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
|
|
.list-container > .list {
|
|
> .show-more > a.btn {
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
// If hidden, the dropdown can be partially obscured.
|
|
//overflow: hidden;
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
.panel-body > .list-container > .list,
|
|
.panel-body.dashlet-body > div > .list,
|
|
.list.no-bottom-margin
|
|
{
|
|
> div.show-more {
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.panel-body > div:first-child > .list-expanded:first-child {
|
|
margin-top: calc(0rem - var(--panel-padding));
|
|
}
|
|
.panel-body > div:last-child > .list-expanded:last-child {
|
|
margin-bottom: calc(0rem - var(--panel-padding));
|
|
}
|
|
|
|
.panel-body > div:first-child > .list:first-child {
|
|
margin-top: calc(0rem - var(--panel-padding));
|
|
}
|
|
.panel-body > div:last-child > .list:last-child {
|
|
margin-bottom: calc(0rem - var(--panel-padding));
|
|
}
|
|
|
|
.expanded-row {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
margin-bottom: var(--2px);
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
&:empty {
|
|
margin-bottom: var(--minus-2px);
|
|
}
|
|
}
|
|
|
|
.expanded-row .cell .complex-text {
|
|
white-space: normal;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.expanded-row .cell {
|
|
display: inline;
|
|
}
|
|
|
|
.notification-list .expanded-row > .cell[data-name="data"],
|
|
#notifications-panel .expanded-row > .cell[data-name="data"] {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
|
|
> .right-container {
|
|
width: var(--7px);
|
|
height: var(--10px);
|
|
}
|
|
}
|
|
|
|
#notifications-panel,
|
|
.notification-list {
|
|
.expanded-row {
|
|
white-space: normal;
|
|
overflow: hidden;
|
|
}
|
|
|
|
li.list-group-item {
|
|
&:has(.notification-grouped a[data-action="showGrouped"]) {
|
|
padding-bottom: 0;
|
|
|
|
a[data-action="showGrouped"] {
|
|
margin: 0 auto;
|
|
display: block;
|
|
width: 36px;
|
|
}
|
|
}
|
|
|
|
&:has(.notification-grouped > .list > .list-group) {
|
|
.notification-grouped {
|
|
margin-top: var(--5px);
|
|
}
|
|
}
|
|
|
|
.notification-grouped > .list > .list-group {
|
|
> li {
|
|
&:first-child {
|
|
//border-top-left-radius: var(--border-radius);
|
|
//border-top-right-radius: var(--border-radius);
|
|
}
|
|
|
|
&:last-child {
|
|
//border-bottom-left-radius: var(--border-radius);
|
|
//border-bottom-right-radius: var(--border-radius);
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
#notifications-panel .right {
|
|
padding-top: var(--5px);
|
|
}
|
|
|
|
.caret-up {
|
|
display: inline-block;
|
|
width: 0;
|
|
height: 0;
|
|
margin-left: var(--2px);
|
|
vertical-align: middle;
|
|
border-bottom: var(--4px) solid #000;
|
|
border-right: var(--4px) solid transparent;
|
|
border-top: 0 dotted;
|
|
border-left: var(--4px) solid transparent;
|
|
content: "";
|
|
}
|
|
|
|
.list > table {
|
|
table-layout: fixed;
|
|
|
|
> thead > tr > th {
|
|
user-select: none;
|
|
|
|
> a[role="button"]:not(.selectable) {
|
|
user-select: text;
|
|
}
|
|
}
|
|
}
|
|
|
|
.list > table td,
|
|
.list > table th {
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.list > table td {
|
|
> .link-multiple-item {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.list > table td[data-name="r-checkbox"] {
|
|
overflow: visible;
|
|
}
|
|
|
|
.list > table th[data-name="r-checkbox"] {
|
|
overflow: visible;
|
|
white-space: nowrap;
|
|
.select-all-container {
|
|
line-height: var(--line-height-computed);
|
|
height: var(--line-height-computed);
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.list .checkbox-dropdown {
|
|
margin-left: var(--2px);
|
|
top: calc(var(--2px) * -1);
|
|
}
|
|
|
|
.list .checkbox-dropdown > a {
|
|
padding: 0;
|
|
line-height: 1;
|
|
height: var(--14px);
|
|
}
|
|
|
|
.list .record-checkbox-container {
|
|
height: var(--line-height-computed);
|
|
display: block;
|
|
}
|
|
|
|
.list > table td > div.field {
|
|
white-space: normal;
|
|
}
|
|
|
|
.list > table td.cell[data-name="buttons"],
|
|
.list > table th.action-cell {
|
|
overflow: visible;
|
|
}
|
|
|
|
.list > table th.action-cell {
|
|
a {
|
|
position: relative;
|
|
right: var(--9px);
|
|
padding: var(--4px) var(--3px);
|
|
|
|
&.reset-custom-order {
|
|
> span.fa-times {
|
|
position: relative;
|
|
top: var(--1px);
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
color: var(--btn-text-color);
|
|
}
|
|
}
|
|
}
|
|
|
|
#main > .list-container > .list > table th.action-cell {
|
|
a {
|
|
right: var(--8px);
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
right: var(--3px);
|
|
}
|
|
}
|
|
}
|
|
|
|
td.cell[data-name="buttons"] > .btn-group {
|
|
margin-top: var(--minus-8px);
|
|
margin-bottom: var(--minus-8px);
|
|
margin-right: var(--minus-8px);
|
|
}
|
|
|
|
#main > .list-container > .list > table {
|
|
td.cell[data-name="buttons"] > .btn-group {
|
|
margin-right: var(--minus-10px);
|
|
}
|
|
}
|
|
|
|
table.less-padding td.cell[data-name="buttons"] > .btn-group {
|
|
margin-right: var(--minus-13px);
|
|
}
|
|
|
|
.dashboard-header .dashboard-buttons {
|
|
margin-left: var(--10px);
|
|
}
|
|
|
|
.panel.dashlet > .panel-heading > .panel-title {
|
|
cursor: default;
|
|
}
|
|
|
|
.panel.dashlet > .panel-heading > .btn-group > .btn + .dropdown-toggle {
|
|
padding-left: var(--padding-small-horizontal);
|
|
padding-right: var(--padding-small-horizontal);
|
|
}
|
|
|
|
.panel.dashlet > .panel-heading {
|
|
.dropdown-menu-with-icons a {
|
|
.fas,
|
|
.far,
|
|
.fa {
|
|
font-size: var(--12px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.dashlets {
|
|
.panel.dashlet {
|
|
height: inherit;
|
|
}
|
|
|
|
.dashlet-container {
|
|
overflow-y: hidden;
|
|
}
|
|
|
|
margin: var(--minus-8px);
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
margin-top: 0;
|
|
margin-bottom: 0
|
|
}
|
|
|
|
.ui-draggable-dragging {
|
|
cursor: grabbing;
|
|
|
|
.panel.dashlet > .panel-heading {
|
|
.panel-title {
|
|
.action {
|
|
cursor: grabbing;
|
|
}
|
|
|
|
cursor: grabbing;
|
|
}
|
|
}
|
|
}
|
|
|
|
.panel-title .action {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.dashlets.fallback {
|
|
> div {
|
|
margin-bottom: var(--20px);
|
|
|
|
> .dashlet-container > .panel {
|
|
> .panel-body {
|
|
height: calc(100% - var(--29px));
|
|
}
|
|
}
|
|
}
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
|
|
.panel.dashlet > .panel-body {
|
|
overflow-y: hidden;
|
|
}
|
|
}
|
|
|
|
.panel.dashlet > .panel-body {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
|
|
width: 100%;
|
|
}
|
|
|
|
.dashlets.grid-stack {
|
|
.panel.dashlet {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.grid-stack-item {
|
|
.dashlet {
|
|
height: 100%;
|
|
.dashlet-body {
|
|
height: ~"calc(100% - var(--panel-heading-height))";
|
|
}
|
|
}
|
|
.grid-stack-item-content {
|
|
overflow-x: visible;
|
|
overflow-y: visible;
|
|
}
|
|
}
|
|
|
|
.ui-resizable-handle:before {
|
|
content: '' !important;
|
|
}
|
|
> .grid-stack-item > .ui-resizable-se,
|
|
> .grid-stack-item > .ui-resizable-sw {
|
|
background-image: none;
|
|
}
|
|
}
|
|
|
|
.grid-stack.grid-stack-4 {
|
|
.grid-stack-item[data-gs-width="4"] { width: 100% }
|
|
.grid-stack-item[data-gs-width="3"] { width: 75% }
|
|
.grid-stack-item[data-gs-width="2"] { width: 50% }
|
|
.grid-stack-item[data-gs-width="1"] { width: 25% }
|
|
|
|
.grid-stack-item[data-gs-x="3"] { left: 75% }
|
|
.grid-stack-item[data-gs-x="2"] { left: 50% }
|
|
.grid-stack-item[data-gs-x="1"] { left: 25% }
|
|
}
|
|
|
|
|
|
.list-container + .button-container,
|
|
.row-list-container + .button-container {
|
|
margin-top: var(--vertical-gap);
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.list-expanded > li > .right > .btn-group {
|
|
top: var(--minus-7px);
|
|
right: var(--minus-11px);
|
|
}
|
|
|
|
.list > table thead > th {
|
|
border-top-width: var(--1px) !important;
|
|
}
|
|
|
|
.show-more > .btn-block {
|
|
text-align: left;
|
|
padding: var(--7px) var(--10px) var(--7px) var(--panel-padding);
|
|
|
|
&,
|
|
&:hover {
|
|
border-top: var(--1px) solid var(--default-border-color);
|
|
}
|
|
}
|
|
|
|
label.attach-file-label {
|
|
overflow: hidden;
|
|
width: calc(var(--5px) * 10);
|
|
cursor: pointer;
|
|
margin-bottom: 0;
|
|
|
|
> span.btn {
|
|
cursor: pointer;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
> input.file {
|
|
opacity: 0;
|
|
width: var(--1px);
|
|
}
|
|
}
|
|
|
|
.attachment-upload {
|
|
> .attachment-control > .dropdown > .btn {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
> .attachments > div:first-child {
|
|
margin-top: var(--2px);
|
|
}
|
|
}
|
|
|
|
.gray-box {
|
|
background-color: var(--select-item-bg);
|
|
margin: 0 var(--5px) var(--3px) 0;
|
|
padding: var(--2px) var(--3px) var(--2px) var(--5px);
|
|
|
|
display: inline-block;
|
|
width: 100%;
|
|
max-width: calc(var(--30px) * 10);
|
|
|
|
&.preview {
|
|
a {
|
|
color: @text-color;
|
|
}
|
|
}
|
|
|
|
border-radius: var(--border-radius);
|
|
|
|
a.remove-attachment {
|
|
> .fas {
|
|
position: relative;
|
|
top: var(--1px);
|
|
padding-right: var(--1px);
|
|
}
|
|
}
|
|
|
|
&:has(+ .uploading-message) {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
+ .uploading-message {
|
|
display: block;
|
|
margin-bottom: var(--3px);
|
|
color: var(--gray-soft);
|
|
//position: relative;
|
|
//top: var(--minus-2px);
|
|
}
|
|
}
|
|
|
|
.gray-box .preview {
|
|
overflow-wrap: break-word;
|
|
max-width: calc(100% - var(--16px));
|
|
display: inline-block;
|
|
|
|
a {
|
|
color: @text-color;
|
|
}
|
|
|
|
&:has( > img) {
|
|
margin-top: var(--3px);
|
|
margin-bottom: var(--3px);
|
|
}
|
|
}
|
|
|
|
.attachment-block-container {
|
|
display: grid;
|
|
grid-column-gap: var(--6px);
|
|
grid-template-columns: repeat(auto-fill, minmax(var(--50px), var(--256px)));
|
|
}
|
|
|
|
.attachment-block-container.attachment-block-container-large {
|
|
grid-template-columns: repeat(auto-fill, minmax(var(--50px), var(--512px)));
|
|
}
|
|
|
|
.attachment-block-container.attachment-block-container-small {
|
|
grid-template-columns: repeat(auto-fill, minmax(var(--50px), var(--128px)));
|
|
}
|
|
|
|
.attachment-preview {
|
|
vertical-align: top;
|
|
margin: var(--3px) 0 var(--3px) 0;
|
|
|
|
> a[data-action="showImagePreview"] {
|
|
display: inline-block;
|
|
|
|
&:focus-visible {
|
|
outline-offset: var(--1px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.field > .attachment-block-container > .attachment-block > .attachment-preview {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.attachment-block {
|
|
&:not(.attachment-block-preview) {
|
|
display: flex;
|
|
gap: var(--4px);
|
|
align-items: baseline;
|
|
overflow: hidden;
|
|
margin-bottom: var(--2px);
|
|
|
|
> a {
|
|
flex: 1;
|
|
min-width: 0;
|
|
white-space: normal;
|
|
word-break: break-word;
|
|
}
|
|
}
|
|
|
|
&.attachment-block-preview {
|
|
.attachment-preview {
|
|
display: block;
|
|
vertical-align: top;
|
|
margin-bottom: var(--2px);
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.list-row > .cell {
|
|
> .attachment-block-container > .attachment-block > .attachment-preview {
|
|
margin-bottom: calc(var(--2px) - var(--table-cell-padding));
|
|
margin-top: calc(var(--2px) - var(--table-cell-padding));
|
|
|
|
&:not(.no-shrink) {
|
|
max-height: calc(var(--line-height-computed) + var(--table-cell-padding) * 2 - var(--4px));
|
|
|
|
img {
|
|
max-height: calc(var(--line-height-computed) + var(--table-cell-padding) * 2 - var(--4px));
|
|
vertical-align: top;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.stick-sub {
|
|
position: fixed;
|
|
top: 0;
|
|
margin-right: 0;
|
|
margin-bottom: 0;
|
|
z-index: 5;
|
|
}
|
|
|
|
.stick-sub.button-container {
|
|
background-color: var(--navbar-bg);
|
|
//padding: var(--padding-small-vertical) var(--container-padding) var(--padding-small-vertical) var(--container-padding);
|
|
padding: var(--padding-small-vertical) 0 var(--padding-small-vertical) 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.stick-sub > .sub-container {
|
|
max-width: var(--container-max-width);
|
|
padding: 0 var(--container-padding) 0 var(--container-padding);
|
|
margin: 0 auto;
|
|
|
|
@media screen and (min-width: @screen-sm-min) {
|
|
&.sub-container-center-4 {
|
|
max-width: calc(var(--5px) * 100);
|
|
padding: 0 0;
|
|
}
|
|
|
|
&.sub-container-center-5 {
|
|
max-width: calc(var(--5px) * 100);
|
|
padding: 0 0;
|
|
}
|
|
|
|
&.sub-container-center-6 {
|
|
max-width: calc(var(--6px) * 100);
|
|
padding: 0 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
.stick-sub {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
|
|
.notifications-badge-container > .notifications-button > .number-badge {
|
|
position: absolute;
|
|
z-index: 10;
|
|
font-size: var(--9px);
|
|
padding: var(--2px) var(--5px);
|
|
display: inline-block;
|
|
top: var(--7px);
|
|
left: var(--27px);
|
|
background-color: var(--brand-danger);
|
|
color: @white-color;
|
|
}
|
|
|
|
.danger.glyphicon {
|
|
color: @brand-danger;
|
|
}
|
|
|
|
.warning.glyphicon {
|
|
color: @brand-warning;
|
|
}
|
|
|
|
.icon-rotate-180 {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.icon-rotate-90 {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.icon-flip-horizontal {
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
.link-multiple-item {
|
|
.link-multiple-item-icon {
|
|
margin-right: var(--4px);
|
|
}
|
|
}
|
|
|
|
.link-field-icon {
|
|
margin-right: var(--4px);
|
|
}
|
|
|
|
.field-row-text-item {
|
|
margin-top: var(--8px);
|
|
display: inline-block;
|
|
}
|
|
|
|
.post-container > textarea.note,
|
|
textarea.auto-height {
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
#global-search-panel,
|
|
#last-viewed-panel {
|
|
> .panel {
|
|
border-top-right-radius: 0;
|
|
|
|
.panel-heading {
|
|
.close-link {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
> .panel-body {
|
|
max-height: @navbar-panel-body-max-height;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
padding-bottom: var(--panel-padding);
|
|
scrollbar-gutter: stable;
|
|
}
|
|
}
|
|
}
|
|
|
|
#notifications-panel {
|
|
> .panel {
|
|
overflow: hidden;
|
|
border-top-right-radius: 0;
|
|
|
|
.panel-heading {
|
|
.close-link {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
> .panel-heading {
|
|
background-color: var(--dropdown-bg);
|
|
}
|
|
|
|
> .panel-body {
|
|
max-height: @navbar-panel-body-max-height;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
|
|
background-color: var(--dropdown-bg);
|
|
scrollbar-gutter: stable;
|
|
|
|
ul > li.list-group-item {
|
|
background-color: var(--dropdown-bg);
|
|
}
|
|
|
|
.show-more a {
|
|
border-bottom-right-radius: 0;
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
border-bottom-left-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
border-color: var(--dropdown-border);
|
|
border-width: var(--dropdown-border-width);
|
|
|
|
> .panel-body {
|
|
background-color: var(--dropdown-bg);
|
|
}
|
|
}
|
|
}
|
|
|
|
.modal-title-text span.color-icon {
|
|
margin-right: var(--2px);
|
|
}
|
|
|
|
.header-breadcrumbs {
|
|
.color-icon {
|
|
font-size: 50%;
|
|
left: 0;
|
|
margin-right: var(--4px);
|
|
top: var(--minus-4px);
|
|
position: relative;
|
|
}
|
|
|
|
.breadcrumb-item:after,
|
|
.breadcrumb-separator:after {
|
|
content: "";
|
|
display: block;
|
|
}
|
|
|
|
.breadcrumb-item {
|
|
a {
|
|
font-weight: 400;
|
|
}
|
|
}
|
|
}
|
|
|
|
.breadcrumb-separator {
|
|
> span {
|
|
color: var(--gray-soft);
|
|
|
|
&::before {
|
|
content: "\203A";
|
|
display: inline-block;
|
|
}
|
|
|
|
padding: 0 0.1em;
|
|
}
|
|
}
|
|
|
|
.modal-title-text {
|
|
.chevron-right {
|
|
color: var(--gray-soft);
|
|
}
|
|
}
|
|
|
|
span.color-icon {
|
|
font-size: 50%;
|
|
line-height: var(--15px);
|
|
top: var(--minus-2px);
|
|
left: var(--1px);
|
|
margin-right: var(--1px);
|
|
display: inline;
|
|
position: relative;
|
|
}
|
|
|
|
.small span.color-icon {
|
|
font-size: 50%;
|
|
}
|
|
|
|
td > span.color-icon {
|
|
left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
#global-search-panel .panel-body .cell > .color-icon {
|
|
margin-right: var(--5px);
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
.list {
|
|
width: auto;
|
|
overflow-y: hidden;
|
|
overflow-x: auto;
|
|
}
|
|
.list.list-expanded {
|
|
width: auto;
|
|
overflow-x: unset;
|
|
overflow-y: unset;
|
|
}
|
|
.list > table {
|
|
min-width: @list-table-sm-screen-min-width;
|
|
font-size: 96%;
|
|
|
|
& + .show-more {
|
|
min-width: @list-table-sm-screen-min-width;
|
|
}
|
|
}
|
|
|
|
#main > .list-container > .list > table {
|
|
td:first-child,
|
|
th:first-child {
|
|
padding-left: var(--10px);
|
|
}
|
|
td:last-child,
|
|
th:last-child {
|
|
padding-right: var(--10px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.expanded-row {
|
|
span.label {
|
|
position: relative;
|
|
top: var(--minus-1px);
|
|
|
|
&.label-md {
|
|
padding: @label-padding-small;
|
|
font-size: var(--font-size-small);
|
|
}
|
|
}
|
|
|
|
.cell.small {
|
|
span.label.label-md {
|
|
//font-size: var(--11px);
|
|
//top: var(--minus-2px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.stream-head-text-container {
|
|
span.label {
|
|
position: relative;
|
|
top: var(--minus-1px);
|
|
}
|
|
|
|
&:not(:first-child) {
|
|
padding-left: var(--29px);
|
|
}
|
|
|
|
> .icon:first-child {
|
|
min-width: var(--16px);
|
|
text-align: center;
|
|
margin-right: var(--6px);
|
|
}
|
|
|
|
[data-key="user"] {
|
|
> a {
|
|
&,
|
|
&:hover,
|
|
&:focus {
|
|
color: var(--btn-text-color);
|
|
}
|
|
}
|
|
}
|
|
|
|
.message {
|
|
a {
|
|
&[data-scope="User"] {
|
|
&,
|
|
&:hover,
|
|
&:focus {
|
|
color: var(--btn-text-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.stream-post-container,
|
|
.stream-attachments-container,
|
|
.stream-details-container,
|
|
.stream-subject-container
|
|
{
|
|
padding: var(--2px) 0 var(--2px) var(--29px);
|
|
margin-bottom: var(--2px);
|
|
}
|
|
|
|
.stream-date-container {
|
|
display: inline-block;
|
|
width: 100%;
|
|
|
|
.pin-icon {
|
|
display: inline-block;
|
|
float: right;
|
|
position: absolute;
|
|
right: var(--14px);
|
|
top: var(--36px);
|
|
|
|
color: var(--text-muted-color);
|
|
}
|
|
|
|
.reactions-container {
|
|
float: right;
|
|
display: inline-flex;
|
|
width: calc(100% - var(--190px));
|
|
flex-wrap: wrap;
|
|
column-gap: var(--12px);
|
|
row-gap: var(--4px);
|
|
padding-top: var(--3px);
|
|
justify-content: right;
|
|
|
|
a {
|
|
&:hover {
|
|
text-decoration: none;
|
|
|
|
span.text-primary {
|
|
color: var(--link-hover-color);
|
|
}
|
|
|
|
span.text-primary {
|
|
color: var(--link-hover-color);
|
|
}
|
|
|
|
span.text-warning {
|
|
color: var(--state-warning-text-10);
|
|
}
|
|
}
|
|
|
|
text-align: right;
|
|
min-width: var(--30px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.stream-head-container {
|
|
margin-bottom: var(--4px);
|
|
|
|
> .stream-head-left-icon-container {
|
|
width: var(--26px);
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.stream-head-container .internal-badge {
|
|
position: absolute;
|
|
top: var(--35px);
|
|
left: var(--19px);
|
|
}
|
|
|
|
.stream-head-container .internal-badge > span {
|
|
color: @brand-danger;
|
|
}
|
|
|
|
.stream-head-container > img.avatar {
|
|
display: inline-block;
|
|
margin-top: var(--minus-3px);
|
|
margin-right: var(--3px);
|
|
margin-bottom: var(--minus-2px);
|
|
}
|
|
|
|
|
|
.stream-post-container .cell-post {
|
|
overflow-wrap: break-word;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.stream-details-container {
|
|
table.audited-summary-table {
|
|
background-color: transparent;
|
|
table-layout: fixed;
|
|
|
|
td {
|
|
//white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
|
|
&:first-child {
|
|
padding-left: 0;
|
|
}
|
|
|
|
&:last-child {
|
|
padding-right: 0;
|
|
}
|
|
|
|
padding-top: var(--padding-small-vertical);
|
|
padding-bottom: var(--padding-small-vertical);
|
|
}
|
|
}
|
|
|
|
&:has(+ .stream-details-container:not(.hidden) > .audited-summary-table) {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.none-value {
|
|
color: var(--text-gray-color);
|
|
}
|
|
}
|
|
|
|
.stream-details-container > ul {
|
|
padding-left: 0;
|
|
list-style-type: none;
|
|
|
|
|
|
> li {
|
|
margin-bottom: var(--4px);
|
|
}
|
|
|
|
> li:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.list table td img.image-preview {
|
|
border-radius: var(--border-radius-small);
|
|
}
|
|
|
|
img.avatar {
|
|
border-radius: 50%;
|
|
user-select: none;
|
|
}
|
|
|
|
img.avatar.avatar-link {
|
|
display: inline-block;
|
|
margin-top: 0;
|
|
margin-right: var(--3px);
|
|
position: relative;
|
|
vertical-align: top;
|
|
top: var(--1px);
|
|
|
|
&[data-width="16"] {
|
|
top: var(--3px);
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
&[data-width="20"] {
|
|
top: 0;
|
|
}
|
|
}
|
|
|
|
div.field,
|
|
.link-container > .list-group-item,
|
|
.link-multiple-item {
|
|
> img.avatar-link,
|
|
> div > img.avatar-link {
|
|
margin-right: var(--7px);
|
|
}
|
|
}
|
|
|
|
.expanded-row {
|
|
.cell {
|
|
img.avatar-link {
|
|
margin-right: var(--5px);
|
|
}
|
|
}
|
|
}
|
|
|
|
td.cell {
|
|
> img.avatar-link {
|
|
margin-right: var(--6px);
|
|
}
|
|
}
|
|
|
|
.name-avatar {
|
|
> .avatar {
|
|
margin-left: var(--1px);
|
|
margin-right: var(--2px);
|
|
}
|
|
}
|
|
|
|
div:has(.avatar-in-input),
|
|
div:has(.icon-in-input) {
|
|
&:not(:has(.being-typed)) {
|
|
> .input-group > input {
|
|
padding-left: var(--33px);
|
|
}
|
|
|
|
&:has(.color-icon) {
|
|
> .input-group > input {
|
|
padding-left: var(--21px);
|
|
}
|
|
}
|
|
|
|
> .icon-in-input,
|
|
> .avatar-in-input {
|
|
display: inline-block;
|
|
position: absolute;
|
|
z-index: 3;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
}
|
|
|
|
> .avatar-in-input {
|
|
top: var(--9px);
|
|
left: var(--10px);
|
|
}
|
|
|
|
> .icon-in-input {
|
|
top: var(--11px);
|
|
left: var(--10px);
|
|
}
|
|
}
|
|
|
|
> .avatar-in-input,
|
|
> .icon-in-input {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.expanded-row {
|
|
.cell {
|
|
> .email-address-detail-item {
|
|
display: inline-block;
|
|
}
|
|
|
|
> .email-address-lines-container {
|
|
display: inline-block;
|
|
|
|
color: var(--gray-soft);
|
|
}
|
|
}
|
|
}
|
|
|
|
.email-address-detail-item {
|
|
> img.avatar {
|
|
margin-right: var(--5px);
|
|
}
|
|
}
|
|
|
|
div[data-scope="User"],
|
|
div[data-scope="PortalUser"],
|
|
div[data-scope="ApiUser"] {
|
|
.field[data-name="avatar"] {
|
|
> a > img,
|
|
> img {
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.link-container .list-group-item {
|
|
padding: var(--padding-base-vertical) var(--padding-base-horizontal);
|
|
line-height: var(--line-height-computed);
|
|
}
|
|
|
|
.flotr-labels {
|
|
user-select: none;
|
|
}
|
|
|
|
.flotr-mouse-value {
|
|
cursor: default;
|
|
font-size: var(--13px);
|
|
text-align: center;
|
|
user-select: none;
|
|
}
|
|
|
|
.flotr-grid-label-y {
|
|
min-height: 1.2em;
|
|
line-height: 1.1em;
|
|
max-height: 2.1em;
|
|
overflow: hidden;
|
|
user-select: none;
|
|
}
|
|
|
|
.flotr-grid-label-x {
|
|
min-height: 1.2em;
|
|
max-height: 1.2em;
|
|
line-height: 1.1em;
|
|
overflow: hidden;
|
|
padding: 0 var(--1px) var(--1px);
|
|
user-select: none;
|
|
}
|
|
|
|
.legend-container {
|
|
overflow-x: hidden;
|
|
overflow-y: hidden;
|
|
padding-top: var(--7px);
|
|
|
|
> table {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
table td {
|
|
padding: var(--2px) var(--2px);
|
|
line-height: 1em;
|
|
}
|
|
|
|
td.flotr-legend-label {
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
user-select: none;
|
|
}
|
|
|
|
td.flotr-legend-label > span {
|
|
display: block;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
line-height: 1.3em;
|
|
max-height: var(--15px);
|
|
}
|
|
|
|
.flotr-legend-color-box > div {
|
|
position: relative;
|
|
top: var(--1px);
|
|
|
|
> div {
|
|
border-radius: var(--border-radius-small);
|
|
|
|
> div {
|
|
position: relative;
|
|
top: calc(var(--1px) * -1);
|
|
left: 0;
|
|
border-radius: var(--border-radius-small);
|
|
margin: calc(var(--1px) * -1);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.complex-text-container.cut {
|
|
position: relative;
|
|
|
|
overflow: hidden;
|
|
|
|
> .complex-text {
|
|
|
|
&::before {
|
|
content: " ";
|
|
width: 100%;
|
|
height: var(--50px);
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
background: linear-gradient(to bottom, transparent, var(--panel-bg));
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-container[data-role="pinned"] .list-group-item:not(.active) .complex-text-container.cut {
|
|
> .complex-text {
|
|
&::before {
|
|
background: linear-gradient(to bottom, transparent, var(--warning-bg));
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-group-item.active .complex-text-container.cut {
|
|
> .complex-text {
|
|
&::before {
|
|
background: linear-gradient(to bottom, transparent, var(--default-heading-bg-color));
|
|
}
|
|
}
|
|
}
|
|
|
|
.see-more-container {
|
|
> a {
|
|
&,
|
|
&:focus,
|
|
&:hover,
|
|
&:active {
|
|
text-decoration: none;
|
|
}
|
|
|
|
&:hover {
|
|
> .text {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.complex-text {
|
|
a {
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
img {
|
|
max-width: 100%;
|
|
max-height: var(--500px);
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
float: left;
|
|
position: relative;
|
|
top: var(--3px);
|
|
margin-right: var(--6px);
|
|
}
|
|
|
|
li {
|
|
&:has(> input[type="checkbox"]) {
|
|
list-style-type: none;
|
|
margin-left: var(--minus-16px);
|
|
}
|
|
}
|
|
}
|
|
|
|
table.table td.cell .complex-text,
|
|
table.table td.cell .html-container {
|
|
word-wrap: break-word;
|
|
white-space: normal;
|
|
}
|
|
|
|
.complex-text.complex-text-memo {
|
|
h1 {
|
|
font-size: calc(var(--font-size-base) * 1.8);
|
|
font-weight: 500;
|
|
margin-top: var(--line-height-computed);
|
|
margin-bottom: calc(var(--line-height-computed-half) * 1.3);
|
|
}
|
|
|
|
h2 {
|
|
font-size: calc(var(--font-size-base) * 1.5);
|
|
font-weight: 500;
|
|
margin-top: calc(var(--line-height-computed-half) * 1.4);
|
|
margin-bottom: calc(var(--line-height-computed-half) * 1.2);
|
|
}
|
|
|
|
h3, h4, h5, h6 {
|
|
font-size: calc(var(--font-size-base) * 1.1);
|
|
margin-top: calc(var(--line-height-computed-half) * 1.2);
|
|
margin-bottom: var(--line-height-computed-half);
|
|
}
|
|
}
|
|
|
|
.field > .complex-text-container > .complex-text {
|
|
> h1:first-child,
|
|
> h2:first-child {
|
|
margin-top: var(--8px) !important;
|
|
}
|
|
> h3:first-child {
|
|
margin-top: var(--4px) !important;
|
|
}
|
|
}
|
|
|
|
.complex-text,
|
|
.confirm-message,
|
|
.alert,
|
|
.alert > .message,
|
|
.popover-content {
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6,
|
|
p,
|
|
> ul,
|
|
> ol {
|
|
&:first-child {
|
|
margin-top: 0 !important;
|
|
}
|
|
}
|
|
|
|
h1 {
|
|
font-size: calc(var(--font-size-base) * 1.4);
|
|
font-weight: 500;
|
|
margin-top: calc(var(--line-height-computed) * 1.5);
|
|
margin-bottom: calc(var(--line-height-computed) / 2 * 1.5);
|
|
|
|
padding-bottom: 0.4em;
|
|
border-bottom: var(--1px) solid var(--panel-default-border);
|
|
}
|
|
|
|
h2 {
|
|
font-size: calc(var(--font-size-base) * 1.2);
|
|
font-weight: 500;
|
|
margin-top: calc(var(--line-height-computed) * 1.24);
|
|
margin-bottom: calc(var(--line-height-computed) / 2 * 1.2);
|
|
}
|
|
|
|
h3 {
|
|
font-size: calc(var(--font-size-base) * 1.1);
|
|
font-weight: 500;
|
|
margin-top: calc(var(--line-height-computed) / 2 * 1.4);
|
|
margin-bottom: calc(var(--line-height-computed) / 2);
|
|
}
|
|
|
|
h4 {
|
|
font-weight: 500;
|
|
margin-top: calc(var(--line-height-computed) / 2 * 1.3);
|
|
margin-bottom: calc(var(--line-height-computed) / 2);
|
|
}
|
|
|
|
h5, h6 {
|
|
font-weight: normal;
|
|
}
|
|
|
|
h5, h6 {
|
|
margin-top: calc(var(--line-height-computed) / 2);
|
|
margin-bottom: calc(var(--line-height-computed) / 2);
|
|
}
|
|
|
|
|
|
h4, h5, h6 {
|
|
font-size: var(--font-size-base);
|
|
}
|
|
|
|
p,
|
|
ul,
|
|
ol,
|
|
pre,
|
|
blockquote {
|
|
margin-top: var(--line-height-computed-half);
|
|
}
|
|
|
|
blockquote {
|
|
margin-bottom: var(--line-height-computed-half);
|
|
}
|
|
|
|
pre,
|
|
blockquote {
|
|
&:first-child {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
|
|
p,
|
|
> ul,
|
|
> ol,
|
|
blockquote,
|
|
pre {
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
}
|
|
|
|
ul,
|
|
ol {
|
|
> li {
|
|
ul, ol{
|
|
margin-top: var(--4px);
|
|
margin-bottom: var(--4px);
|
|
}
|
|
|
|
pre,
|
|
blockquote {
|
|
&:first-child {
|
|
margin-top: var(--2px);
|
|
}
|
|
|
|
&:last-child {
|
|
margin-bottom: var(--2px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
ul > li {
|
|
list-style-type: disc;
|
|
}
|
|
|
|
ul, ol {
|
|
padding-left: var(--30px);
|
|
}
|
|
|
|
table {
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
|
|
td, th {
|
|
padding: var(--table-cell-padding-half) var(--table-cell-padding);
|
|
border: var(--1px) solid var(--default-border-color);
|
|
vertical-align: top;
|
|
}
|
|
|
|
+ table {
|
|
margin-top: var(--line-height-computed);
|
|
}
|
|
}
|
|
}
|
|
|
|
.field > .html-container {
|
|
overflow: hidden;
|
|
|
|
h1:first-child,
|
|
h2:first-child,
|
|
h3:first-child,
|
|
h4:first-child,
|
|
h5:first-child,
|
|
h6:first-child,
|
|
> p:first-child,
|
|
> ul:first-child,
|
|
> ol:first-child,
|
|
> pre:first-child,
|
|
> blockquote:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
ul,
|
|
ol {
|
|
padding-left: var(--30px);
|
|
margin-bottom: var(--line-height-computed-half);
|
|
}
|
|
|
|
> p,
|
|
> ul,
|
|
> ol,
|
|
> pre,
|
|
> blockquote,
|
|
> table {
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
ul > li {
|
|
list-style-type: disc;
|
|
}
|
|
|
|
p,
|
|
ul,
|
|
ol,
|
|
pre,
|
|
blockquote {
|
|
margin-top: var(--line-height-computed-half);
|
|
}
|
|
}
|
|
|
|
.list-group-tree {
|
|
border: 0;
|
|
|
|
> li {
|
|
border: 0;
|
|
padding: 0 0 0 var(--panel-padding);
|
|
|
|
.cell {
|
|
padding: var(--3px) 0;
|
|
|
|
.remove-link {
|
|
margin-left: var(--4px);
|
|
margin-right: var(--4px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-tree {
|
|
&[data-editable="true"] {
|
|
.list-group-tree {
|
|
> li {
|
|
position: relative;
|
|
|
|
&.border-bottom-highlighted,
|
|
&.border-top-highlighted {
|
|
&::after {
|
|
display: block;
|
|
content: " ";
|
|
height: var(--2px);
|
|
width: var(--11px);
|
|
background-color: var(--gray-soft);
|
|
left: var(--32px);
|
|
position: absolute;
|
|
border-radius: var(--1px);
|
|
}
|
|
}
|
|
|
|
&.border-bottom-highlighted {
|
|
&::after {
|
|
bottom: var(--minus-1px);
|
|
}
|
|
}
|
|
|
|
&.border-top-highlighted {
|
|
&::after {
|
|
top: var(--minus-1px);
|
|
}
|
|
}
|
|
|
|
> .cell {
|
|
user-select: none;
|
|
}
|
|
|
|
a[data-action="fold"],
|
|
a[data-action="unfold"],
|
|
a[data-action="remove"],
|
|
a[data-action="create"] {
|
|
&,
|
|
&:hover {
|
|
color: var(--btn-text-color);
|
|
}
|
|
}
|
|
|
|
a[data-role="moveHandle"] {
|
|
&,
|
|
&:hover {
|
|
color: var(--text-muted-color);
|
|
}
|
|
|
|
margin-left: var(--2px);
|
|
margin-right: var(--3px);
|
|
|
|
font-size: var(--12px);
|
|
cursor: grab;
|
|
|
|
&:active {
|
|
cursor: grabbing;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.categories-container {
|
|
.root-item {
|
|
padding-bottom: var(--3px);
|
|
|
|
a, a:hover, a:active {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-group-tree {
|
|
.fa-chevron-down,
|
|
.fa-chevron-right,
|
|
.empty-icon {
|
|
display: inline-block;
|
|
width: var(--12px);
|
|
}
|
|
}
|
|
|
|
.categories-container {
|
|
.root-item {
|
|
a {
|
|
&,
|
|
&:hover {
|
|
color: var(--btn-text-color);
|
|
}
|
|
|
|
&.text-bold {
|
|
color: var(--brand-danger);
|
|
}
|
|
}
|
|
}
|
|
.list-group-tree {
|
|
.list-group-item {
|
|
a {
|
|
&,
|
|
&:hover {
|
|
color: var(--btn-text-color);
|
|
}
|
|
|
|
&.text-bold {
|
|
color: var(--brand-danger);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
.folders-container {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: @screen-sm-min) {
|
|
.folders-container {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: var(--minus-1px); // Fix 1px shift on sticked.
|
|
}
|
|
|
|
.folders-container.sticked {
|
|
position: fixed;
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
|
|
.list-group-side {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.list-group-side {
|
|
border: 0;
|
|
|
|
> li {
|
|
border: 0;
|
|
padding: var(--5px) var(--4px) var(--5px) calc(var(--container-padding) - var(--3px));
|
|
border-left: var(--3px) solid transparent;
|
|
border-top-right-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
|
|
@media screen and (min-width: @screen-sm-min) {
|
|
&.group-start {
|
|
margin-top: var(--10px);
|
|
}
|
|
}
|
|
|
|
&.selected {
|
|
border-color: var(--brand-danger);
|
|
|
|
.item-icon-container {
|
|
color: var(--brand-danger);
|
|
}
|
|
|
|
.cell {
|
|
padding: var(--2px) 0;
|
|
}
|
|
|
|
a {
|
|
&.side-link,
|
|
&:hover.side-link,
|
|
&:active.side-link,
|
|
&:visited.side-link,
|
|
&:focus.side-link {
|
|
color: var(--brand-danger);
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.droppable {
|
|
&.active {
|
|
&:not(.success) {
|
|
border-left-color: var(--brand-warning);
|
|
}
|
|
background-color: var(--state-warning-bg);
|
|
}
|
|
&.success {
|
|
background-color: transparent;
|
|
transition: 900ms linear background-color;
|
|
}
|
|
}
|
|
|
|
> a {
|
|
&,
|
|
&:hover {
|
|
color: var(--btn-text-color);
|
|
}
|
|
}
|
|
|
|
.item-icon-container {
|
|
display: inline-block;
|
|
width: var(--18px);
|
|
margin-left: var(--minus-2px);
|
|
margin-right: var(--8px);
|
|
text-align: center;
|
|
|
|
> span {
|
|
font-size: var(--12px);
|
|
position: relative;
|
|
top: var(--minus-1px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-group-side a:hover,
|
|
.list-group-side a:focus,
|
|
.list-group-tree a:hover,
|
|
.list-group-tree a:focus {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.email-address-create-dropdown .btn {
|
|
position: relative;
|
|
top: var(--minus-2px);
|
|
padding: 0 var(--4px);
|
|
//noinspection CssReplaceWithShorthandSafely
|
|
margin: 0;
|
|
//noinspection CssOverwrittenProperties,CssReplaceWithShorthandSafely
|
|
margin-bottom: 0;
|
|
border: 0;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.email-address-create-dropdown + .email-address-line {
|
|
display: block;
|
|
width: calc(100% - var(--17px));
|
|
}
|
|
|
|
#main > .calendar-container {
|
|
margin-top: var(--10px);
|
|
|
|
> .button-container {
|
|
user-select: none;
|
|
}
|
|
|
|
.calendar-type-button-group {
|
|
margin-left: var(--6px);
|
|
}
|
|
|
|
.calendar {
|
|
border-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
.timeline {
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
border-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
|
|
.dashlet-body {
|
|
.fc-daygrid,
|
|
.fc-timegrid {
|
|
border-top: var(--1px) solid var(--calendar-border);
|
|
}
|
|
}
|
|
|
|
#notifications-panel {
|
|
position: absolute;
|
|
width: @notifications-panel-width;
|
|
z-index: 1001;
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
#global-search-panel,
|
|
#last-viewed-panel {
|
|
position: absolute;
|
|
width: @global-search-panel-width;
|
|
z-index: 1001;
|
|
right: 0;
|
|
left: auto;
|
|
|
|
> .panel {
|
|
overflow: hidden;
|
|
border-color: var(--dropdown-border);
|
|
border-width: var(--dropdown-border-width);
|
|
|
|
> .panel-heading {
|
|
background-color: var(--dropdown-bg);
|
|
}
|
|
|
|
> .panel-body {
|
|
background-color: var(--dropdown-bg);
|
|
|
|
ul > li.list-group-item {
|
|
background-color: var(--dropdown-bg);
|
|
}
|
|
|
|
.show-more a {
|
|
border-bottom-right-radius: 0;
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
border-bottom-left-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.post-container {
|
|
.internal-mode-switcher {
|
|
color: var(--text-muted-color);
|
|
margin-left: var(--14px);
|
|
display: inline-block;
|
|
position: relative;
|
|
top: var(--2px);
|
|
}
|
|
|
|
.internal-mode-switcher.enabled {
|
|
color: @brand-danger;
|
|
}
|
|
.attachments {
|
|
width: var(--300px);
|
|
}
|
|
|
|
.stream-post-preview {
|
|
margin-right: var(--10px);
|
|
}
|
|
}
|
|
|
|
.post-control .attachments {
|
|
width: calc(var(--27px) * 10);
|
|
}
|
|
|
|
.inline-cancel-link {
|
|
margin-left: var(--8px);
|
|
}
|
|
|
|
.panel .item-container.ui-sortable-helper {
|
|
background-color: @panel-bg;
|
|
}
|
|
|
|
.dynamic-logic-expression-container {
|
|
div.item-list[data-level="0"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
> div.item-list {
|
|
> div:not(.group-operator) {
|
|
border-top-right-radius: var(--border-radius-small);
|
|
border-bottom-right-radius: var(--border-radius-small);
|
|
}
|
|
}
|
|
|
|
div.item-list {
|
|
margin-left: var(--30px);
|
|
|
|
> div {
|
|
margin: 0 0 var(--10px) 0;
|
|
|
|
&:not(.group-operator) {
|
|
border-top-left-radius: var(--border-radius-small);
|
|
border-bottom-left-radius: var(--border-radius-small);
|
|
|
|
a[data-action="remove"] {
|
|
visibility: hidden;
|
|
}
|
|
|
|
&:not(:empty) {
|
|
outline: var(--default-border-color) var(--1px) solid;
|
|
outline-offset: var(--4px);
|
|
}
|
|
|
|
&:hover:not(:has(div.item-list > div:hover)) {
|
|
outline: var(--default-border-color) var(--1px) solid;
|
|
|
|
> .group-head > a[data-action="remove"] {
|
|
visibility: visible;
|
|
}
|
|
|
|
> .dynamic-logic-edit-item-row a[data-action="remove"] {
|
|
visibility: visible;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
div.group-head {
|
|
line-height: var(--input-height-base);
|
|
|
|
a[data-action="remove"] {
|
|
margin-right: var(--5px);
|
|
position: relative;
|
|
top: var(--minus-4px);
|
|
}
|
|
}
|
|
|
|
.dynamic-logic-edit-item-row {
|
|
> div:first-child,
|
|
> div:last-child {
|
|
padding-top: var(--7px);
|
|
}
|
|
|
|
a[data-action="remove"] {
|
|
margin-right: var(--5px);
|
|
margin-top: var(--1px);
|
|
}
|
|
}
|
|
|
|
.not-operator,
|
|
.group-operator {
|
|
color: var(--gray-soft);
|
|
}
|
|
|
|
.group-operator:last-child {
|
|
display: none;
|
|
}
|
|
|
|
.group-bottom[data-level="0"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.group-bottom {
|
|
margin-left: var(--30px);
|
|
}
|
|
}
|
|
|
|
.dynamic-logic-options {
|
|
a.remove-option-list,
|
|
a.add-option-list {
|
|
line-height: var(--input-height-base);
|
|
}
|
|
.option-list-item-header {
|
|
margin-top: var(--minus-10px);
|
|
}
|
|
|
|
.dynamic-logic-options-list-container {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.field > a[data-action="copyToClipboard"] {
|
|
margin-left: var(--6px);
|
|
}
|
|
|
|
.list-container-panel > div {
|
|
background-color: @panel-bg;
|
|
border-radius: var(--panel-border-radius);
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
|
|
> .list-group {
|
|
> .list-group-item {
|
|
border-left-width: 0;
|
|
border-right-width: 0;
|
|
border-top-width: 0;
|
|
|
|
&:last-child {
|
|
border-bottom-width: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
> table:first-child,
|
|
> .list-group:first-child,
|
|
> .list-group:first-child > .list-group-item:first-child {
|
|
border-top-left-radius: var(--panel-border-radius);
|
|
border-top-right-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
> table,
|
|
> .list-group,
|
|
> .list-group:last-child > .list-group-item:last-child,
|
|
> .show-more > a {
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
> .show-more > a {
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
|
|
.list-group-panel {
|
|
background-color: @panel-bg;
|
|
&:not(.no-side-margin) {
|
|
border-radius: var(--panel-border-radius);
|
|
}
|
|
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
|
|
> .list-group-item {
|
|
border-left: 0;
|
|
border-right: 0;
|
|
|
|
&:first-child {
|
|
border-top: 0;
|
|
&:not(.no-side-margin) {
|
|
border-top-left-radius: var(--panel-border-radius);
|
|
border-top-right-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
border-bottom: 0;
|
|
&:not(.no-side-margin) {
|
|
border-bottom-left-radius: var(--panel-border-radius);
|
|
border-bottom-right-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.field .array-control-container {
|
|
position: relative;
|
|
}
|
|
|
|
table.table-admin-panel {
|
|
table-layout: fixed;
|
|
border-collapse: separate;
|
|
|
|
color: var(--text-gray-color);
|
|
|
|
border: var(--panel-border-width) solid var(--panel-default-border);
|
|
|
|
tr:first-child td {
|
|
border-top: var(--panel-border-width);
|
|
}
|
|
|
|
tr > td:first-child {
|
|
width: var(--232px);
|
|
|
|
> div {
|
|
position: relative;
|
|
|
|
> .icon {
|
|
position: absolute;
|
|
color: var(--text-muted-color);
|
|
}
|
|
> a {
|
|
padding-left: var(--28px);
|
|
position: static;
|
|
display: inline-block;
|
|
}
|
|
}
|
|
}
|
|
|
|
td {
|
|
overflow-wrap: break-word;
|
|
word-wrap: break-word;
|
|
}
|
|
}
|
|
|
|
.admin-tables-container > div {
|
|
margin-bottom: var(--20px);
|
|
.table-admin-panel {
|
|
margin-bottom: 0;
|
|
}
|
|
> h4 {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
|
|
.admin-content {
|
|
.notifications-panel-container > .panel {
|
|
overflow: hidden;
|
|
|
|
.list-group-item:first-child {
|
|
border-top: 0;
|
|
}
|
|
.list-group-item:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.table-admin-panel,
|
|
iframe {
|
|
border-radius: var(--panel-border-radius);
|
|
}
|
|
}
|
|
|
|
.list-nested-categories {
|
|
margin-bottom: var(--padding-base-horizontal);
|
|
.category-item {
|
|
padding: var(--padding-base-horizontal) var(--padding-base-horizontal) var(--padding-base-horizontal) 0;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
user-select: none;
|
|
|
|
&.category-item-move-up {
|
|
padding-top: var(--7px);
|
|
padding-bottom: var(--7px);
|
|
}
|
|
|
|
.folder-icon {
|
|
margin-right: var(--3px);
|
|
left: var(--1px);
|
|
position: relative;
|
|
}
|
|
|
|
a {
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: none;
|
|
|
|
.category-item-name {
|
|
text-decoration: underline;
|
|
color: @gray-soft;
|
|
}
|
|
}
|
|
|
|
user-select: none;
|
|
|
|
.category-item-name {
|
|
//user-select: text;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.categories-container {
|
|
> .list > .list-group-tree > li {
|
|
padding-left: 0;
|
|
}
|
|
|
|
a[data-role="expandButtonContainer"] {
|
|
display: inline-block;
|
|
width: var(--18px);
|
|
float: right;
|
|
margin-right: var(--18px);
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.left-container > .list-group-side > .list-group-item,
|
|
.categories-container div.root-item,
|
|
.categories-container .list-group-tree > .list-group-item > .cell {
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
user-select: none;
|
|
}
|
|
|
|
.left-container + .list-container > .list[data-scope="Email"] {
|
|
td.cell[data-name="subject"] {
|
|
user-select: none;
|
|
}
|
|
}
|
|
|
|
.left-container {
|
|
user-select: none;
|
|
}
|
|
|
|
.admin-search-container {
|
|
margin-bottom: var(--20px);
|
|
}
|
|
|
|
.admin-panel-iframe-container {
|
|
//border: var(--panel-border-width) solid var(--panel-default-border);
|
|
//border-radius: var(--panel-border-radius);
|
|
|
|
> h4 {
|
|
padding: var(--padding-base-vertical) var(--padding-base-horizontal);
|
|
padding-bottom: var(--7px);
|
|
margin-bottom: 0;
|
|
margin-top: 0;
|
|
}
|
|
|
|
> div {
|
|
margin-bottom: var(--10px);
|
|
}
|
|
|
|
> div > .section {
|
|
padding-left: var(--padding-base-horizontal);
|
|
padding-right: var(--padding-base-horizontal);
|
|
padding-top: var(--10px);
|
|
padding-bottom: var(--10px);
|
|
border-bottom: var(--1px) solid @panel-default-border;
|
|
|
|
> p:last-child {
|
|
padding-bottom: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
> div > .section.extension > p:first-child {
|
|
font-size: var(--16px);
|
|
}
|
|
|
|
> div > .section.extension > p:last-child {
|
|
> .btn {
|
|
margin-top: var(--4px);
|
|
}
|
|
.price {
|
|
margin-top: calc(var(--3px) * -1);
|
|
font-size: var(--16px);
|
|
}
|
|
> a.text-danger {
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
height: 100%;
|
|
}
|
|
|
|
.sections-container {
|
|
> .section {
|
|
margin-bottom: var(--30px);
|
|
> h5 {
|
|
margin-top: 0;
|
|
}
|
|
}
|
|
> .section:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
.array-add-list-group > li {
|
|
input[type="checkbox"] {
|
|
margin-right: var(--12px);
|
|
position: relative;
|
|
top: var(--8px);
|
|
float: left;
|
|
}
|
|
|
|
vertical-align: middle;
|
|
line-height: var(--32px);
|
|
}
|
|
|
|
.search-container {
|
|
margin-bottom: var(--padding-base-vertical);
|
|
}
|
|
|
|
.search-row {
|
|
.input-group button.search {
|
|
margin-left: var(--minus-2px);
|
|
}
|
|
|
|
ul.filter-list {
|
|
right: var(--54px);
|
|
|
|
li.search-hidden {
|
|
height: 0;
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
input.field-filter-quick-search-input {
|
|
border-left: 0;
|
|
border-right: 0;
|
|
padding-left: var(--20px);
|
|
padding-right: var(--20px);
|
|
}
|
|
}
|
|
|
|
.advanced-filters {
|
|
.filter {
|
|
.control-label {
|
|
font-size: var(--font-size-small);
|
|
}
|
|
}
|
|
}
|
|
|
|
.advanced-filters-apply-container {
|
|
margin-bottom: var(--12px);
|
|
}
|
|
|
|
@media screen and (min-width: @screen-sm-min) {
|
|
.search-container .view-mode-switcher-buttons-group {
|
|
float: right;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
#notifications-panel {
|
|
position: fixed;
|
|
width: 100%;
|
|
top: 0;
|
|
right: 0;
|
|
left: 0;
|
|
margin-right: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
#global-search-panel,
|
|
#last-viewed-panel {
|
|
position: fixed;
|
|
width: 100%;
|
|
top: 0;
|
|
right: 0;
|
|
left: 0;
|
|
margin-right: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
#global-search-panel,
|
|
#last-viewed-panel {
|
|
> .panel {
|
|
.panel-heading {
|
|
.close-link {
|
|
display: inline;
|
|
}
|
|
}
|
|
.panel-body {
|
|
max-height: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
#notifications-panel {
|
|
> .panel {
|
|
.panel-heading {
|
|
.close-link {
|
|
display: inline;
|
|
}
|
|
}
|
|
.panel-body {
|
|
max-height: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
input.global-search-input {
|
|
width: 100%;
|
|
}
|
|
|
|
.search-row .view-mode-switcher-buttons-group {
|
|
float: right;
|
|
}
|
|
|
|
.search-row {
|
|
.btn.btn-icon-x-wide {
|
|
width: var(--54px);
|
|
}
|
|
}
|
|
|
|
.categories-container > .list {
|
|
margin: var(--panel-padding) 0;
|
|
}
|
|
|
|
.list > .table {
|
|
.dropdown-menu {
|
|
position: relative !important;
|
|
}
|
|
.pull-right.open > .btn {
|
|
float: right;
|
|
}
|
|
}
|
|
|
|
.list-categories-column + .list-main-column {
|
|
.list-container > .list {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
}
|
|
}
|
|
|
|
.list-main-column {
|
|
> .nested-categories-container + .list-container {
|
|
> .list {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
border-left: 0;
|
|
border-right: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.modal-body {
|
|
.categories-container + .list-container {
|
|
.list {
|
|
margin-left: calc(0rem - var(--modal-inner-padding));
|
|
margin-right: calc(0rem - var(--modal-inner-padding));
|
|
}
|
|
}
|
|
}
|
|
|
|
.left-container + .list-container {
|
|
.list {
|
|
margin-left: calc(var(--container-padding) * -1);
|
|
margin-right: calc(var(--container-padding) * -1);
|
|
}
|
|
}
|
|
|
|
.calendar-container {
|
|
.button-container > div:first-child{
|
|
margin-bottom: var(--10px);
|
|
}
|
|
.date-title {
|
|
margin-bottom: var(--10px);
|
|
margin-top: var(--6px);
|
|
h4 {
|
|
margin-top: 0;
|
|
font-size: var(--15px);
|
|
}
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
#nav-menu-dropdown {
|
|
width: var(--39px);
|
|
text-align: center;
|
|
}
|
|
|
|
.folders-container > .list-group {
|
|
@supports (display: grid) {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fill, minmax(var(--150px), 1fr));
|
|
|
|
> li {
|
|
padding-right: var(--10px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.page-header {
|
|
margin: var(--10px) 0;
|
|
}
|
|
}
|
|
|
|
a.field-info > span.fa-info-circle {
|
|
font-size: var(--12px);
|
|
position: relative;
|
|
top: calc(var(--1px) * -1);
|
|
}
|
|
|
|
.btn:not(.btn-icon) > .far:first-child:has(+ span),
|
|
.btn:not(.btn-icon) > .fas:first-child:has(+ span) {
|
|
padding-right: var(--5px);
|
|
|
|
&.fas,
|
|
&.far {
|
|
&:not(.fa-sm) {
|
|
line-height: var(--21px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.transform-flip,
|
|
.transform-flip-x {
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
.transform-flip-y {
|
|
transform: scaleY(-1);
|
|
}
|
|
|
|
.transform-rotate-90 {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.transform-rotate-180 {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.transform-rotate-270 {
|
|
transform: rotate(270deg);
|
|
}
|
|
|
|
a.link-gray {
|
|
&,
|
|
&:active {
|
|
color: @gray-soft;
|
|
}
|
|
&:hover,
|
|
&:focus {
|
|
color: @gray;
|
|
}
|
|
}
|
|
|
|
#layout {
|
|
.cell .left {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
float: left;
|
|
}
|
|
.cell .right {
|
|
float: right;
|
|
|
|
.fa-times, .fa-minus {
|
|
position: relative;
|
|
top: var(--1px);
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
#layouts-menu {
|
|
.panel > .panel-heading {
|
|
padding-top: var(--6px);
|
|
padding-bottom: var(--6px);
|
|
}
|
|
}
|
|
|
|
.selectize-control.as-list .item {
|
|
display: block;
|
|
}
|
|
|
|
.dd-backdrop {
|
|
opacity: .9;
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
z-index: 1040;
|
|
background-color: @body-bg;
|
|
text-align: center;
|
|
padding-top: calc(var(--8px) * 10);
|
|
font-size: 200%;
|
|
|
|
.fas,
|
|
.far {
|
|
font-size: 100%;
|
|
}
|
|
}
|
|
|
|
pre {
|
|
background-color: var(--code-bg);
|
|
border-color: var(--code-border-color);
|
|
color: var(--code-color);
|
|
}
|
|
|
|
.label-default {
|
|
background-color: var(--label-default-bg);
|
|
}
|
|
|
|
a.close {
|
|
color: var(--text-muted-color);
|
|
opacity: 1;
|
|
|
|
&:hover,
|
|
&:hover:active {
|
|
opacity: 1;
|
|
color: var(--gray-soft);
|
|
}
|
|
}
|
|
|
|
.wysiwyg-iframe-container.fallback {
|
|
border-radius: var(--border-radius);
|
|
overflow: hidden;
|
|
background-color: var(--white-color);
|
|
}
|
|
|
|
@import "elements/scrollbar.less";
|
|
|
|
body:has(.modal-backdrop) {
|
|
.collapsed-modal-bar {
|
|
// Otherwise, it will be overlapped.
|
|
z-index: 2000;
|
|
}
|
|
}
|
|
|
|
.collapsed-modal-bar {
|
|
position: fixed;
|
|
bottom: 0;
|
|
display: grid;
|
|
grid-gap: var(--10px);
|
|
width: calc(100% - var(--100px));
|
|
justify-content: end;
|
|
|
|
@media screen and (max-width: @screen-xs-max) {
|
|
width: 100%;
|
|
}
|
|
|
|
> .collapsed-modal {
|
|
grid-row: 1;
|
|
width: var(--200px);
|
|
overflow: hidden;
|
|
z-index: 1009;
|
|
height: var(--26px);
|
|
padding: var(--3px) var(--8px);
|
|
border-top-left-radius: var(--border-radius);
|
|
border-top-right-radius: var(--border-radius);
|
|
|
|
background-color: var(--collapsed-modal-bg);
|
|
|
|
.title-container {
|
|
width: calc(100% - var(--18px));
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
float: left;
|
|
height: var(--20px);
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.close-container {
|
|
float: right;
|
|
}
|
|
|
|
a, a:hover, a:active {
|
|
color: var(--collapsed-modal-text-color);
|
|
text-decoration: none;
|
|
}
|
|
|
|
user-select: none;
|
|
}
|
|
}
|
|
|
|
.draggable-helper {
|
|
border-radius: var(--border-radius);
|
|
background-color: var(--state-info-bg);
|
|
border: var(--1px) solid var(--state-info-bg-10);
|
|
color: var(--state-info-text);
|
|
padding: var(--padding-base-vertical) var(--20px);
|
|
font-weight: 600;
|
|
opacity: 1;
|
|
position: absolute;
|
|
z-index: 10002;
|
|
|
|
&.draggable-helper-transparent {
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
|
|
.reminders-container {
|
|
> .reminder {
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
|
|
> .input-group-item:first-child {
|
|
width: 40%;
|
|
}
|
|
|
|
> .input-group-btn {
|
|
width: 35px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.input-group-link-parent {
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
|
|
> .input-group-item:first-child {
|
|
width: 34%;
|
|
}
|
|
|
|
> .input-group-btn {
|
|
width: calc(var(--35px) * 2);
|
|
}
|
|
}
|
|
|
|
.phone-number-block-container {
|
|
.input-group.phone-number-block {
|
|
table-layout: fixed;
|
|
width: 100%;
|
|
|
|
> .input-group-item:first-child {
|
|
width: 24%;
|
|
}
|
|
|
|
> .input-group-btn {
|
|
.btn.phone-property.active {
|
|
z-index: unset;
|
|
}
|
|
|
|
width: calc(var(--35px) * 2 + var(--1px));
|
|
}
|
|
}
|
|
|
|
&.many {
|
|
.input-group.phone-number-block {
|
|
> .input-group-btn {
|
|
width: calc(var(--35px) * 4 + var(--1px));
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.email-address-block.only-primary,
|
|
.phone-number-block.only-primary {
|
|
input.form-control {
|
|
border-top-left-radius: var(--border-radius);
|
|
border-top-right-radius: var(--border-radius);
|
|
border-bottom-left-radius: var(--border-radius);
|
|
border-bottom-right-radius: var(--border-radius);
|
|
}
|
|
|
|
display: block;
|
|
}
|
|
|
|
.input-group-currency {
|
|
display: flex;
|
|
|
|
> .input-group-item:first-child {
|
|
flex-grow: 1;
|
|
display: block;
|
|
}
|
|
|
|
> .input-group-item:last-child {
|
|
flex-grow: 1;
|
|
display: block;
|
|
min-width: var(--70px);
|
|
max-width: var(--80px);
|
|
}
|
|
|
|
> .input-group-addon:last-child {
|
|
flex-grow: 1;
|
|
display: block;
|
|
min-width: fit-content;
|
|
max-width: fit-content;
|
|
}
|
|
}
|
|
|
|
body > .autocomplete-suggestions.text-search-suggestions {
|
|
> .autocomplete-suggestion {
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
|
|
> span {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
width: calc(100% - var(--20px));
|
|
height: var(--24px);
|
|
padding-top: var(--4px);
|
|
padding-bottom: var(--4px);
|
|
}
|
|
|
|
> a {
|
|
margin-top: var(--3px);
|
|
}
|
|
}
|
|
}
|
|
|
|
.popover {
|
|
max-width: var(--300px);
|
|
|
|
.popover-title {
|
|
line-height: 1.5;
|
|
user-select: none;
|
|
}
|
|
|
|
&.popover-list-view {
|
|
width: var(--220px);
|
|
}
|
|
|
|
&:has(.for-list-view) {
|
|
width: var(--220px);
|
|
}
|
|
|
|
.popover-content {
|
|
&:has(> .list > table) {
|
|
padding: 0;
|
|
}
|
|
|
|
> .list:has(> table) {
|
|
margin-left: var(--minus-1px);
|
|
margin-right: var(--minus-1px);
|
|
}
|
|
|
|
> .list > table {
|
|
> tbody {
|
|
> tr {
|
|
> td:first-child {
|
|
padding-left: var(--14px);
|
|
}
|
|
|
|
> td:last-child {
|
|
padding-right: var(--14px);
|
|
border-bottom: 0;
|
|
}
|
|
|
|
> td {
|
|
border-left: 0;
|
|
border-right: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
background-color: unset;
|
|
}
|
|
}
|
|
}
|
|
|
|
.input-phone-number-item > .iti {
|
|
//top: 3px;
|
|
position: unset;
|
|
display: block;
|
|
|
|
margin-left: var(--minus-1px);
|
|
width: calc(100% + var(--1px));
|
|
|
|
.iti__flag-container {
|
|
user-select: none;
|
|
|
|
&,
|
|
&:hover {
|
|
.iti__selected-flag {
|
|
background-color: transparent;
|
|
|
|
&[aria-expanded="true"] {
|
|
background-color: var(--dropdown-link-hover-bg);
|
|
}
|
|
}
|
|
}
|
|
|
|
.iti__country-list {
|
|
margin-top: var(--1px); // To match positioning of other dropdowns.
|
|
z-index: 5;
|
|
max-height: calc(var(--300px) + var(--18px));
|
|
background-color: var(--dropdown-bg);
|
|
border: var(--dropdown-border) solid var(--dropdown-border-width);
|
|
border-radius: var(--dropdown-border-radius);
|
|
box-shadow: var(--dropdown-box-shadow);
|
|
|
|
.iti__dial-code {
|
|
color: var(--text-muted-color);
|
|
}
|
|
|
|
.iti__country {
|
|
color: var(--dropdown-link-color);
|
|
padding: var(--4px) var(--10px);
|
|
|
|
&.iti__highlight {
|
|
background-color: var(--dropdown-link-hover-bg);
|
|
}
|
|
}
|
|
|
|
.iti__divider {
|
|
border-bottom-color: var(--dropdown-divider-bg);
|
|
margin-bottom: var(--5px);
|
|
}
|
|
|
|
padding: var(--5px) 0;
|
|
}
|
|
}
|
|
|
|
.iti__selected-flag {
|
|
margin-left: var(--minus-1px);
|
|
|
|
z-index: 4;
|
|
padding: 0 var(--8px) 0 var(--8px);
|
|
color: var(--gray-soft);
|
|
|
|
> .iti__arrow {
|
|
visibility: hidden;
|
|
display: none;
|
|
}
|
|
|
|
&:after {
|
|
content: " ";
|
|
color: var(--text-muted-color);
|
|
//display: inline-block;
|
|
display: none;
|
|
width: 0;
|
|
height: 0;
|
|
top: var(--15px);
|
|
right: var(--8px);
|
|
margin-left: var(--2px);
|
|
vertical-align: middle;
|
|
border-top: var(--4px) dashed;
|
|
border-right: var(--4px) solid transparent;
|
|
border-left: var(--4px) solid transparent;
|
|
position: absolute;
|
|
}
|
|
}
|
|
|
|
> input {
|
|
border-top-right-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
}
|
|
|
|
.colorpicker {
|
|
.colorpicker-saturation {
|
|
width: var(--200px);
|
|
height: var(--200px);
|
|
}
|
|
|
|
.colorpicker-hue,
|
|
.colorpicker-alpha {
|
|
height: var(--200px);
|
|
}
|
|
|
|
.colorpicker-alpha {
|
|
background-size: 100% 100%;
|
|
}
|
|
|
|
.colorpicker-color {
|
|
width: var(--200px);
|
|
}
|
|
}
|
|
|
|
.colorpicker-element {
|
|
.input-group-addon i {
|
|
display: block;
|
|
border-radius: var(--border-radius-small);
|
|
}
|
|
}
|
|
|
|
.panel > .panel-body .list-container[data-role="pinned"] > .list {
|
|
.list-group {
|
|
> .list-group-item {
|
|
&:not(.active) {
|
|
background-color: var(--warning-bg);
|
|
}
|
|
|
|
&:first-child {
|
|
border-top-width: var(--1px);
|
|
border-top-color: var(--default-border-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.avatar-field-color {
|
|
margin-top: var(--3px);
|
|
}
|
|
|
|
.ace-tm {
|
|
font-variant-ligatures: none;
|
|
|
|
.ace_content {
|
|
font-variant-ligatures: none;
|
|
}
|
|
}
|
|
|
|
.formula-edit-container {
|
|
&:has(> :last-child:nth-child(2)) {
|
|
clear: both;
|
|
|
|
> div:first-child {
|
|
float: left;
|
|
width: calc(100% - var(--70px));
|
|
}
|
|
|
|
> div:last-child {
|
|
float: right;
|
|
width: var(--70px);
|
|
}
|
|
}
|
|
}
|
|
|
|
[data-role="password-input-container"] {
|
|
position: relative;
|
|
|
|
input {
|
|
padding-right: var(--32px);
|
|
}
|
|
|
|
a[data-action="toggleShowPassword"] {
|
|
position: absolute;
|
|
right: var(--8px);
|
|
top: var(--8px);
|
|
user-select: none;
|
|
width: var(--22px);
|
|
display: inline-block;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
@import "misc/kanban.less";
|
|
@import "misc/wysiwyg.less";
|
|
|
|
@import "elements/placement.less";
|
|
@import "elements/site.less";
|
|
@import "elements/modal.less";
|
|
@import "elements/buttons.less";
|
|
@import "elements/popup-notification.less";
|
|
@import "elements/grid.less";
|
|
@import "elements/animation.less";
|
|
|
|
.compact-form {
|
|
--input-height-base: var(--input-height-small);
|
|
--line-height-computed: var(--line-height-small);
|
|
--line-height-base: var(--line-height-small);
|
|
--font-size-base: var(--font-size-small);
|
|
--padding-base-vertical: var(--padding-small-vertical);
|
|
--padding-base-horizontal: var(--padding-small-horizontal);
|
|
|
|
--icon-size-base: var(--icon-size-small);
|
|
--icon-line-height-base: var(--icon-line-height-small);
|
|
|
|
--btn-icon-width: var(--btn-icon-width-small);
|
|
}
|