Page MenuHomePhorge
Differential D2179 Diff 6091 plugins/libkolab/skins/elastic/libkolab.less

Changeset View

Standalone View

View Options

plugins/libkolab/skins/elastic/libkolab.less

Show All 18 Lines
* *
* You should have received a copy of the GNU Affero General Public License * 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/>. * along with this program. If not, see <http://www.gnu.org/licenses/>.
*/ */
@skin: "elastic"; @skin: "elastic";
@skin-path: "../../../../skins/@{skin}"; @skin-path: "../../../../skins/@{skin}";
// Disable dark mode support for compatibility with Roundcube 1.4.
// The variable has been added to variables.less in Roundcube 1.5.
@dark-mode-enabled: false;
@import (reference) "@{skin-path}/styles/variables"; @import (reference) "@{skin-path}/styles/variables";
@import (reference) "@{skin-path}/styles/mixins"; @import (reference) "@{skin-path}/styles/mixins";
/*** Common folders list extensions ***/ /*** Common folders list extensions ***/
.listing { .listing {
// Fix focus indicator, because we add div element in the list record // Fix focus indicator, because we add div element in the list record
@media screen and (min-width: @screen-width-large) { @media screen and (min-width: @screen-width-large) {
li > div > a { li > div > a {
border-left: 2px solid transparent; border-left: 2px solid transparent;
} }
li > div > a:focus { li > div > a:focus {
border-left: 2px solid @color-list-focus-indicator; border-left: 2px solid @color-list-focus-indicator;
outline: 0; outline: 0;
} }
} }
li { li {
& > div { & > div {
display: flex; display: flex;
& > a:first-child { & > a:first-child {
.overflow-ellipsis; .overflow-ellipsis();
position: relative; position: relative;
flex-grow: 1; flex-grow: 1;
& + input { & + input {
position: initial; position: initial;
} }
} }
▲ Show 20 Lines • Show All 91 Lines • ▼ Show 20 Lines li {
& > div.readonly a:first-child, & > div.readonly a:first-child,
&.readonly:not(.virtual) > div a:first-child { &.readonly:not(.virtual) > div a:first-child {
&:after { &:after {
&:extend(.font-icon-class); &:extend(.font-icon-class);
content: @fa-var-lock; content: @fa-var-lock;
position: absolute; position: absolute;
left: 2.25rem; left: 2.25rem;
top: @listing-line-height / 2; top: (@listing-line-height / 2);
font-size: .9em !important; font-size: .9em !important;
width: .9em; width: .9em;
line-height: 1; line-height: 1;
height: 1em !important; height: 1em !important;
background-color: #fff; background-color: #fff;
border-radius: 50% 50% 0 0; border-radius: 50% 50% 0 0;
color: @color-font; color: @color-font;
opacity: .9; opacity: .9;
html.touch & { html.touch & {
top: @listing-touch-line-height / 2; top: (@listing-touch-line-height / 2);
left: 2.7rem; left: 2.7rem;
} }
} }
} }
& > div.other.user > .listname, & > div.other.user > .listname,
&.other.user > div a:first-child { &.other.user > div a:first-child {
&:before { &:before {
Show All 36 Lines.listing {
} }
li .count { li .count {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
min-width: 2em; min-width: 2em;
line-height: 1.4rem; line-height: 1.4rem;
margin: (@listing-line-height - 1.4 * @page-font-size)/2; margin: ((@listing-line-height - 1.4 * @page-font-size) / 2);
padding: 0 .3em; padding: 0 .3em;
border-radius: .4em; border-radius: .4em;
background: @color-list-secondary; background: @color-list-secondary;
color: #fff; color: #fff;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
html.touch & { html.touch & {
line-height: 2rem; line-height: 2rem;
margin: (@listing-touch-line-height - 2 * @page-font-size)/2; margin: ((@listing-touch-line-height - 2 * @page-font-size) / 2);
} }
} }
} }
@treelist-readonly-icon-margin: 1.7em; @treelist-readonly-icon-margin: 1.7em;
.treelist { .treelist {
ul { ul {
li { li {
▲ Show 20 Lines • Show All 183 Lines • ▼ Show 20 Lines.linkslist {
li.link { li.link {
padding: 0; padding: 0;
&.message.eml:before { &.message.eml:before {
content: @fa-var-envelope; content: @fa-var-envelope;
} }
a.messagelink { a.messagelink {
.overflow-ellipsis; .overflow-ellipsis();
} }
a.delete .inner { a.delete .inner {
display: none; display: none;
} }
} }
} }
▲ Show 20 Lines • Show All 143 Lines • ▼ Show 20 Lines @media screen and (max-width: @screen-width-small) {
a:before { a:before {
font-size: 1.75rem; font-size: 1.75rem;
} }
} }
} }
} }
// Use icons-only on taskmenu with small screen height // Use icons-only on taskmenu with small screen height
@media screen and (max-height: 640px) and (min-width: (@screen-width-small + 1px)) { @media screen and (max-height: 750px) and (min-width: (@screen-width-small + 1px)) {
#layout-menu .popover-header img, #layout-menu .popover-header img,
#layout-menu { #layout-menu {
width: @layout-menu-width-sm; width: @layout-menu-width-sm;
} }
#taskmenu { #taskmenu {
a { a {
height: @layout-menu-width-sm; height: @layout-menu-width-sm;
width: 100%; width: @layout-menu-width-sm;
font-size: 1.2rem !important; font-size: 1.2rem !important;
} }
.special-buttons { .special-buttons {
width: @layout-menu-width-sm; width: @layout-menu-width-sm;
} }
span.inner { span.inner {
display: none; display: none;
} }
} }
} }
@import "include/calendar"; @import "include/calendar";
@import "include/kolab_activesync"; @import "include/kolab_activesync";
@import "include/kolab_delegation"; @import "include/kolab_delegation";
@import "include/kolab_files"; @import "include/kolab_files";
@import "include/kolab_notes"; @import "include/kolab_notes";
@import "include/kolab_tags"; @import "include/kolab_tags";
@import "include/libcalendaring"; @import "include/libcalendaring";
@import "include/tasklist"; @import "include/tasklist";
& when (@dark-mode-enabled = true) {
@import "include/darkmode";
}