Initial commit
This commit is contained in:
675
src/less/adminCommons.less
Normal file
675
src/less/adminCommons.less
Normal file
@@ -0,0 +1,675 @@
|
||||
@import "commons";
|
||||
|
||||
@keyframes colors {
|
||||
0% { stroke: #4285F4; }
|
||||
25% { stroke: #DE3E35; }
|
||||
50% { stroke: #F7C223; }
|
||||
75% { stroke: #1B9A59; }
|
||||
100% { stroke: #4285F4; }
|
||||
}
|
||||
|
||||
@keyframes dash {
|
||||
0% { stroke-dashoffset: @offset; }
|
||||
50% {
|
||||
stroke-dashoffset: @offset/4;
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
100% {
|
||||
stroke-dashoffset: @offset;
|
||||
transform: rotate(450deg);
|
||||
}
|
||||
}
|
||||
@keyframes rotator {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(270deg); }
|
||||
}
|
||||
|
||||
|
||||
.iob-font {
|
||||
font-family: @iob-font;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.iob-font-12 {
|
||||
font-size: @list-font-size !important;
|
||||
&:extend(.iob-font);
|
||||
}
|
||||
.iob-list-font {
|
||||
font-size: @list-font-size !important;
|
||||
&:extend(.iob-font);
|
||||
}
|
||||
|
||||
table.iob-list-table>thead>tr>th {
|
||||
background: @list-header-background;
|
||||
color: #000;
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
padding-left: @line-indent;
|
||||
height: @header-height - 2px;
|
||||
//&:extend(.iob-font-12);
|
||||
}
|
||||
|
||||
.toolbar-frame {
|
||||
height: @toolbar-size;
|
||||
//margin-top: (@toolbar-y-margin - @tabs-padding-top);
|
||||
margin-bottom: @toolbar-y-margin;
|
||||
margin-top: @toolbar-y-margin;
|
||||
}
|
||||
|
||||
.line-indent {
|
||||
padding-left: @line-indent;
|
||||
}
|
||||
|
||||
.ui-state-active a,
|
||||
.ui-state-active a:link,
|
||||
.ui-state-active a:visited,
|
||||
.ui-state-hover a,
|
||||
.ui-state-hover a:link,
|
||||
.ui-state-hover a:visited {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.ui-jqgrid tr.jqgrow td {
|
||||
font-size: @list-font-size;
|
||||
}
|
||||
|
||||
.ui-jqgrid .ui-pg-input {
|
||||
height: 20px !important;
|
||||
}
|
||||
|
||||
.header {
|
||||
height: 29px;
|
||||
line-height: 29px;
|
||||
font-size: 16px;
|
||||
margin-left: @line-indent !important;
|
||||
margin-right: 6px !important;
|
||||
}
|
||||
|
||||
.ui-tabs-nav {
|
||||
border-radius: 0;
|
||||
border-top: none;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
/** tabs **/
|
||||
/**/
|
||||
.ui-tabs-panel {
|
||||
border: none;
|
||||
padding: @tabs-padding !important;
|
||||
padding-top: @tabs-padding-top !important;
|
||||
}
|
||||
|
||||
.ui-jqgrid-titlebar-close {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@keyframes highlight {
|
||||
0% {
|
||||
color: #00f900
|
||||
}
|
||||
80% {
|
||||
color: green
|
||||
}
|
||||
100% {
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-large {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
-webkit-box-shadow: 10px 10px 12px 0 rgba(0,0,0,0.75);
|
||||
-moz-box-shadow: 10px 10px 12px 0 rgba(0,0,0,0.75);
|
||||
box-shadow: 10px 10px 12px 0 rgba(0,0,0,0.75);
|
||||
background: white;
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
-moz-border-radius: 10px 10px 10px 10px;
|
||||
-webkit-border-radius: 10px 10px 10px 10px;
|
||||
border: 0 solid #000000;
|
||||
overflow: hidden;
|
||||
}
|
||||
.icon-large img {
|
||||
width: 12em;
|
||||
height: 12em;
|
||||
}
|
||||
|
||||
.select-id-quick-edit:hover {
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.ui-button-icon-only {
|
||||
width: 1.8em;
|
||||
height: 1.8em;
|
||||
}
|
||||
|
||||
.ui-state-active {
|
||||
/*background: #800000 !important;*/
|
||||
background: none;
|
||||
}
|
||||
|
||||
.fancytree-node.ui-state-active {
|
||||
background: inherit !important;
|
||||
border:0;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.iob-list-icon, .instance-image {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
table.fancytree-ext-table>tbody>tr>td,
|
||||
.iob-list-table {
|
||||
border: @td-border !important;
|
||||
border-top: 0 !important; /*xxx*/
|
||||
white-space: nowrap;
|
||||
table-layout: fixed;
|
||||
&:extend(.iob-list-font);
|
||||
}
|
||||
table.fancytree-ext-table>thead>tr { /*border: 1px solid #D8D8D8 !important;*/
|
||||
border:0 !important;
|
||||
background: @list-header-background !important;
|
||||
}
|
||||
|
||||
table.fancytree-ext-table>tbody>tr>td {
|
||||
}
|
||||
|
||||
table.fancytree-ext-table>tbody>tr>td>table {
|
||||
height: 100% !important;
|
||||
}
|
||||
table.fancytree-ext-table>tbody>tr>td>table>tbody>tr>td {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
table.iob-list-table>tbody>tr {
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.panel-table { // global toolbar
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
border-spacing: 0;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
table.panel-table>tbody>tr>td {
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
.toolbar-button {
|
||||
width: @toolbar-size;
|
||||
height: @toolbar-size;
|
||||
border: @td-toolbar-border;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.toolbar-button-bg {
|
||||
.toolbar-button;
|
||||
background: @toolbar-background;
|
||||
}
|
||||
|
||||
.main-toolbar-table {
|
||||
.toolbar-frame;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
border-spacing: @toolbar-button-distance 0;
|
||||
position: relative;
|
||||
left: -@toolbar-button-distance;
|
||||
//padding-bottom: 0 !important;
|
||||
margin-bottom: @main-frame-distance;
|
||||
}
|
||||
table.ui-pg-table.main-toolbar-table {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
table.main-toolbar-table > tbody > tr {
|
||||
white-space: nowrap;
|
||||
}
|
||||
table.main-toolbar-table > tbody > tr > td:not(:first-child):last-child {
|
||||
width: auto !important;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
font-size: @toolbar-font-size;
|
||||
font-weight: normal;
|
||||
}
|
||||
table.main-toolbar-table > tbody > tr > td > button { //}, table.main-toolbar-table>tbody>tr>td>div {
|
||||
.toolbar-button !important;
|
||||
}
|
||||
|
||||
table.main-toolbar-table > tbody > tr > td > button:hover { //}, table.main-toolbar-table>tbody>tr>td>div {
|
||||
.toolbar-button !important;
|
||||
}
|
||||
table.main-toolbar-table > tbody > tr > td { //}, table.main-toolbar-table>tbody>tr>td>div {
|
||||
border: 1px solid transparent;
|
||||
padding-top: 0;
|
||||
padding-right: 0;
|
||||
padding-bottom: 0;
|
||||
width: @toolbar-size;
|
||||
height: @toolbar-size;
|
||||
padding-left: 0 !important; //new
|
||||
}
|
||||
|
||||
table.main-toolbar-table > tbody > tr > td:hover { //}, table.main-toolbar-table>tbody>tr>td>div {
|
||||
border: @toolbar-outer-hover;
|
||||
}
|
||||
table.main-toolbar-table > tbody > tr > td:not(:first-child):last-child:hover { //}, table.main-toolbar-table>tbody>tr>td>div {
|
||||
//border: 1px solid @iob-background;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
table.main-toolbar-table>tr>td {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
table.instance-table>thead>tr {
|
||||
background: @list-header-background !important;
|
||||
color: #000;
|
||||
text-align: left;
|
||||
font-weight: normal !important;
|
||||
}
|
||||
table.instance-table>thead>tr>th {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
||||
/* column filter header table ***************/
|
||||
.main-header-table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
height: @toolbar-size;
|
||||
margin-left: 1px;
|
||||
width: calc(~'100% - 4px'); //???
|
||||
background: @list-header-background;
|
||||
&:extend(.iob-font-12);
|
||||
|
||||
// List header
|
||||
.list-header-input {
|
||||
width: calc(~"100% - 1px");
|
||||
line-height: 1.5em;
|
||||
padding: 0 0 0 5px;
|
||||
font-family: "Segoe UI",Tahoma,Arial,"Courier New";
|
||||
font-size: .82rem;
|
||||
border: 0;
|
||||
height: 23px;
|
||||
background: transparent;
|
||||
}
|
||||
.list-header-clear {
|
||||
display: none;
|
||||
}
|
||||
th {
|
||||
font-weight: normal;
|
||||
}
|
||||
.list-header-text {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
th.filter-active {
|
||||
background: @toolbar-filter-active-background;
|
||||
}
|
||||
.filter-active {
|
||||
.list-header-input {
|
||||
width: calc(~"100% - 23px");
|
||||
}
|
||||
.list-header-clear {
|
||||
display: inline-block;
|
||||
width: 19px;
|
||||
height: 16px;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
margin-top: 3px;
|
||||
i {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
table.main-header-table>tbody>tr,
|
||||
table.main-header-table>thead>tr {
|
||||
height: @toolbar-size - 1px !important;
|
||||
margin-top: 1px;
|
||||
}
|
||||
table.main-header-table>tbody>tr>td,
|
||||
table.main-header-table>thead>tr>td,
|
||||
table.main-header-table>thead>tr>th {
|
||||
padding: 0 !important;
|
||||
border: @td-toolbar-border !important;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
.main-header-input-table,
|
||||
.panel-input-table {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
border-spacing: 0;
|
||||
border-radius: 2px;
|
||||
font-family: @iob-font;
|
||||
font-size: @list-font-size;
|
||||
table-layout: fixed;
|
||||
}
|
||||
.main-header-input-table>tbody>tr {
|
||||
background: @list-header-background;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr>td {
|
||||
vertical-align: middle;
|
||||
border: 0;
|
||||
padding: 0; /*?*/
|
||||
width: 100%; // neu
|
||||
}
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>input:hover,
|
||||
table.main-header-input-table>tbody>tr>td>select:hover {
|
||||
width: calc(~'100% - 0px');
|
||||
outline: @toolbar-outer-hover;
|
||||
outline-offset: -1px;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr>td>select:hover {
|
||||
width: calc(~'100% - 0px');
|
||||
background-position-x: calc(~'100% - 4px');
|
||||
|
||||
}
|
||||
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>button {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-top: (@header-height - 18px - 2) / 2;
|
||||
border: 0 !important;
|
||||
background: @list-header-background !important;
|
||||
display: none;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr.filter-active>td>button {
|
||||
display: unset;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr.filter-active>td>input,
|
||||
table.main-header-input-table>tbody>tr.filter-active>td>select,
|
||||
table.main-header-input-table>tbody>tr.filter-active,
|
||||
.input-not-empty {
|
||||
background-color: @toolbar-filter-active-background !important;
|
||||
}
|
||||
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>select>option {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>select,
|
||||
table.main-header-input-table>tbody>tr>td>input,
|
||||
table.main-header-input-table>tbody>tr>td>span {
|
||||
font-family: @iob-font;
|
||||
font-size: @list-font-size;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
height: (@header-height - 2px) !important; //xxxx
|
||||
}
|
||||
table.main-header-input-table>tbody>tr>td>input,
|
||||
table.main-header-input-table>tbody>tr>td>span {
|
||||
padding-left: @line-indent;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr>td>span {
|
||||
cursor: default;
|
||||
}
|
||||
table.main-header-input-table>tbody>tr>td>select {
|
||||
cursor: pointer;
|
||||
}
|
||||
#grid-instances-head>tr:first-child {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>select {
|
||||
line-height: (@header-height - 2px);
|
||||
width: calc(~'100% - 1px');
|
||||
}
|
||||
|
||||
table.main-header-input-table>tbody>tr>td>input {
|
||||
width: calc(~'100% - 1px');
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
table.main-header-input-table>tbody>tr>td.ui-search-input>input {
|
||||
top: unset !important;
|
||||
}
|
||||
#gview_grid-states table.main-header-input-table>tbody>tr>td.ui-search-clear>a {
|
||||
top: 3px !important;
|
||||
}
|
||||
/** main-header-input-table end **/
|
||||
/*******************************************/
|
||||
|
||||
.panel-input-table {
|
||||
width: auto;
|
||||
height: 20px;
|
||||
font-size: 14px;
|
||||
background: @toolbar-background;
|
||||
border: @td-toolbar-border;
|
||||
}
|
||||
|
||||
.panel-input-table:hover {
|
||||
border: 1px solid #c0c0c0;
|
||||
}
|
||||
|
||||
.panel-button {
|
||||
width: @toolbar-size !important;
|
||||
height: @toolbar-size;
|
||||
border:0; /*?*/
|
||||
margin:0; /*?*/
|
||||
}
|
||||
|
||||
.toolbar-icon-text-button {
|
||||
width: 100% !important;
|
||||
padding-left: 20px !important;
|
||||
font-size: 12px;
|
||||
vertical-align: middle;
|
||||
padding-top: 3px !important;
|
||||
padding-right: 5px !important;
|
||||
}
|
||||
|
||||
.list-column-header-filter {
|
||||
font-size: @list-font-size;
|
||||
line-height: 1.5em;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
||||
.ui-widget-content {
|
||||
background: #efefef;
|
||||
}
|
||||
|
||||
.td-button-width, .td-button, .clippy-button, .td-button-placeholder {
|
||||
width: @td-button-size;
|
||||
}
|
||||
|
||||
.td-button-placeholder {
|
||||
height: 1px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.td-button, .clippy-button {
|
||||
height: @td-button-size;
|
||||
margin:0;
|
||||
position: relative;
|
||||
bottom: 1px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.toolbar-button-table {
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
|
||||
.fancytree-title {
|
||||
padding-left: @line-indent !important;
|
||||
display: inline-flex !important;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.iob-list-font>tbody>tr>td>span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.vertical-center {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%); /* or try 50% */
|
||||
}
|
||||
|
||||
@corner-radius: unset;
|
||||
/* Corner radius */
|
||||
.ui-corner-all,
|
||||
.ui-corner-top,
|
||||
.ui-corner-left,
|
||||
.ui-corner-tl {
|
||||
border-top-left-radius: @corner-radius;
|
||||
}
|
||||
.ui-corner-all,
|
||||
.ui-corner-top,
|
||||
.ui-corner-right,
|
||||
.ui-corner-tr {
|
||||
border-top-right-radius: @corner-radius;
|
||||
}
|
||||
.ui-corner-all,
|
||||
.ui-corner-bottom,
|
||||
.ui-corner-left,
|
||||
.ui-corner-bl {
|
||||
border-bottom-left-radius: @corner-radius;
|
||||
}
|
||||
.ui-corner-all,
|
||||
.ui-corner-bottom,
|
||||
.ui-corner-right,
|
||||
.ui-corner-br {
|
||||
border-bottom-right-radius: @corner-radius;
|
||||
}
|
||||
|
||||
.ui-corner-all {
|
||||
border: @corner-radius;
|
||||
}
|
||||
|
||||
|
||||
.fancytree-title {
|
||||
padding-bottom: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
border:0 !important;
|
||||
}
|
||||
|
||||
|
||||
table.iob-list-font>tbody>tr {
|
||||
height: 25px !important;
|
||||
}
|
||||
|
||||
table.iob-list-font>tbody>tr>td>table>tbody>tr:hover {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
|
||||
table.iob-list-font>tbody>tr>td {
|
||||
}
|
||||
|
||||
#inhalte-werden-zentriert {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.iob-ellipsis {
|
||||
width: calc(~'100% - ' @line-indent);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.objects-list-table .iob-ellipsis {
|
||||
padding-left: @line-indent;
|
||||
padding-right: @line-indent;
|
||||
}
|
||||
|
||||
|
||||
.iob-toolbar-sep () { // for a td
|
||||
width: @toolbar-button-distance * 2 !important;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.main-toolbar-table>tbody>tr>td.iob-toolbar-sep {
|
||||
.iob-toolbar-sep;
|
||||
}
|
||||
|
||||
.main-toolbar-table>tbody>tr>td.select-id-custom-buttons {
|
||||
.iob-toolbar-sep;
|
||||
}
|
||||
|
||||
span.dark-blue {
|
||||
color: #009;
|
||||
}
|
||||
span.dark-green {
|
||||
color: #090;
|
||||
}
|
||||
|
||||
div#dialog-select-member>div:first-child {
|
||||
height: calc(~'100vh - 150px') !important;
|
||||
}
|
||||
|
||||
div#dialog-select-member .main-toolbar-table {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.main-header-input-table select{
|
||||
padding-left: 5px !important;
|
||||
font-size: 16px;
|
||||
line-height: (@header-height - 2px);
|
||||
background: url("../img/arrow-down-10x10.png") no-repeat right #fff;
|
||||
-webkit-appearance: none;
|
||||
background-position-x: calc(~'100% - 3px');
|
||||
background-size: 10px;
|
||||
}
|
||||
|
||||
span.select-id-cnt {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 5px;
|
||||
font-size: smaller;
|
||||
color: lightslategray;
|
||||
}
|
||||
|
||||
.grid-objects-head,
|
||||
.grid-objects-head tr.ui-widget-header th {
|
||||
line-height: 1.6em !important;
|
||||
background-color: #e0e0e0;
|
||||
text-align: left;
|
||||
color: #000;
|
||||
font-size: @list-font-size !important;
|
||||
}
|
||||
|
||||
// loader
|
||||
.loader {
|
||||
width: calc(~"100% - 50px");
|
||||
text-align: center;
|
||||
.spinner {
|
||||
animation: rotator @duration linear infinite;
|
||||
}
|
||||
|
||||
.path {
|
||||
stroke-dasharray: @offset;
|
||||
stroke-dashoffset: 0;
|
||||
transform-origin: center;
|
||||
stroke: #4285F4;
|
||||
animation: dash @duration ease-in-out infinite;
|
||||
//colors (@duration*4) ease-in-out infinite;
|
||||
}
|
||||
}
|
||||
|
||||
.main-toolbar-table {
|
||||
position: relative;
|
||||
.select-id-custom-buttons {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user