feat: MsUpload styles

This commit is contained in:
Calum Dingwall 2021-08-11 18:21:56 -04:00 committed by alistair3149
parent 5fe0c9618f
commit d889cb91ab
2 changed files with 82 additions and 0 deletions

View file

@ -407,6 +407,8 @@
"+ext.Lingo": "skinStyles/extensions/Lingo/ext.Lingo.less",
"+ext.Lingo.jquery.qtip": "skinStyles/extensions/Lingo/ext.Lingo.jquery.qtip.less",
"+ext.MsUpload": "skinStyles/extensions/MsUpload/ext.MsUpload.less",
"+ext.relatedArticles.cards": "skinStyles/extensions/RelatedArticles/ext.relatedArticles.cards.less",
"+ext.relatedArticles.readMore": "skinStyles/extensions/RelatedArticles/ext.relatedArticles.readMore.less",

View file

@ -0,0 +1,80 @@
@import '../../../resources/variables.less';
#msupload-container.start-loading {
filter: invert(1) hue-rotate(180deg);
}
.toolbar #msupload-select,
#msupload-bottom #msupload-files {
background-image: linear-gradient(transparent, transparent),
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E upload %3C/title%3E%3Cpath d='M17 12v5H3v-5H1v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5z'/%3E%3Cpath d='M10 1 5 7h4v8h2V7h4z'/%3E%3C/svg%3E%0A");
.skin-citizen-dark & {
filter: invert(1) hue-rotate(180deg);
}
}
.skin-citizen-dark {
& #msupload-div {
background-color: @dark-bg-20;
border-top-color: @dark-bg-30;
& a {
color: @color-primary;
}
& #msupload-dropzone {
border-color: @dark-text-70;
color: @dark-text-90;
&.drop-over {
background-color: @dark-background-color-quiet--hover;
}
}
& #msupload-list {
& .file {
background: @dark-bg-40;
border-top-color: @dark-bg-50;
& .file-name-input,
& .file-name:hover {
background: @dark-bg-60;
}
& .file-size {
color: @dark-text-80;
}
& .file-loading,
& .file-cancel {
filter: invert(1) hue-rotate(180deg);
}
& .file-warning {
color: @dark-background-color-warning;
}
& .file-error {
color: @dark-background-color-destructive;
}
}
& .green {
background: fade(@green-30, 5%);
}
& .yellow {
background: fade(@yellow-30, 5%);
}
& .red {
background: fade(@red-30, 5%);
}
}
}
& #msupload-bottom {
border-top-color: @dark-bg-30;
}
}