init commit
This commit is contained in:
BIN
plugins/xskin/assets/images/MultiBox_logo-512px_mail-b.png
Normal file
BIN
plugins/xskin/assets/images/MultiBox_logo-512px_mail-b.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 185 KiB |
BIN
plugins/xskin/assets/images/loader.gif
Normal file
BIN
plugins/xskin/assets/images/loader.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.7 KiB |
57
plugins/xskin/assets/images/loader.svg
Normal file
57
plugins/xskin/assets/images/loader.svg
Normal file
@ -0,0 +1,57 @@
|
||||
<svg class="lds-spin" width="16px" height="16px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" style="background: none;"><g transform="translate(86,50)">
|
||||
<g transform="rotate(0)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="1" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.875s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.875s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(75.45584412271572,75.45584412271572)">
|
||||
<g transform="rotate(45)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.875" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.75s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.75s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(50,86)">
|
||||
<g transform="rotate(90)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.75" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.625s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.625s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(24.54415587728429,75.45584412271572)">
|
||||
<g transform="rotate(135)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.625" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.5s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.5s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(14,50.00000000000001)">
|
||||
<g transform="rotate(180)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.5" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.375s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.375s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(24.544155877284282,24.54415587728429)">
|
||||
<g transform="rotate(225)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.375" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.25s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.25s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(49.99999999999999,14)">
|
||||
<g transform="rotate(270)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.25" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="-0.125s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.125s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g><g transform="translate(75.4558441227157,24.544155877284282)">
|
||||
<g transform="rotate(315)">
|
||||
<circle cx="0" cy="0" r="10" fill="#333333" fill-opacity="0.125" transform="scale(1 1)">
|
||||
<animateTransform attributeName="transform" type="scale" begin="0s" values="1 1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
||||
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="0s"></animate>
|
||||
</circle>
|
||||
</g>
|
||||
</g></svg>
|
After Width: | Height: | Size: 3.9 KiB |
BIN
plugins/xskin/assets/images/quota.png
Normal file
BIN
plugins/xskin/assets/images/quota.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.8 KiB |
BIN
plugins/xskin/assets/images/watermark.png
Normal file
BIN
plugins/xskin/assets/images/watermark.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.3 KiB |
7
plugins/xskin/assets/scripts/hammer.min.js
vendored
Normal file
7
plugins/xskin/assets/scripts/hammer.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
33
plugins/xskin/assets/scripts/jquery.hammer.js
Normal file
33
plugins/xskin/assets/scripts/jquery.hammer.js
Normal file
@ -0,0 +1,33 @@
|
||||
(function(factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(['jquery', 'hammerjs'], factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
factory(require('jquery'), require('hammerjs'));
|
||||
} else {
|
||||
factory(jQuery, Hammer);
|
||||
}
|
||||
}(function($, Hammer) {
|
||||
function hammerify(el, options) {
|
||||
var $el = $(el);
|
||||
if(!$el.data("hammer")) {
|
||||
$el.data("hammer", new Hammer($el[0], options));
|
||||
}
|
||||
}
|
||||
|
||||
$.fn.hammer = function(options) {
|
||||
return this.each(function() {
|
||||
hammerify(this, options);
|
||||
});
|
||||
};
|
||||
|
||||
// extend the emit method to also trigger jQuery events
|
||||
Hammer.Manager.prototype.emit = (function(originalEmit) {
|
||||
return function(type, data) {
|
||||
originalEmit.call(this, type, data);
|
||||
$(this.element).trigger({
|
||||
type: type,
|
||||
gesture: data
|
||||
});
|
||||
};
|
||||
})(Hammer.Manager.prototype.emit);
|
||||
}));
|
1
plugins/xskin/assets/scripts/larry_desktop.min.js
vendored
Normal file
1
plugins/xskin/assets/scripts/larry_desktop.min.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
"use strict";$(document).ready(function(){xdesktop.afterReady()});$(window).resize(function(){xdesktop.windowResize()});var xdesktop=new function(){var _this=this;this.afterReady=function(){setTimeout(function(){xdesktop.windowResize()},0);if($(".compact-message-list #listoptions fieldset").length){$("#listoptions fieldset:first").remove()}if($("body.skin-icloud.login-page").length&&!$("body.xbackground-login-image").length){var iconDiv=$("<div/>").addClass("icl-icons");var icount=0;for(var i=1;i<=13;i++){iconDiv.append($("<img/>").addClass("icl-icon-"+i).attr("src","skins/icloud/assets/images/icon-"+i+".png").attr("alt","").on("load",function(){icount++;if(icount>=13){setTimeout(function(){iconDiv.fadeIn(800)},500)}}))}$("body").append(iconDiv)}_this.enableIdentSwitch()};this.windowResize=function(){var toolbar=$(".toolbar");if(toolbar.length){var width=toolbar.width()+5;var element=$("#searchfilter");if(element.length){element.css("visibility",element.offset().left<width?"hidden":"visible")}element=$("#quicksearchbar");if(element.length){element.css("visibility",element.offset().left<width?"hidden":"visible")}}};this.enableIdentSwitch=function(){if(!rcmail.env["rcp_skin"]){return}var select=$("#plugin-ident_switch-account");if(!select.length||typeof plugin_switchIdent_addCbLarry!=="function"){return}if(plugin_switchIdent_addCbLarry(select)){select.show()}}};
|
1
plugins/xskin/assets/scripts/larry_mobile.min.js
vendored
Normal file
1
plugins/xskin/assets/scripts/larry_mobile.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
plugins/xskin/assets/scripts/xskin.min.js
vendored
Normal file
1
plugins/xskin/assets/scripts/xskin.min.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
"use strict";$(document).ready(function(){xskin.afterReady()});var xskin=new function(){var _this=this;this.afterReady=function(){_this.elastic=$("body.xelastic").length;if(!_this.elastic){$("#xshortcut-skins select").on("mouseup",function(event){event.stopPropagation()})}if(!rcmail.env.rcp_skin){return}_this.addMailboxClasses();_this.fixIdentSwitch();if($("body.xmaterial-design").length){xskin.enableMaterialDesign()}if(!_this.elastic){var iconButton=$("a.iconbutton");if(iconButton.length){iconButton.html("")}if($("body.skin-icloud #login-form").length){var loginPassword=$("#rcmloginpwd");loginPassword.after($("<button/>").attr("id","custom-login-submit").attr("type","submit"));$("#rcmloginuser").attr("placeholder",$("label[for=rcmloginuser]").text());loginPassword.attr("placeholder",$("label[for=rcmloginpwd]").text())}if(rcmail.env.xskin=="droid"){xskin.enableMaterialDesign()}else{xskin.enableSwitchboxes()}if($("#printmessageframe").length){$("body").addClass("print-message")}}if($("body.login-page").length&&!$("#logo").length){var title=$("<div>").attr("id","login-title").text(rcmail.gettext("login"));if(_this.elastic){title.insertBefore("#login-form")}else{title.prependTo("#login-form .box-inner")}}};this.applySetting=function(element,key,container,value){element=$(element);if(value!==undefined){element.val(value)}else{if(element.is(":checkbox")){value=element.is(":checked")?"yes":"no"}else{value=element.val()}}$(container).alterClass(key+"-*",key+"-"+value);$(container,window.parent.document).alterClass(key+"-*",key+"-"+value);$(".xsave-hint").fadeIn()};this.updateIFrameClasses=function(){$.each($("html").attr("class").split(/\s+/),function(index,item){if(item.indexOf("x")==0){$("html").removeClass(item)}});$.each($("body").attr("class").split(/\s+/),function(index,item){if(item.indexOf("x")==0){$("body").removeClass(item)}});$.each($("html",window.parent.document).attr("class").split(/\s+/),function(index,item){if(item.indexOf("x")==0){$("html").addClass(item)}});$.each($("body",window.parent.document).attr("class").split(/\s+/),function(index,item){if(item.indexOf("x")==0){$("body").addClass(item)}})};this.quickSkinChange=function(){var skin=$("#xshortcut-skins select").val();if(skin){location.replace("//"+location.host+location.pathname+xframework.replaceUrlParam("skin",skin))}};this.quickLanguageChange=function(){var language=$("#quick-language-change select").val();language&&(location.href=xframework.replaceUrlParam("language",language))};this.addMailboxClasses=function(){var classes=["sent","drafts","trash","archive","junk","spam"];$("#mailboxlist li.mailbox a").each(function(){var rel=$(this).attr("rel");if(rel!==undefined){rel=rel.toLowerCase();for(var i=0;i<classes.length;i++){if(rel.indexOf(classes[i])!=-1){$(this).parent("li.mailbox").addClass(classes[i])}}}})};this.disableMobileSkin=function(){var expires=new Date;expires.setFullYear(expires.getFullYear()+10);rcmail.set_cookie("rcs_disable_mobile_skin",1,expires);location.reload()};this.enableMobileSkin=function(){var expires=new Date;expires.setFullYear(expires.getFullYear()-10);rcmail.set_cookie("rcs_disable_mobile_skin","",expires);location.reload()};this.enableSwitchboxes=function(){var index=0;$("input[type='checkbox']").not(".no-switchbox").each(function(){var checkbox=$(this);var position=checkbox.css("position");var id=checkbox.attr("id");if(!id){id="switchbox-"+index;checkbox.attr("id",id);index++}var switchbox=$("<label/>").addClass("switchbox").attr("for",id).css("margin",checkbox.css("margin"));if(position=="absolute"||position=="fixed"){switchbox.css({position:position,left:checkbox.css("left"),right:checkbox.css("right"),top:checkbox.css("top"),bottom:checkbox.css("bottom"),"z-index":checkbox.css("z-index")})}switchbox.on("click",function(e){e.stopPropagation()});checkbox.addClass("switchbox-input").after(switchbox)})};this.enableMaterialDesign=function(){$(".listing td.name, .listing td.section, .listing li.listitem, #directorylist li.addressbook, "+".listing li.mailbox a, .toolbar a.button, .xmobile #taskbar > a").addClass("wave-container").on("click",function(event){var container=$(this);var size=Math.ceil(Math.max(container.outerWidth(),container.outerHeight())*2/100);var wave=$("<span/>").addClass("wave").css({height:size,width:size,left:event.offsetX+"px",top:event.offsetY+"px"});container.append(wave);setTimeout(function(){wave.remove()},600)})};this.fixIdentSwitch=function(){if(!rcmail.env["rcp_skin"]){return}var select=$("#plugin-ident_switch-account");if(!select.length||typeof plugin_switchIdent_addCbElastic!=="function"){return}if(plugin_switchIdent_addCbElastic(select)){select.show()}}};
|
223
plugins/xskin/assets/styles/_elastic_skins_commons.scss
Normal file
223
plugins/xskin/assets/styles/_elastic_skins_commons.scss
Normal file
@ -0,0 +1,223 @@
|
||||
@import "../../../xframework/assets/styles/_colors";
|
||||
|
||||
@mixin basic-styles() {
|
||||
//*:not(.flatpickr-day),
|
||||
// *:not(.fc-timegrid-now-indicator-arrow),
|
||||
// *:not(.fc-timegrid-now-indicator-line) {
|
||||
:not(.flatpickr-calendar *, .error) {
|
||||
@include border-color;
|
||||
}
|
||||
|
||||
body #layout > #layout-menu .special-buttons {
|
||||
&, a {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
.popupmenu .listing li.selected,
|
||||
.popupmenu .listing li>a:not(.disabled):hover,
|
||||
.popover .menu li a:not(.disabled):hover,
|
||||
{
|
||||
@include background-highlight-color(5, true);
|
||||
@include text-color(true);
|
||||
}
|
||||
|
||||
html.dark-mode {
|
||||
.messagelist tr:not(.flagged):not(.deleted).selected td.subject {
|
||||
a,
|
||||
span.msgicon.status {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#layout #xsidebar {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin secondary-button-styles() {
|
||||
div.tox .tox-button.tox-button--secondary, // html editor
|
||||
.mce-window .mce-foot .mce-btn,
|
||||
.btn.btn-secondary:not(.btn.btn-danger):not(.xanchor),
|
||||
.btn.btn-link {
|
||||
@include background-highlight-color(8);
|
||||
border: 1px solid;
|
||||
@include text-color(true);
|
||||
@include border-strong-color(true);
|
||||
|
||||
&:hover {
|
||||
@include background-highlight-color(12, true);
|
||||
}
|
||||
|
||||
&.ui-dialog-titlebar-close {
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mce-window .mce-foot .mce-btn button {
|
||||
@include text-color(true);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin primary-button-colors($background, $backgroundHighlight) {
|
||||
.btn.btn-primary,
|
||||
.btn.btn-success,
|
||||
div.tox .tox-dialog__footer .tox-button, // html editor
|
||||
.mce-window .mce-foot .mce-btn.mce-primary,
|
||||
.floating-action-buttons a.button {
|
||||
background-color: $background !important;
|
||||
border: 1px solid $background !important;
|
||||
color: #fff;
|
||||
|
||||
&:hover {
|
||||
background-color: $backgroundHighlight !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btn.disabled,
|
||||
.btn:disabled {
|
||||
&, &:hover {
|
||||
//border: 1px solid #777 !important;
|
||||
//background-color: #777 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mce-window .mce-foot .mce-btn.mce-primary button {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin switchbox-colors($normalColor, $highlightColor) {
|
||||
.custom-switch .custom-control-input:checked ~ .custom-control-label {
|
||||
&:before {
|
||||
background-color: $normalColor !important;
|
||||
border: 1px solid $normalColor !important;
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
background-color: $highlightColor !important;
|
||||
border: 1px solid $highlightColor !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mce-window .mce-checkbox i.mce-i-checkbox {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
|
||||
.mce-window .mce-checkbox.mce-checked i.mce-i-checkbox {
|
||||
color: $normalColor !important;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin input-colors($borderColor) {
|
||||
.custom-file-label:focus:not(.is-invalid),
|
||||
.form-control:focus:not(.is-invalid),
|
||||
.recipient-input.focus,
|
||||
.mce-tinymce.focused,
|
||||
div.tox.focused {
|
||||
border-color: $borderColor !important;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin anchor-colors($normalColor, $darkModeColor) {
|
||||
a,
|
||||
button.xanchor,
|
||||
div.tox .tox-dialog .tox-dialog__body-nav-item--active,
|
||||
input.icon-checkbox + label:before,
|
||||
input.icon-checkbox:checked + label:before {
|
||||
color: $normalColor;
|
||||
|
||||
html.dark-mode & {
|
||||
color: $darkModeColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin listing-colors($background: false, $dmBackground: false, $text: false, $dmText: false) {
|
||||
#settings-menu li.selected,
|
||||
.listing tr.selected td,
|
||||
.listing li.selected > a,
|
||||
ul.treelist li.selected > div > a,
|
||||
ul.treelist li.selected > a,
|
||||
.toolbarmenu.listing li:hover a.active {
|
||||
@if $background {
|
||||
background-color: $background;
|
||||
}
|
||||
|
||||
@if $text {
|
||||
color: $text;
|
||||
} @else {
|
||||
@include text-color;
|
||||
}
|
||||
|
||||
html.dark-mode & {
|
||||
@if $dmBackground {
|
||||
background-color: $dmBackground;
|
||||
}
|
||||
|
||||
@if $dmText {
|
||||
color: $dmText;
|
||||
} @else {
|
||||
@include text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin unread-count-colors($background, $dmBackground: false, $text: false, $dmText: false) {
|
||||
.folderlist li.mailbox .unreadcount {
|
||||
@if $background {
|
||||
background-color: $background !important;
|
||||
}
|
||||
|
||||
@if $text {
|
||||
color: $text;
|
||||
} @else {
|
||||
@include text-color;
|
||||
}
|
||||
|
||||
html.dark-mode & {
|
||||
@if $dmBackground {
|
||||
background-color: $dmBackground !important;
|
||||
}
|
||||
|
||||
@if $dmText {
|
||||
color: $dmText;
|
||||
} @else {
|
||||
@include text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin logo-background-color($background: false, $dmBackground: false) {
|
||||
#layout-menu .popover-header {
|
||||
@if $background {
|
||||
background-color: $background !important;
|
||||
}
|
||||
|
||||
html.dark-mode & {
|
||||
@if $dmBackground {
|
||||
background-color: $dmBackground !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin datepicker-colors($background: false, $dmBackground: false) {
|
||||
.ui-datepicker {
|
||||
a.ui-state-active {
|
||||
@if $background {
|
||||
background-color: $background !important;
|
||||
}
|
||||
|
||||
html.dark-mode & {
|
||||
@if $dmBackground {
|
||||
background-color: $dmBackground !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
518
plugins/xskin/assets/styles/_larry_common.scss
Normal file
518
plugins/xskin/assets/styles/_larry_common.scss
Normal file
@ -0,0 +1,518 @@
|
||||
* {
|
||||
text-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
-o-box-shadow: none !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
-moz-box-shadow: none !important;
|
||||
}
|
||||
|
||||
.ui-dialog {
|
||||
box-shadow: 1px 1px 18px #666 !important;
|
||||
}
|
||||
|
||||
*:focus { /* remove chrome border around active fields */
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
body,
|
||||
#login-form .box-inner,
|
||||
#login-form .box-bottom {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
a {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* buttons */
|
||||
|
||||
input[type="button"],
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
button,
|
||||
button.ui-button,
|
||||
a.button,
|
||||
input.button {
|
||||
|
||||
&,
|
||||
.formbuttons & {
|
||||
border: 1px solid #adadad;
|
||||
color: #212121;
|
||||
background: #fff;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus,
|
||||
.formbuttons &:hover {
|
||||
border-color: #949494;
|
||||
color: #212121;
|
||||
background: #efefef;
|
||||
}
|
||||
}
|
||||
|
||||
body:not(.skin-litecube) {
|
||||
.prevpage,
|
||||
.nextpage {
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
.buttongroup a.button {
|
||||
background: #fff !important;
|
||||
|
||||
&.selected {
|
||||
background: #aaa !important;
|
||||
}
|
||||
}
|
||||
|
||||
#look-and-feel-shortcut a.btn {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin-top: 8px;
|
||||
text-decoration: none;
|
||||
padding: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
ul.toolbarmenu li a.icon {
|
||||
padding-top: 6px !important;
|
||||
padding-bottom: 6px !important;
|
||||
}
|
||||
|
||||
#login-form input[type="text"],
|
||||
#login-form input[type="password"],
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=password],
|
||||
textarea {
|
||||
margin-bottom: 0;
|
||||
padding: 5px;
|
||||
border: 1px solid #ccc !important;
|
||||
background: #fff;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
textarea:focus,
|
||||
textarea:hover,
|
||||
input[type=text]:focus,
|
||||
input[type=text]:hover,
|
||||
input[type=password]:focus,
|
||||
input[type=password]:hover,
|
||||
select:focus,
|
||||
select:hover {
|
||||
border-color: #8f8f8f;
|
||||
}
|
||||
|
||||
.propform {
|
||||
fieldset > legend {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
input[type=email],
|
||||
select {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
&.error {
|
||||
border-color: #d30000 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
select {
|
||||
/*margin-bottom: 8px;*/
|
||||
margin-right: 4px;
|
||||
border: 1px solid #ccc;
|
||||
padding: 5px;
|
||||
background: #fff;
|
||||
border-radius: 0 !important;
|
||||
color: #333;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
select.decorated option {
|
||||
background: #fff;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border-radius: 0 !important;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
legend {
|
||||
font-weight: normal !important;
|
||||
font-style: normal !important;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.messagelist tr>.flag span,
|
||||
.messagelist tr>.status span,
|
||||
.messagelist tr>.attachment span,
|
||||
.messagelist tr>.priority span {
|
||||
text-indent: 0;
|
||||
}
|
||||
|
||||
#interface-options span.tooltip {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#messagestack div:after {
|
||||
position: absolute !important;
|
||||
}
|
||||
|
||||
.formbuttons {
|
||||
text-align: right;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.ui-dialog-titlebar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
button {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
body.iframe .footerleft.floating,
|
||||
#composeview-bottom .formbuttons.floating {
|
||||
right: 0;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
body.print-message,
|
||||
#printmessageframe {
|
||||
background: #fff !important;
|
||||
}
|
||||
|
||||
.minicolors-swatch .minicolors-swatch-color {
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* iehacks */
|
||||
|
||||
input.button,
|
||||
.formbuttons input.button,
|
||||
.formbuttons input.button:active,
|
||||
input.button.mainaction,
|
||||
input.button.mainaction:active,
|
||||
a.button,
|
||||
a.button.pressed,
|
||||
a.button:active,
|
||||
input.button:active,
|
||||
.pagenav.dark a.button,
|
||||
.pagenav.dark a.button.pressed,
|
||||
#message.statusbar,
|
||||
.ui-dialog.popupmessage .ui-dialog-titlebar,
|
||||
.ui-dialog.popupmessage .ui-widget-content,
|
||||
#topnav,
|
||||
.records-table tr.selected td,
|
||||
.contentbox .boxtitle,
|
||||
body.iframe .boxtitle,
|
||||
#login-form input.button,
|
||||
#login-form input.button:active,
|
||||
.toolbar a.button,
|
||||
a.menuselector,
|
||||
a.menuselector:active,
|
||||
.googie_list td.googie_list_onhover,
|
||||
ul.toolbarmenu li a.active:hover,
|
||||
#rcmKSearchpane ul li.selected,
|
||||
.tabsbar .tablink,
|
||||
.tabsbar .selected a,
|
||||
.contactfieldgroup,
|
||||
.contactfieldgroup legend,
|
||||
#messagelistfooter,
|
||||
#mailboxlist li.mailbox .unreadcount,
|
||||
#mailboxlist li.mailbox.selected > a .unreadcount,
|
||||
#messageheader, #partheader, #composeheaders,
|
||||
#previewheaderstoggle {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
/* login */
|
||||
|
||||
#login-form td.title {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#login-form input[type="text"],
|
||||
#login-form input[type="password"] {
|
||||
border: 1px solid #ddd;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
#ifplcontainer div label {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#login-form {
|
||||
select#_language {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* switch checkboxes */
|
||||
|
||||
input.switchbox-input {
|
||||
opacity: 0 !important;
|
||||
position: absolute !important;
|
||||
}
|
||||
|
||||
label.switchbox {
|
||||
font-size: 1em;
|
||||
position: relative;
|
||||
display: inline-block !important;
|
||||
padding: 0 !important;
|
||||
width: 2em !important;
|
||||
height: 1.1em !important;
|
||||
background: #a5a5a5 !important;
|
||||
border: 1px solid #ddd !important;
|
||||
border-radius: 1em !important;
|
||||
vertical-align: -0.15em !important;
|
||||
transition: all 0.5s cubic-bezier(.17,.67,.43,.98);
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
label.switchbox:hover {
|
||||
background: #ddd !important;
|
||||
}
|
||||
|
||||
label.switchbox:after {
|
||||
position: absolute !important;
|
||||
display: block !important;
|
||||
content: '' !important;
|
||||
top: 1px !important;
|
||||
left: 1px !important;
|
||||
bottom: 1px !important;
|
||||
width: 1em !important;
|
||||
border-radius: 50% !important;
|
||||
background: #fff !important;
|
||||
box-shadow: 0 0 0.1em 0 #aaa !important;
|
||||
}
|
||||
|
||||
input.switchbox-input:checked + label.switchbox {
|
||||
background: #4cd964 !important;
|
||||
border-color: #4cd964 !important;
|
||||
}
|
||||
|
||||
input.switchbox-input:checked + label.switchbox:hover {
|
||||
background: #41c658 !important;
|
||||
}
|
||||
|
||||
input.switchbox-input:checked + label.switchbox:after {
|
||||
left: auto !important;
|
||||
right: 1px !important;
|
||||
box-shadow: 0 0 0.1em 0 #aaa !important;
|
||||
}
|
||||
|
||||
body.xskin input.switchbox-input:disabled + label.switchbox,
|
||||
body.xskin input.switchbox-input:checked:disabled + label.switchbox {
|
||||
background: #ddd !important;
|
||||
border-color: #ddd !important;
|
||||
cursor:not-allowed;
|
||||
}
|
||||
|
||||
input.switchbox-input:disabled + label.switchbox:after,
|
||||
input.switchbox-input:checked:disabled + label.switchbox:after {
|
||||
background: #eee !important;
|
||||
}
|
||||
|
||||
// fix positioning
|
||||
#subscription-table label.switchbox,
|
||||
#subscription-table label.material.checkbox {
|
||||
left: auto !important;
|
||||
}
|
||||
|
||||
/* compose */
|
||||
|
||||
.mce-btn,
|
||||
.mce-btn button,
|
||||
button.mce-close {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
|
||||
.mce-btn .mce-txt,
|
||||
.mce-btn button {
|
||||
color: #333 !important;
|
||||
}
|
||||
|
||||
.mce-colorbutton:hover .mce-open {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
i.mce-i-backcolor {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.mce-widget button {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
#composeoptions {
|
||||
border: none;
|
||||
}
|
||||
|
||||
#composeheaders .moreheaderstoggle {
|
||||
border: none !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.moreheaderstoggle .iconlink {
|
||||
top: auto;
|
||||
bottom: 2px;
|
||||
}
|
||||
|
||||
.moreheaderstoggle.remove .iconlink {
|
||||
bottom: 2px;
|
||||
}
|
||||
|
||||
#composebodycontainer .mce-tinymce {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#compose-attachments {
|
||||
top: 0;
|
||||
border: 0;
|
||||
border-left: 1px solid #DFDFDF;
|
||||
}
|
||||
|
||||
#composebodycontainer .mce-edit-area {
|
||||
border-top: 1px solid #DFDFDF !important;
|
||||
}
|
||||
|
||||
// html editor buttons
|
||||
|
||||
button.tox-tbtn,
|
||||
button.tox-button,
|
||||
button.mce-close {
|
||||
color: #222f3e !important;
|
||||
background: transparent !important;
|
||||
|
||||
&:hover {
|
||||
background: #dee0e2 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tox-dialog {
|
||||
border: 1px solid #bbbbbb;
|
||||
}
|
||||
|
||||
.tox-dialog__footer {
|
||||
button.tox-button {
|
||||
background: #fff;
|
||||
border: 1px solid #aaa;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
button.tox-button--secondary {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* plugin: treecol */
|
||||
|
||||
#mailview-tc-mid,
|
||||
#mailview-tc-right {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* plugin: xcalendar */
|
||||
|
||||
.xcalendar .fc-state-default, .xcalendar .boxtitle button {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* plugin: help */
|
||||
|
||||
#helptoolbar a.button.help {
|
||||
display: none; // this button doesn't do anything
|
||||
}
|
||||
|
||||
/* plugin: rcguard */
|
||||
|
||||
#recaptcha_area {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
/* plugin managesieve */
|
||||
|
||||
#filter-form {
|
||||
select,
|
||||
input,
|
||||
textarea {
|
||||
font-size: 1em;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.rulerow .listarea {
|
||||
padding: 0;
|
||||
border: 1px solid #ddd;
|
||||
background: transparent;
|
||||
|
||||
.listelement {
|
||||
height: auto;
|
||||
|
||||
.reset {
|
||||
margin-top: 3px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 4px !important;
|
||||
background: transparent;
|
||||
border: none !important;
|
||||
line-height: normal;
|
||||
margin-left: 5px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* plugin: filters */
|
||||
|
||||
.xskin #pluginbody #filters-form {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: auto;
|
||||
|
||||
.uibox.listbox.scroller {
|
||||
position: static;
|
||||
margin-top: 0 !important;
|
||||
border: none;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.boxcontent {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
97
plugins/xskin/assets/styles/_larry_desktop_light.scss
Normal file
97
plugins/xskin/assets/styles/_larry_desktop_light.scss
Normal file
@ -0,0 +1,97 @@
|
||||
|
||||
.uibox .boxtitle,
|
||||
.uibox .listing thead td,
|
||||
.uibox .listing thead th {
|
||||
background: #aaa;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
a.menuselector {
|
||||
color: #333 !important;
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
#mailboxlist li.mailbox ul {
|
||||
border-top-color: #ddd;
|
||||
}
|
||||
|
||||
.toolbar a.button,
|
||||
.pagenavbuttons a.button {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.popupmenu,
|
||||
#rcmKSearchpane {
|
||||
border-color: #999;
|
||||
border-width: 2px !important;
|
||||
border-style: solid !important;
|
||||
background: #fff;
|
||||
color: #333;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.popupmenu li,
|
||||
.popupmenu a {
|
||||
background-image: none !important;
|
||||
}
|
||||
|
||||
.popupmenu a,
|
||||
.googie_list td span,
|
||||
ul.toolbarmenu li a {
|
||||
color: #aaa;
|
||||
|
||||
&.active {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
#enigmamenu {
|
||||
overflow-y: hidden;
|
||||
|
||||
label {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.googie_list td,
|
||||
ul.toolbarmenu li,
|
||||
ul.toolbarmenu li label,
|
||||
ul.toolbarmenu li a.icon,
|
||||
#rcmKSearchpane ul li {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.googie_list td.googie_list_onhover,
|
||||
ul.toolbarmenu li a.active:hover,
|
||||
ul.toolbarmenu li a.active:focus,
|
||||
#rcmKSearchpane ul li.selected,
|
||||
select.decorated option:hover,
|
||||
select.decorated option[selected='selected'] {
|
||||
background: #e9e9e9 !important;
|
||||
}
|
||||
|
||||
.googie_list td span, ul.toolbarmenu li a.active {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.popupmenu a:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#background-more-actions a {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#interface-options {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
// plugin: primitivenotes
|
||||
#newmenu.popupmenu a {
|
||||
color: #333 !important;
|
||||
|
||||
&:hover {
|
||||
background: #e9e9e9;
|
||||
}
|
||||
}
|
27
plugins/xskin/assets/styles/_larry_desktop_square.scss
Normal file
27
plugins/xskin/assets/styles/_larry_desktop_square.scss
Normal file
@ -0,0 +1,27 @@
|
||||
|
||||
a.button,
|
||||
.uibox,
|
||||
.uibox .boxtitle,
|
||||
.uibox .listing thead td,
|
||||
.uibox .listing thead th,
|
||||
a.menuselector,
|
||||
#messagestack .notice,
|
||||
input.button,
|
||||
.formbuttons input.button,
|
||||
input.button.mainaction,
|
||||
input.button.mainaction:active,
|
||||
#login-form input.button,
|
||||
#mailboxlist li,
|
||||
.listbox .boxfooter,
|
||||
.contentbox .boxtitle,
|
||||
body.iframe .boxtitle,
|
||||
.contactfieldgroup legend,
|
||||
.records-table thead td,
|
||||
.records-table thead th,
|
||||
#messagelistfooter,
|
||||
.popupmenu,
|
||||
#rcmKSearchpane,
|
||||
body.xlarry-font-icons #mailboxlist li.mailbox .unreadcount,
|
||||
.minicolors-swatch .minicolors-swatch-color {
|
||||
border-radius: 0 !important;
|
||||
}
|
212
plugins/xskin/assets/styles/_options.scss
Normal file
212
plugins/xskin/assets/styles/_options.scss
Normal file
@ -0,0 +1,212 @@
|
||||
@import "../../../xframework/assets/styles/_colors";
|
||||
|
||||
@mixin font-family($font) {
|
||||
body, button, input, optgroup, select, textarea, .popover {
|
||||
font-family: $font;
|
||||
}
|
||||
}
|
||||
|
||||
// user option: font family
|
||||
html.xfont-family-arial { @include font-family((Arial, Helvetica, sans-serif)); }
|
||||
html.xfont-family-courier { @include font-family(("Courier New", Courier, monospace)); }
|
||||
html.xfont-family-merienda { @include font-family(('Merienda', cursive)); }
|
||||
html.xfont-family-montserrat { @include font-family(('Montserrat Alternates', sans-serif)); }
|
||||
html.xfont-family-noto-sans { @include font-family(('Noto Sans', sans-serif)); }
|
||||
html.xfont-family-quattrocento { @include font-family(('Quattrocento', serif)); }
|
||||
html.xfont-family-roboto { @include font-family(("Roboto", sans-serif)); }
|
||||
html.xfont-family-sarala { @include font-family(('Sarala', sans-serif)); }
|
||||
html.xfont-family-times { @include font-family(("Times New Roman", Times, serif)); }
|
||||
html.xfont-family-ubuntu { @include font-family(('Ubuntu', sans-serif)); }
|
||||
|
||||
// user option: font thickness
|
||||
html.xthick-font-yes body * {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
// user option: font size
|
||||
html, body {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
html.xfont-size-xs {
|
||||
&, body { font-size: 12px; }
|
||||
}
|
||||
|
||||
html.xfont-size-s {
|
||||
&, body { font-size: 13px; }
|
||||
|
||||
}
|
||||
html.xfont-size-l {
|
||||
&, body { font-size: 15px; }
|
||||
}
|
||||
|
||||
html.xfont-size-xl {
|
||||
&, body { font-size: 16px; }
|
||||
}
|
||||
|
||||
// user option: icons in lists
|
||||
body.xlist-icons-no {
|
||||
.scroller .listing.iconized li > a:before,
|
||||
.scroller .listing.iconized tr > td.section:before,
|
||||
.scroller .listing.iconized tr.contact > td:before,
|
||||
.scroller .folderlist li > a:before,
|
||||
.popupmenu:not(#spell-menu) .listing a:before {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// user option: icons on buttons
|
||||
body.xbutton-icons-no button.btn {
|
||||
&:not(.ui-dialog-titlebar-close):before {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// skin option: normal (not bold) header font
|
||||
body.xnormal-header-font {
|
||||
#layout > div > .header,
|
||||
#layout > div > .footer,
|
||||
.folderlist li.mailbox .unreadcount,
|
||||
#sidebar-calendar .ui-datepicker select {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
// skin option: inverted colors on header
|
||||
body.xinverted-header-colors {
|
||||
&.xsidebar-mobile-visible #xsidebar #xsidebar-mobile-header a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#messagelist-header,
|
||||
#layout > div > .header {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
// skin option: no icons on taskbar
|
||||
@media screen and (min-width: 480px) {
|
||||
body.xno-taskbar-icons {
|
||||
#taskmenu a {
|
||||
padding: 0;
|
||||
height: 36px;
|
||||
font-size: 1rem;
|
||||
|
||||
&:before {
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
span.inner {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// skin option: no border radius
|
||||
body.xno-border-radius {
|
||||
* :not(.spinner) {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
// skin option: inverted menu
|
||||
body.xinverted-menu {
|
||||
#sidebar-calendar .ui-datepicker {
|
||||
border-left: 1px solid !important;
|
||||
border-right: 1px solid !important;
|
||||
@include border-color(true);
|
||||
}
|
||||
|
||||
#layout>div>.header {
|
||||
background: #ddd;
|
||||
|
||||
|
||||
&,
|
||||
.menu.toolbar a,
|
||||
a.button,
|
||||
select {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.header {
|
||||
.listing li {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
#layout-sidebar,
|
||||
#layout-list,
|
||||
#layout-content {
|
||||
border: none !important;
|
||||
|
||||
.iframe-wrapper,
|
||||
.searchbar,
|
||||
.footer,
|
||||
.scroller {
|
||||
border-left: 1px solid;
|
||||
@include border-color;
|
||||
}
|
||||
|
||||
#calendar-list-container {
|
||||
border-right: 1px solid;
|
||||
@include border-color;
|
||||
}
|
||||
|
||||
// fix for rc 1.5 vs 1.4
|
||||
#compose-content {
|
||||
border-left: 1px solid;
|
||||
@include border-color;
|
||||
|
||||
.scroller {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#layout > div.sidebar {
|
||||
.pagenav,
|
||||
.scroller,
|
||||
.footer {
|
||||
border-left: 1px solid;
|
||||
@include border-color;
|
||||
}
|
||||
}
|
||||
|
||||
#layout > #layout-menu {
|
||||
border-right: none;
|
||||
|
||||
&,
|
||||
#taskmenu .action-buttons a {
|
||||
background-color: #F4F4F4 !important;
|
||||
}
|
||||
|
||||
#taskmenu a {
|
||||
@include text-color(true);
|
||||
background-color: transparent !important;
|
||||
|
||||
&.selected,
|
||||
&.selected:hover,
|
||||
&:hover {
|
||||
@include background-highlight-color(10, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html.dark-mode body.xinverted-menu {
|
||||
#layout > #layout-menu {
|
||||
background-color: #21292c !important;
|
||||
|
||||
#taskmenu .action-buttons a {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
.floating-action-buttons a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
2
plugins/xskin/assets/styles/larry_desktop.css
Normal file
2
plugins/xskin/assets/styles/larry_desktop.css
Normal file
File diff suppressed because one or more lines are too long
7
plugins/xskin/assets/styles/larry_desktop.css.map
Normal file
7
plugins/xskin/assets/styles/larry_desktop.css.map
Normal file
File diff suppressed because one or more lines are too long
1039
plugins/xskin/assets/styles/larry_desktop.scss
Normal file
1039
plugins/xskin/assets/styles/larry_desktop.scss
Normal file
File diff suppressed because it is too large
Load Diff
2
plugins/xskin/assets/styles/larry_mobile.css
Normal file
2
plugins/xskin/assets/styles/larry_mobile.css
Normal file
File diff suppressed because one or more lines are too long
7
plugins/xskin/assets/styles/larry_mobile.css.map
Normal file
7
plugins/xskin/assets/styles/larry_mobile.css.map
Normal file
File diff suppressed because one or more lines are too long
3020
plugins/xskin/assets/styles/larry_mobile.scss
Normal file
3020
plugins/xskin/assets/styles/larry_mobile.scss
Normal file
File diff suppressed because it is too large
Load Diff
2
plugins/xskin/assets/styles/styles.css
Normal file
2
plugins/xskin/assets/styles/styles.css
Normal file
File diff suppressed because one or more lines are too long
7
plugins/xskin/assets/styles/styles.css.map
Normal file
7
plugins/xskin/assets/styles/styles.css.map
Normal file
File diff suppressed because one or more lines are too long
361
plugins/xskin/assets/styles/styles.scss
Normal file
361
plugins/xskin/assets/styles/styles.scss
Normal file
@ -0,0 +1,361 @@
|
||||
@import "_options";
|
||||
@import "../../../xframework/assets/styles/_colors";
|
||||
|
||||
.btn {
|
||||
// border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
// gray out disabled dialog buttons
|
||||
.xelastic div.ui-dialog-buttonset button.btn:disabled {
|
||||
background-color: #aaa !important;
|
||||
}
|
||||
|
||||
.form-control:focus,
|
||||
.recipient-input.focus,
|
||||
.mce-tinymce.focused, // rc 1.4 html editor
|
||||
div.tox.focused, // rc 1.5 html editor
|
||||
div.tox .tox-color-input>input:focus,
|
||||
div.tox .tox-selectfield select:focus,
|
||||
div.tox .tox-textarea:focus,
|
||||
div.tox .tox-textfield:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
|
||||
&, &:hover {
|
||||
@include text-color(true);
|
||||
background: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
body.xelastic {
|
||||
.menu a:not(.disabled),
|
||||
.menu.toolbar .dropbutton:not(.disabled),
|
||||
.header a.button.icon:not(.disabled),
|
||||
.menu.toolbar .dropbutton a.dropdown,
|
||||
.menu.toolbar .menuitem:not(.select) {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: rgba(255, 255, 255, .15);
|
||||
}
|
||||
}
|
||||
|
||||
.menu span.dropbutton a {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
html.dark-mode {
|
||||
#settings-menu li.selected,
|
||||
.listing tr.selected td,
|
||||
.listing li.selected,
|
||||
ul.treelist li.selected,
|
||||
ul.treelist li.selected,
|
||||
.toolbar a.button:not(.disabled):focus,
|
||||
.toolbar a.button:not(.disabled):hover,
|
||||
.toolbarmenu.listing li:hover a.active,
|
||||
.menu.toolbar .dropbutton:not(.disabled):hover,
|
||||
.popupmenu .listing li > a:not(.disabled):hover,
|
||||
#taskmenu a:hover,
|
||||
.header a.button.icon:not(.disabled):focus,
|
||||
.header a.button.icon:not(.disabled):hover,
|
||||
.menu a:not(.disabled):focus,
|
||||
.menu a:not(.disabled):hover {
|
||||
background-color: rgba(255, 255, 255, .06);
|
||||
}
|
||||
|
||||
.listing li.selected > a,
|
||||
ul.treelist li.selected > div > a,
|
||||
ul.treelist li.selected > a {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.popover {
|
||||
font-size: 1rem;
|
||||
|
||||
.menu li a[aria-haspopup]:hover:after {
|
||||
@include text-color;
|
||||
}
|
||||
}
|
||||
|
||||
// login page (both elastic and larry)
|
||||
|
||||
body.xskin.login-page {
|
||||
#login-title {
|
||||
display: block;
|
||||
margin: 0 0 20px 0;
|
||||
text-align: center;
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
#logo {
|
||||
position: static;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
max-width: 100%;
|
||||
margin: auto;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
#login-footer,
|
||||
#bottomline {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 8px;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
font-size: 0.8em;
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#vendor-branding {
|
||||
position: fixed;
|
||||
bottom: 3px;
|
||||
right: 8px;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
z-index: 1;
|
||||
background: rgba(0, 0, 0, .2);
|
||||
border-radius: 5px !important;
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
line-height: 1em;
|
||||
|
||||
&:hover {
|
||||
background: #cc0000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// login page (elastic only)
|
||||
|
||||
body.xelastic.login-page {
|
||||
background: #f0f0f0;
|
||||
|
||||
#layout {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
#layout-content {
|
||||
overflow: visible;
|
||||
margin: 20vh auto 0 auto !important;
|
||||
color: #333;
|
||||
max-width: 100%;
|
||||
width: 420px;
|
||||
background: #fff !important;
|
||||
padding: 35px;
|
||||
flex: none;
|
||||
|
||||
#login-form {
|
||||
position: static;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
table {
|
||||
width: 100% !important;
|
||||
border-collapse: collapse;
|
||||
|
||||
tr.row {
|
||||
max-width: 100%;
|
||||
|
||||
td {
|
||||
display: block;
|
||||
padding-bottom: 5px;
|
||||
|
||||
&.title {
|
||||
display: block !important;
|
||||
line-height: 1.1em;
|
||||
padding-top: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input[type='text'],
|
||||
input[type='password'],
|
||||
select {
|
||||
width: 100%;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-prepend {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.formbuttons {
|
||||
margin: 20px 0 0 0;
|
||||
|
||||
button {
|
||||
margin: 0;
|
||||
padding: 0.6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.xbackground-login-image) #login-footer {
|
||||
background: transparent;
|
||||
|
||||
&, a {
|
||||
color: #717171;
|
||||
}
|
||||
}
|
||||
|
||||
html.dark-mode & {
|
||||
background: #21292c;
|
||||
|
||||
#layout-content {
|
||||
color: #f4f4f4;
|
||||
background-color: #313c40 !important;
|
||||
}
|
||||
|
||||
&:not(.xbackground-login-image) #login-footer {
|
||||
background: transparent;
|
||||
|
||||
&, a {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// skin look and feel
|
||||
|
||||
.skin_look_and_feel {
|
||||
.color-box {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
margin: 0 4px 4px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.xsave-hint {
|
||||
display: none;
|
||||
|
||||
&:before {
|
||||
margin-right: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// remove right border from lists
|
||||
html:not(.touch) .listing li>a:focus,
|
||||
html:not(.touch) .listing.focus tbody tr.focused>td:first-child,
|
||||
html:not(.touch) .listing.focus:not(.withselection) tbody tr.focused>td.selection+td {
|
||||
border-left-color: transparent;
|
||||
}
|
||||
|
||||
// correct icon positions and colors
|
||||
.popover-body :before {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
.input-group-text.icon:before {
|
||||
@include text-color;
|
||||
}
|
||||
|
||||
.xicons-outlined {
|
||||
.input-group-text.icon:before,
|
||||
.popover-body :before {
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
.popover-header a.icon:before {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
// checkboxes
|
||||
.custom-switch .custom-control-input {
|
||||
&:focus:not(:checked) ~ .custom-control-label::before {
|
||||
border-color: #adb5bd;
|
||||
}
|
||||
|
||||
&:focus ~ .custom-control-label::before {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
&:checked~.custom-control-label::before { // overwrite this in skin colors
|
||||
border-color: #888;
|
||||
background-color: #888;
|
||||
}
|
||||
}
|
||||
|
||||
// popupmenu
|
||||
@media screen and (min-width: 768px) {
|
||||
.popupmenu:not(#listoptions-menu) {
|
||||
@include border-color;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
border-bottom: 1px solid;
|
||||
@include border-color;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
@include text-color;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
span {
|
||||
padding: 0;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
#button-apps span.inner {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
// reset button settings on smallest screens
|
||||
body.xelastic .ui-dialog-buttonpane .ui-dialog-buttonset .btn {
|
||||
background: transparent !important;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1025px) {
|
||||
#taskmenu a:focus {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user