[multiscaling] repaired some components

This commit is contained in:
Maxim Kadushkin 2021-01-21 13:14:36 +03:00
parent edca282ea7
commit 4412524e82
14 changed files with 93 additions and 213 deletions

View file

@ -89,7 +89,11 @@
--pixel-ratio-factor: 1;
.pixel-ratio__1_5 {
--pixel-ratio-factor: 1.5;
@ratio: 1.5;
@one-px: 1px / @ratio;
--pixel-ratio-factor: @ratio;
--scaled-one-pixel: @one-px;
}
}

View file

@ -37,3 +37,75 @@ label {
.user-select {
.user-select(text);
}
.tool-menu {
height: 100%;
display: block;
&.left {
overflow: hidden;
.tool-menu-btns {
border-right: @scaled-one-px-value solid @gray-dark;
}
}
&.right {
.tool-menu-btns {
//position: absolute;
border-left: @scaled-one-px-value solid @gray-dark;
background-color: @gray-light;
right: 0;
overflow: hidden;
}
}
}
.tool-menu-btns {
width: 40px;
height: 100%;
display: inline-block;
position: absolute;
padding-top: 15px;
button {
margin-bottom: 8px;
}
}
.left-panel {
padding-left: 40px;
height: 100%;
border-right: @scaled-one-px-value solid @gray-dark;
#left-panel-chat {
height: 100%;
}
#left-panel-comments {
height: 100%;
}
}
.right-panel {
width: 220px;
height: 100%;
display: none;
padding: 0 10px 0 15px;
position: relative;
overflow: hidden;
border-left: @scaled-one-px-value solid @gray-dark;
line-height: 15px;
}
.statusbar {
height: 25px;
background-color: @gray-light;
.box-inner-shadow(0 @scaled-one-px-value 0 @gray-dark);
.status-label {
font-weight: bold;
color: @gray-deep;
white-space: nowrap;
}
}

View file

@ -2,6 +2,7 @@
// Global values
// --------------------------------------------------
@pixel-ratio-factor: var(--pixel-ratio-factor);
@scaled-one-px-value: var(--scaled-one-pixel, 1px);
// Paths
// -------------------------

View file

@ -1,41 +1,5 @@
.tool-menu {
height: 100%;
display: block;
&.left {
overflow: hidden;
.tool-menu-btns {
//border-right: 1px solid @gray-dark;
.adaptive-solid-border(1px, @gray-dark, right);
}
}
}
.tool-menu-btns {
width: 40px;
height: 100%;
display: inline-block;
position: absolute;
padding-top: 15px;
button {
margin-bottom: 8px;
}
}
.left-panel {
padding-left: 40px;
height: 100%;
//border-right: 1px solid @gray-dark;
.adaptive-solid-border(1px, @gray-dark, right);
#left-panel-chat {
height: 100%;
}
#left-panel-comments {
height: 100%;
}
#left-panel-history {
height: 100%;
}

View file

@ -1,27 +1,4 @@
.tool-menu.right {
.tool-menu-btns {
position: absolute;
//border-left: 1px solid @gray-dark;
.adaptive-solid-border(1px, @gray-dark, left);
background-color: @gray-light;
right: 0;
overflow: hidden;
}
}
.right-panel {
width: 220px;
height: 100%;
display: none;
padding: 0 10px 0 15px;
position: relative;
overflow: hidden;
//border-left: 1px solid @gray-dark;
.adaptive-solid-border(1px, @gray-dark, left);
line-height: 15px;
}
.settings-panel {
display: none;
overflow: visible;

View file

@ -1,15 +1,8 @@
.statusbar {
display: table;
padding: 2px;
height: 25px;
background-color: @gray-light;
//.box-inner-shadow(0 1px 0 @gray-dark);
.adaptive-box-shadow(~'inset 0 %1 0 @{gray-dark}', 1px);
.status-label {
font-weight: bold;
color: @gray-deep;
white-space: nowrap;
position: relative;
top: 1px;
}

View file

@ -1,15 +1,3 @@
.tool-menu {
height: 100%;
display: block;
&.left {
overflow: hidden;
.tool-menu-btns {
border-right: 1px solid @gray-dark;
}
}
}
#left-menu {
&+.layout-resizer {
@ -24,31 +12,6 @@
}
}
.tool-menu-btns {
width: 40px;
height: 100%;
display: inline-block;
position: absolute;
padding-top: 15px;
button {
margin-bottom: 8px;
}
}
.left-panel {
padding-left: 40px;
height: 100%;
border-right: 1px solid @gray-dark;
#left-panel-chat {
height: 100%;
}
#left-panel-comments {
height: 100%;
}
}
.left-menu-full-ct {
width: 100%;
height: 100%;

View file

@ -1,25 +1,4 @@
.tool-menu.right {
.tool-menu-btns {
position: absolute;
border-left: 1px solid @gray-dark;
background-color: @gray-light;
right: 0;
overflow: hidden;
}
}
.right-panel {
width: 220px;
height: 100%;
display: none;
padding: 0 10px 0 15px;
position: relative;
overflow: hidden;
border-left: 1px solid @gray-dark;
line-height: 15px;
}
.settings-panel {
display: none;
overflow: visible;

View file

@ -1,14 +1,8 @@
.statusbar {
display: table;
padding: 2px;
height: 25px;
background-color: @gray-light;
.box-inner-shadow(0 1px 0 @gray-dark);
.status-label {
font-weight: bold;
color: @gray-deep;
white-space: nowrap;
position: relative;
top: 1px;
}

View file

@ -185,7 +185,7 @@ define([
onLayoutResize: function(o, r) {
if (r == 'cell:edit') {
if (this.editor.$el.height() > 19) {
if (Math.floor(this.editor.$el.height()) > 19) {
if (!this.editor.$btnexpand.hasClass('btn-collapse'))
this.editor.$btnexpand['addClass']('btn-collapse');
o && Common.localStorage.setItem('sse-celleditor-height', this.editor.$el.height());
@ -225,7 +225,7 @@ define([
},
expandEditorField: function() {
if (this.editor.$el.height() > 19) {
if ( Math.floor(this.editor.$el.height()) > 19) {
this.editor.keep_height = this.editor.$el.height();
this.editor.$el.height(19);
this.editor.$btnexpand['removeClass']('btn-collapse');

View file

@ -1,13 +1,13 @@
#cell-editing-box {
border-bottom: solid 1px @gray-dark;
border-left: solid 1px @gray-dark;
border-bottom: solid @scaled-one-px-value @gray-dark;
border-left: solid @scaled-one-px-value @gray-dark;
min-height: 20px;
background-color: #fff;
.ce-group-name {
float: left;
height: 20px;
border-bottom: 1px solid @gray-dark;
border-bottom: @scaled-one-px-value solid @gray-dark;
background-color: @gray-light;
#ce-cell-name {
@ -17,7 +17,7 @@
vertical-align: top;
display: inline-block;
border: 0 none;
border-right: 1px solid @gray-dark;
border-right: @scaled-one-px-value solid @gray-dark;
transition: none;
-webkit-transition: none;
@ -75,7 +75,7 @@
padding-left: 1px;
margin: 0 16px 0 120px;
height: 100%;
border-left: 1px solid @gray-dark;
border-left: @scaled-one-px-value solid @gray-dark;
#ce-cell-content {
height: 100%;

View file

@ -1,15 +1,3 @@
.tool-menu {
height: 100%;
display: block;
&.left {
overflow: hidden;
.tool-menu-btns {
border-right: 1px solid @gray-dark;
}
}
}
#left-menu {
&+.layout-resizer {
@ -24,31 +12,6 @@
}
}
.tool-menu-btns {
width: 40px;
height: 100%;
display: inline-block;
position: absolute;
padding-top: 15px;
button {
margin-bottom: 8px;
}
}
.left-panel {
padding-left: 40px;
height: 100%;
border-right: 1px solid @gray-dark;
#left-panel-chat {
height: 100%;
}
#left-panel-comments {
height: 100%;
}
}
.left-menu-full-ct {
width: 100%;
height: 100%;

View file

@ -1,25 +1,4 @@
.tool-menu.right {
.tool-menu-btns {
position: absolute;
border-left: 1px solid @gray-dark;
background-color: @gray-light;
right: 0;
overflow: hidden;
}
}
.right-panel {
width: 220px;
height: 100%;
display: none;
padding: 0 10px 0 15px;
position: relative;
overflow: hidden;
border-left: 1px solid @gray-dark;
line-height: 15px;
}
.settings-panel {
display: none;
overflow: visible;

View file

@ -1,8 +1,5 @@
.statusbar {
padding: 0 2px 0;
height: 25px;
background-color: @gray-light;
.box-inner-shadow(0 1px 0 @gray-dark);
z-index: 500;
#status-tabs-scroll {
@ -96,7 +93,7 @@
height: 12px;
display: inline-block;
vertical-align: middle;
border: 1px solid @gray-dark;
border: @scaled-one-px-value solid @gray-dark;
}
.name {
@ -114,8 +111,8 @@
#status-addtabs-box {
float: left;
padding: 3px 8px 0 8px;
border-left: 1px solid @gray-dark;
border-right: 1px solid @gray-dark;
border-left: @scaled-one-px-value solid @gray-dark;
border-right: @scaled-one-px-value solid @gray-dark;
height: 25px;
}
@ -180,9 +177,9 @@
margin-right: -1px;
background-color: @gray-light;
outline: none;
border-left: 1px solid @gray-dark;
border-right: 1px solid @gray-dark;
border-top: 1px solid @gray-dark;
border-left: @scaled-one-px-value solid @gray-dark;
border-right: @scaled-one-px-value solid @gray-dark;
border-top: @scaled-one-px-value solid @gray-dark;
&:hover {
border-top-color: @gray-dark;
@ -316,12 +313,6 @@
}
}
.status-label {
font-weight: bold;
color: @gray-deep;
white-space: nowrap;
}
.btn-tpl(@top-position) {
.btn-icon {
background-position: 0 @top-position;