Commit 44c8e547 authored by asseldonk's avatar asseldonk
Browse files

Improve readability of less file for symbol view

parent 6e0c1f4d
.file-view-symbol.icon-large .symbol-icon-p,.file-view-symbol.icon-medium .symbol-icon-p,.file-view-symbol.icon-small .symbol-icon-p,.file-view-symbol.icon-tiny .symbol-icon-p{text-align:center;display:inline-block;z-index:-1;padding:0}
.file-view-symbol .file-node:hover>.file-properties,.file-view-symbol .file-node[selected]>.file-properties,.file-view-symbol .file-selection-p{visibility:visible}
.file-view-symbol{position:absolute;top:40px;left:0;bottom:0;overflow:auto;-webkit-user-select:none;user-select:none;float:left}
.file-view-symbol.file-list{width:100%}
.file-view-symbol.file-list.dragover{box-shadow:0 0 20px #5cb85c inset}
.file-view-symbol.file-list.dragover>.node{background-color:transparent!important}
.file-view-symbol.file-list.gear-wheel-disable .glyphicon-cog{opacity:0}
.file-view-symbol.icon-tiny .file-node{margin:5px;width:80px;height:68px}
.file-view-symbol.icon-tiny .symbol-icon-p{margin-top:-35px;-webkit-user-select:none;font-size:24px;width:80px}
.file-view-symbol.icon-tiny .symbol-name{width:80px}
.file-view-symbol.icon-tiny .file-selection-box{left:12px}
.file-view-symbol.icon-large .file-selection-box,.file-view-symbol.icon-medium .file-selection-box,.file-view-symbol.icon-small .file-selection-box{left:20px}
.file-view-symbol.icon-tiny .file-properties{margin-top:-9px;top:10px}
.file-view-symbol.icon-small .file-node{margin:2px 4px;width:100px;height:85px}
.file-view-symbol.icon-small .symbol-icon-p{margin-top:-35px;-webkit-user-select:none;font-size:30px;width:100px}
.file-view-symbol.icon-small .symbol-name{width:100px}
.file-view-symbol.icon-small .file-properties{margin-top:1px;top:0}
.file-view-symbol.icon-medium .file-node{margin:8px;width:110px;height:90px}
.file-view-symbol.icon-medium .symbol-icon-p{margin-top:-23px;-webkit-user-select:none;font-size:38px;width:110px}
.file-view-symbol.icon-medium .symbol-name{width:110px}
.file-view-symbol.icon-medium .file-properties{margin-top:1px;top:0}
.file-view-symbol.icon-large .file-node{margin:12px;width:116px;height:100px}
.file-view-symbol.icon-large .symbol-icon-p{margin-top:-24px;-webkit-user-select:none;font-size:46px;width:116px}
.file-view-symbol.icon-large .symbol-name{width:116px}
.file-view-symbol.icon-large .file-properties{margin-top:1px;top:0}
.file-view-symbol .file-node{border-radius:5px;float:left;-webkit-user-select:none}
.file-view-symbol .file-node[draggable=true]{cursor:move;-khtml-user-drag:element}
.file-view-symbol .file-node:hover{background-color:#f5f5f5;cursor:pointer}
.file-view-symbol .file-node[selected]{background-color:#D2D2D2;color:#fff}
.file-view-symbol .file-node.dragstart{opacity:.4}
.file-view-symbol .file-node.dragover{background-color:rgba(92,184,92,.5)!important}
.file-view-symbol .file-selection-p{display:inherit;margin:0 0 0 4px;position:relative;-webkit-user-select:none}
.file-view-symbol .symbol-name{-webkit-hyphens:auto;-moz-hyphens:auto;display:inline-block;font-family:'Trebuchet MS',Helvetica,Arial,sans-serif;font-size:13px;font-weight:400;margin-top:-5px;margin-bottom:0;overflow:hidden;text-align:center;word-wrap:break-word;-webkit-user-select:none}
.file-view-symbol .file-selection-box{position:absolute;top:2px;visibility:visible;-webkit-user-select:none;content:''}
.file-view-symbol .file-selection-box span{background:url(../../../../img/white_plus.png)center no-repeat green;border-radius:8px;display:block;height:16px;width:16px;-webkit-user-select:none}
.file-view-symbol .file-selection-box input{display:none}
.file-view-symbol .file-selection-box input:checked+span{background:url(../../../../img/white_minus.png)center no-repeat red}
.file-view-symbol .file-properties{visibility:hidden;float:right;margin-right:3px;-webkit-user-select:none}
\ No newline at end of file
.file-view-symbol {
position: absolute;
top: 40px;
left: 0;
bottom: 0;
overflow: auto;
-webkit-user-select: none;
user-select: none;
float: left;
}
.file-view-symbol.file-list {
width: 100%;
}
.file-view-symbol.file-list.dragover {
box-shadow: 0px 0px 20px #5cb85c inset;
}
.file-view-symbol.file-list.dragover > .node {
background-color: rgba(0, 0, 0, 0) !important;
}
.file-view-symbol.file-list.gear-wheel-disable .glyphicon-cog {
opacity: 0.0;
}
.file-view-symbol.icon-tiny .file-node {
margin: 5px;
}
.file-view-symbol.icon-tiny .file-node {
width: 80px;
height: 68px;
}
.file-view-symbol.icon-tiny .symbol-icon-p {
margin-top: -35px;
display: inline-block;
text-align: center;
z-index: -1;
padding: 0;
-webkit-user-select: none;
font-size: 24px;
width: 80px;
}
.file-view-symbol.icon-tiny .symbol-name {
width: 80px;
}
.file-view-symbol.icon-tiny .file-selection-box {
left: 12px;
}
.file-view-symbol.icon-tiny .file-properties {
margin-top: -9px;
top: 10px;
}
.file-view-symbol.icon-small .file-node {
margin: 2px 4px 2px 4px;
}
.file-view-symbol.icon-small .file-node {
width: 100px;
height: 85px;
}
.file-view-symbol.icon-small .symbol-icon-p {
margin-top: -35px;
display: inline-block;
text-align: center;
z-index: -1;
padding: 0;
-webkit-user-select: none;
font-size: 30px;
width: 100px;
}
.file-view-symbol.icon-small .symbol-name {
width: 100px;
}
.file-view-symbol.icon-small .file-selection-box {
left: 20px;
}
.file-view-symbol.icon-small .file-properties {
margin-top: 1px;
top: 0px;
}
.file-view-symbol.icon-medium .file-node {
margin: 8px;
}
.file-view-symbol.icon-medium .file-node {
width: 110px;
height: 90px;
}
.file-view-symbol.icon-medium .symbol-icon-p {
margin-top: -23px;
display: inline-block;
text-align: center;
z-index: -1;
padding: 0;
-webkit-user-select: none;
font-size: 38px;
width: 110px;
}
.file-view-symbol.icon-medium .symbol-name {
width: 110px;
}
.file-view-symbol.icon-medium .file-selection-box {
left: 20px;
}
.file-view-symbol.icon-medium .file-properties {
margin-top: 1px;
top: 0px;
}
.file-view-symbol.icon-large .file-node {
margin: 12px;
}
.file-view-symbol.icon-large .file-node {
width: 116px;
height: 100px;
}
.file-view-symbol.icon-large .symbol-icon-p {
margin-top: -24px;
display: inline-block;
text-align: center;
z-index: -1;
padding: 0;
-webkit-user-select: none;
font-size: 46px;
width: 116px;
}
.file-view-symbol.icon-large .symbol-name {
width: 116px;
}
.file-view-symbol.icon-large .file-selection-box {
left: 20px;
}
.file-view-symbol.icon-large .file-properties {
margin-top: 1px;
top: 0px;
}
.file-view-symbol .file-node {
border-radius: 5px;
float: left;
-webkit-user-select: none;
}
.file-view-symbol .file-node[draggable=true] {
cursor: move;
-khtml-user-drag: element;
}
.file-view-symbol .file-node:hover {
background-color: #f5f5f5;
cursor: pointer;
}
.file-view-symbol .file-node:hover > .file-properties {
visibility: visible;
}
.file-view-symbol .file-node[selected] {
background-color: #D2D2D2;
color: white;
}
.file-view-symbol .file-node[selected] > .file-properties {
visibility: visible;
}
.file-view-symbol .file-node.dragstart {
opacity: 0.4;
}
.file-view-symbol .file-node.dragover {
background-color: rgba(92, 184, 92, 0.5) !important;
}
.file-view-symbol .file-selection-p {
display: inherit;
margin: 0 0 0 4px;
position: relative;
visibility: visible;
-webkit-user-select: none;
}
.file-view-symbol .symbol-name {
-webkit-hyphens: auto;
-moz-hyphens: auto;
display: inline-block;
font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;
font-size: 13px;
font-weight: normal;
margin-top: -5px;
margin-bottom: 0;
overflow: hidden;
text-align: center;
word-wrap: break-word;
-webkit-user-select: none;
}
.file-view-symbol .file-selection-box {
position: absolute;
top: 2px;
visibility: visible;
-webkit-user-select: none;
content: '';
}
.file-view-symbol .file-selection-box span {
background: green url("../../../../img/white_plus.png") no-repeat center;
border-radius: 8px;
display: block;
height: 16px;
width: 16px;
-webkit-user-select: none;
}
.file-view-symbol .file-selection-box input {
display: none;
}
.file-view-symbol .file-selection-box input:checked + span {
background: red url("../../../../img/white_minus.png") no-repeat center;
}
.file-view-symbol .file-properties {
visibility: hidden;
float: right;
margin-right: 3px;
-webkit-user-select: none;
}
@symbol-bg-hover: #f5f5f5;
@brand-success: #5cb85c;
@brand-danger: #d9534f;
@default-file-symbol-node-width: 100px;
@file-symbol-node-width-tiny: @default-file-symbol-node-width * 0.8;
@file-symbol-node-width-small: @default-file-symbol-node-width;
@file-symbol-node-width-medium: @default-file-symbol-node-width + 10;
@file-symbol-node-width-large: @default-file-symbol-node-width + 16;
@default-file-symbol-node-height: 85px;
@file-symbol-node-height-tiny: @default-file-symbol-node-height * 0.8;
@file-symbol-node-height-small: @default-file-symbol-node-height;
@file-symbol-node-height-medium: @default-file-symbol-node-height + 5;
@file-symbol-node-height-large: @default-file-symbol-node-height + 15;
@default-file-symbol-font-size: 30px;
@file-symbol-font-size-tiny: @default-file-symbol-font-size * 0.8;
@file-symbol-font-size-small: @default-file-symbol-font-size;
@file-symbol-font-size-medium: @default-file-symbol-font-size + 8;
@file-symbol-font-size-large: @default-file-symbol-font-size + 16;
@file-symbol-icon-margin-top-tiny: -35px;
@file-symbol-icon-margin-top-small: -35px;
@file-symbol-icon-margin-top-medium: -23px;
@file-symbol-icon-margin-top-large: -24px;
@file-symbol-selectionbox-left-tiny: 12px;
@file-symbol-selectionbox-left-small: 20px;
@file-symbol-selectionbox-left-medium: 20px;
@file-symbol-selectionbox-left-large: 20px;
@symbol-bg-hover : #f5f5f5;
@brand-success : #5cb85c;
@brand-danger : #d9534f;
@default-file-symbol-node-width : 100px;
@file-symbol-node-width-tiny : @default-file-symbol-node-width * 0.8;
@file-symbol-node-width-small : @default-file-symbol-node-width;
@file-symbol-node-width-medium : @default-file-symbol-node-width + 10;
@file-symbol-node-width-large : @default-file-symbol-node-width + 16;
@default-file-symbol-node-height : 85px;
@file-symbol-node-height-tiny : @default-file-symbol-node-height * 0.8;
@file-symbol-node-height-small : @default-file-symbol-node-height;
@file-symbol-node-height-medium : @default-file-symbol-node-height + 5;
@file-symbol-node-height-large : @default-file-symbol-node-height + 15;
@default-file-symbol-font-size : 30px;
@file-symbol-font-size-tiny : @default-file-symbol-font-size * 0.8;
@file-symbol-font-size-small : @default-file-symbol-font-size;
@file-symbol-font-size-medium : @default-file-symbol-font-size + 8;
@file-symbol-font-size-large : @default-file-symbol-font-size + 16;
@file-symbol-icon-margin-top-tiny : -35px;
@file-symbol-icon-margin-top-small : -35px;
@file-symbol-icon-margin-top-medium : -23px;
@file-symbol-icon-margin-top-large : -24px;
@file-symbol-selectionbox-left-tiny : 12px;
@file-symbol-selectionbox-left-small : 20px;
@file-symbol-selectionbox-left-medium : 20px;
@file-symbol-selectionbox-left-large : 20px;
.icon-size (@size) {
@font-size: 'file-symbol-font-size-@{size}';
@node-width: 'file-symbol-node-width-@{size}';
@node-height: 'file-symbol-node-height-@{size}';
@margin-top: 'file-symbol-icon-margin-top-@{size}';
@font-size : 'file-symbol-font-size-@{size}';
@node-width : 'file-symbol-node-width-@{size}';
@node-height : 'file-symbol-node-height-@{size}';
@margin-top : 'file-symbol-icon-margin-top-@{size}';
.file-node {
width: @@node-width;
height: @@node-height;
width : @@node-width;
height : @@node-height;
}
.symbol-icon-p {
margin-top: @@margin-top;
display: inline-block;
text-align: center;
z-index: -1;
padding: 0;
-webkit-user-select: none;
font-size: @@font-size;
width: @@node-width;
margin-top : @@margin-top;
display : inline-block;
text-align : center;
z-index : -1;
padding : 0;
-webkit-user-select : none;
font-size : @@font-size;
width : @@node-width;
}
.symbol-name {
width: @@node-width;
......@@ -55,19 +56,19 @@
}
.properties-position (@margin) {
.file-properties {
margin-top: @margin;
top: 1 - @margin;
margin-top : @margin;
top : 1 - @margin;
}
}
.file-view-symbol {
position: absolute;
top: 40px;
left: 0;
bottom: 0;
overflow: auto;
-webkit-user-select: none;
user-select: none;
float: left;
position : absolute;
top : 40px;
left : 0;
bottom : 0;
overflow : auto;
-webkit-user-select : none;
user-select : none;
float : left;
&.file-list {
width: 100%;
&.dragover{
......@@ -115,23 +116,23 @@
.properties-position(1px);
}
.file-node {
border-radius: 5px;
float: left;
-webkit-user-select: none;
border-radius : 5px;
float : left;
-webkit-user-select : none;
&[draggable=true] {
cursor: move;
-khtml-user-drag: element;
cursor : move;
-khtml-user-drag : element;
}
&:hover {
background-color: @symbol-bg-hover;
cursor: pointer;
background-color : @symbol-bg-hover;
cursor : pointer;
> .file-properties {
visibility: visible;
}
}
&[selected] {
background-color: #D2D2D2;
color: white;
background-color : #D2D2D2;
color : white;
> .file-properties {
visibility: visible;
}
......@@ -144,39 +145,39 @@
}
}
.file-selection-p {
display: inherit;
margin: 0 0 0 4px;
position: relative;
visibility: visible;
-webkit-user-select: none;
display : inherit;
margin : 0 0 0 4px;
position : relative;
visibility : visible;
-webkit-user-select : none;
}
.symbol-name {
-webkit-hyphens: auto;
-moz-hyphens: auto;
display: inline-block;
font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;
font-size: 13px;
font-weight: normal;
margin-top: -5px;
margin-bottom: 0;
overflow: hidden;
text-align: center;
word-wrap: break-word;
-webkit-user-select: none;
-webkit-hyphens : auto;
-moz-hyphens : auto;
display : inline-block;
font-family : 'Trebuchet MS', Helvetica, Arial, sans-serif;
font-size : 13px;
font-weight : normal;
margin-top : -5px;
margin-bottom : 0;
overflow : hidden;
text-align : center;
word-wrap : break-word;
-webkit-user-select : none;
}
.file-selection-box {
position: absolute;
top: 2px;
visibility: visible;
-webkit-user-select: none;
content: '';
position : absolute;
top : 2px;
visibility : visible;
-webkit-user-select : none;
content : '';
span {
background: green url("../../../../img/white_plus.png") no-repeat center;
border-radius: 8px;
display: block;
height: 16px;
width: 16px;
-webkit-user-select: none;
background : green url("../../../../img/white_plus.png") no-repeat center;
border-radius : 8px;
display : block;
height : 16px;
width : 16px;
-webkit-user-select : none;
}
input {
display: none;
......@@ -186,9 +187,9 @@
}
}
.file-properties {
visibility: hidden;
float: right;
margin-right: 3px;
-webkit-user-select: none;
visibility : hidden;
float : right;
margin-right : 3px;
-webkit-user-select : none;
}
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment