Split css file

This commit is contained in:
Urban Rotnik 2019-11-11 08:44:08 +01:00
parent 9bf948c3a8
commit 85153a5785
9 changed files with 183 additions and 174 deletions

View file

@ -1,7 +1,7 @@
/* global GLOBAL_CONSTANTS I18n */
/* eslint-disable no-unused-vars */
var RepositoryListColumnType = (function() {
var manageModal = '#manageRepositoryColumn';
var manageModal = '#manage-repository-column';
function onlyUnique(value, index, self) {
return self.indexOf(value) === index;

View file

@ -1,7 +1,7 @@
/* global GLOBAL_CONSTANTS I18n */
/* eslint-disable no-unused-vars */
var RepositoryStatusColumnType = (function() {
var manageModal = '#manageRepositoryColumn';
var manageModal = '#manage-repository-column';
function statusTemplate() {
return `

View file

@ -1,7 +1,7 @@
/* global I18n HelperModule animateSpinner RepositoryListColumnType RepositoryStatusColumnType*/
/* eslint-disable no-restricted-globals */
var RepositoryColumns = (function() {
var manageModal = '#manageRepositoryColumn';
var manageModal = '#manage-repository-column';
function initColumnTypeSelector() {
var $manageModal = $(manageModal);

View file

@ -150,7 +150,7 @@ $btn-border-radius-small: $border-radius-small;
// $input-bg: #fff;
// $input-bg-disabled: $gray-lighter;
// $input-color: $gray;
// $input-border: #ccc;
$input-border: #ccc;
// $input-border-radius: $border-radius-base;
// $input-border-radius-large: $border-radius-large;
// $input-border-radius-small: $border-radius-small;

View file

@ -260,172 +260,3 @@
}
}
#manageRepositoryColumn {
.modal-footer {
text-align: center;
}
.delete-footer {
text-align: right;
}
}
.dropdown-preview {
align-items: center;
background-color: $color-concrete;
border: 1px solid $color-gainsboro;
border-radius: 5px;
display: flex;
justify-content: center;
padding: 10px 100px 5px;
position: relative;
.field-name {
color: $color-silver-chalice;
left: 0;
padding: 0 5px;
position: absolute;
top: 0;
}
.preview-block {
flex-basis: 200px;
position: relative;
}
.limit-counter-container {
bottom: 0;
color: $color-silver-chalice;
left: 100%;
line-height: 34px;
margin-left: 15px;
position: absolute;
width: 100px;
.list-items-limit {
display: none;
}
&.error-to-many-items {
.list-items-count {
color: $brand-danger;
font-weight: bold;
}
.list-items-limit {
display: inline;
}
}
}
}
.status-item-container {
align-items: center;
display: flex;
height: 34px;
margin-bottom: 5px;
transition: .3s;
&.loading {
height: 0;
* {
display: none;
}
}
&[data-removed="true"] {
display: none;
}
&.error.error-highlight {
.status-item-icon {
border-bottom: 1px solid $brand-danger;
border-left: 1px solid $brand-danger;
border-top: 1px solid $brand-danger;
}
.status-item-field {
border-bottom: 1px solid $brand-danger;
border-right: 1px solid $brand-danger;
border-top: 1px solid $brand-danger;
}
}
}
.status-item-field {
border: 1px solid #ccc;
border-left: 0;
border-radius: 0 4px 4px 0;
flex-grow: 1;
font-size: 14px;
height: 34px;
padding: 6px 12px;
}
.status-item-icon {
border: 1px solid #ccc;
border-radius: 4px 0 0 4px;
cursor: pointer;
display: inline-block;
height: 34px;
line-height: 32px;
text-align: center;
width: 34px;
&:not([data-icon])::before {
content: "\f06a";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
}
.status-item-icon-trash {
color: $color-silver-chalice;
padding: 0 10px;
width: 34px;
&:hover {
color: $color-dove-gray;
}
}
.add-status {
align-items: center;
border: 1px solid transparent;
border-radius: 4px;
color: $color-silver-chalice;
cursor: pointer;
display: flex;
font-size: 14px;
height: 34px;
line-height: 32px;
margin-right: 32px;
transition: .2s;
.fa-plus {
display: inline-block;
height: 34px;
line-height: 32px;
text-align: center;
width: 34px;
}
&:hover {
border: 1px solid $color-gainsboro;
}
.add-status-label {
flex-grow: 1;
padding-left: 5px;
}
}
.emojis-picker {
border: 1px solid $color-gainsboro;
display: none;
font-size: 30px;
height: 40px;
width: 211px;
}

View file

@ -0,0 +1,14 @@
// scss-lint:disable IdSelector
@import "constants";
#manage-repository-column {
.modal-footer {
text-align: center;
}
.delete-footer {
text-align: right;
}
}

View file

@ -0,0 +1,52 @@
// scss-lint:disable NestingDepth
@import "constants";
.dropdown-preview {
align-items: center;
background-color: $color-concrete;
border: 1px solid $color-gainsboro;
border-radius: 5px;
display: flex;
justify-content: center;
padding: 10px 100px 5px;
position: relative;
.field-name {
color: $color-silver-chalice;
left: 0;
padding: 0 5px;
position: absolute;
top: 0;
}
.preview-block {
flex-basis: 200px;
position: relative;
}
.limit-counter-container {
bottom: 0;
color: $color-silver-chalice;
left: 100%;
line-height: 34px;
margin-left: 15px;
position: absolute;
width: 100px;
.list-items-limit {
display: none;
}
&.error-to-many-items {
.list-items-count {
color: $brand-danger;
font-weight: bold;
}
.list-items-limit {
display: inline;
}
}
}
}

View file

@ -0,0 +1,112 @@
@import "constants";
.status-item-container {
align-items: center;
display: flex;
height: 34px;
margin-bottom: 5px;
transition: .3s;
&.loading {
height: 0;
* {
display: none;
}
}
&[data-removed="true"] {
display: none;
}
&.error.error-highlight {
.status-item-icon {
border-bottom: 1px solid $brand-danger;
border-left: 1px solid $brand-danger;
border-top: 1px solid $brand-danger;
}
.status-item-field {
border-bottom: 1px solid $brand-danger;
border-right: 1px solid $brand-danger;
border-top: 1px solid $brand-danger;
}
}
}
.status-item-field {
border: 1px solid $input-border;
border-left: 0;
border-radius: 0 4px 4px 0;
flex-grow: 1;
font-size: 14px;
height: 34px;
padding: 6px 12px;
}
.status-item-icon {
border: 1px solid $input-border;
border-radius: 4px 0 0 4px;
cursor: pointer;
display: inline-block;
height: 34px;
line-height: 32px;
text-align: center;
width: 34px;
&:not([data-icon])::before {
content: "\f06a";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
}
.status-item-icon-trash {
color: $color-silver-chalice;
padding: 0 10px;
width: 34px;
&:hover {
color: $color-dove-gray;
}
}
.add-status {
align-items: center;
border: 1px solid transparent;
border-radius: 4px;
color: $color-silver-chalice;
cursor: pointer;
display: flex;
font-size: 14px;
height: 34px;
line-height: 32px;
margin-right: 32px;
transition: .2s;
.fa-plus {
display: inline-block;
height: 34px;
line-height: 32px;
text-align: center;
width: 34px;
}
&:hover {
border: 1px solid $color-gainsboro;
}
.add-status-label {
flex-grow: 1;
padding-left: 5px;
}
}
.emojis-picker {
border: 1px solid $color-gainsboro;
display: none;
font-size: 30px;
height: 40px;
width: 211px;
}

View file

@ -1,5 +1,5 @@
<div class="modal"
id="manageRepositoryColumn"
id="manage-repository-column"
tabindex="-1"
role="dialog"
aria-labelledby="manangeRepositoryColumnLabel">