[scaling] repaired some elements

This commit is contained in:
Maxim Kadushkin 2021-01-22 00:18:15 +03:00
parent 4412524e82
commit 8e81a7b0e1
14 changed files with 127 additions and 272 deletions

View file

@ -363,6 +363,10 @@
width: 14px; width: 14px;
height: 3px; height: 3px;
background-color: red; background-color: red;
.pixel-ratio__1_5 & {
height: 4px;
}
} }
} }
@ -547,17 +551,15 @@
.btn-color { .btn-color {
width: 45px; width: 45px;
height: 22px; height: 22px;
padding: 1px 11px 1px 1px; padding: @scaled-one-px-value 11px @scaled-one-px-value @scaled-one-px-value;
//border:1px solid @input-border; border:@scaled-one-px-value solid @input-border;
.adaptive-solid-border(1px, @input-border);
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
span:nth-child(1) { span:nth-child(1) {
float: left; float: left;
width: 100%; width: 100%;
height: 100%; height: 100%;
//border: 1px solid rgba(0, 0, 0, 0.2); border: @scaled-one-px-value solid rgba(0, 0, 0, 0.2);
.adaptive-solid-border(1px, rgba(0, 0, 0, 0.2));
background-color: transparent; background-color: transparent;
} }
@ -640,8 +642,7 @@
width: 75px; width: 75px;
height: 22px; height: 22px;
background: @input-bg; background: @input-bg;
//border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
.adaptive-solid-border(1px, @input-border);
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
&.auto { &.auto {
@ -672,7 +673,7 @@
width: 100%; width: 100%;
height: 22px; height: 22px;
background: @input-bg; background: @input-bg;
border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
button { button {
@ -706,7 +707,7 @@
width: 75px; width: 75px;
height: 22px; height: 22px;
background: @input-bg; background: @input-bg;
border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
&.dropdown-toggle { &.dropdown-toggle {
@ -739,7 +740,7 @@
width: 45px; width: 45px;
height: 22px; height: 22px;
background: @input-bg; background: @input-bg;
border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
.icon { .icon {
@ -779,7 +780,7 @@
margin:0; margin:0;
box-shadow: none; box-shadow: none;
background-color: @input-bg; background-color: @input-bg;
border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
.border-radius(@border-radius-small); .border-radius(@border-radius-small);
&.template-table { &.template-table {
@ -804,7 +805,7 @@
margin-right: 3px; margin-right: 3px;
background-color: transparent; background-color: transparent;
background-repeat: no-repeat; background-repeat: no-repeat;
border: 1px solid @input-border; border: @scaled-one-px-value solid @input-border;
position: relative; position: relative;
} }

View file

@ -13,8 +13,7 @@
width: 14px; width: 14px;
height: 14px; height: 14px;
background: #fff; background: #fff;
//border: 1px solid @gray; border: @scaled-one-px-value solid @gray;
.adaptive-solid-border(1px, @gray);
border-radius: 2px; border-radius: 2px;
position: absolute; position: absolute;
left: 0; left: 0;
@ -43,8 +42,7 @@
&::before { &::before {
content: ''; content: '';
position: absolute; position: absolute;
//border: 1px solid @gray-deep; border: @scaled-one-px-value solid @gray-deep;
.adaptive-solid-border(1px, @gray-deep);
background: @gray-soft; background: @gray-soft;
width: 8px; width: 8px;
height: 8px; height: 8px;

View file

@ -14,7 +14,7 @@
right: 0; right: 0;
bottom: 45px; bottom: 45px;
height: 300px; height: 300px;
border-bottom: 1px solid @gray-dark; border-bottom: @scaled-one-px-value solid @gray-dark;
&.stretch { &.stretch {
border-bottom: none; border-bottom: none;
@ -35,7 +35,7 @@
color: @black; color: @black;
font: 12px arial; font: 12px arial;
line-height: normal; line-height: normal;
border-bottom: 1px dotted @black; border-bottom: @scaled-one-px-value dotted @black;
padding-top: 12px; padding-top: 12px;
outline: none; outline: none;
height: 29px; height: 29px;
@ -58,7 +58,7 @@
width: 100%; width: 100%;
resize: none; resize: none;
margin-bottom: 5px; margin-bottom: 5px;
border: 1px solid @gray-dark; border: @scaled-one-px-value solid @gray-dark;
height: 100%; height: 100%;
&:focus { &:focus {
border-color: @gray-darker; border-color: @gray-darker;
@ -90,7 +90,7 @@
height: 50px; height: 50px;
resize: none; resize: none;
margin-bottom: 5px; margin-bottom: 5px;
border: 1px solid @gray-dark; border: @scaled-one-px-value solid @gray-dark;
word-break: break-all; word-break: break-all;
line-height: 15px; line-height: 15px;
color: @gray-deep; color: @gray-deep;
@ -109,7 +109,7 @@
} }
.separator-cmt { .separator-cmt {
border-bottom: 1px solid @gray-dark; border-bottom: @scaled-one-px-value solid @gray-dark;
margin: 20px 0px 0px 0px; margin: 20px 0px 0px 0px;
} }
@ -133,7 +133,7 @@
.color { .color {
width: 12px; width: 12px;
height: 12px; height: 12px;
border: 1px solid @gray-dark; border: @scaled-one-px-value solid @gray-dark;
margin: 0 5px 3px 0; margin: 0 5px 3px 0;
vertical-align: middle; vertical-align: middle;
} }
@ -170,7 +170,7 @@
font-style: italic; font-style: italic;
margin-top: 10px; margin-top: 10px;
padding: 0px 5px 5px 5px; padding: 0px 5px 5px 5px;
border-left: 1px solid #939393; border-left: @scaled-one-px-value solid #939393;
word-break: break-all; word-break: break-all;
white-space: pre-wrap; white-space: pre-wrap;
cursor: pointer; cursor: pointer;
@ -204,7 +204,7 @@
margin-top: 10px; margin-top: 10px;
white-space: pre-wrap; white-space: pre-wrap;
width: auto; width: auto;
border-bottom: 1px dotted @black; border-bottom: @scaled-one-px-value dotted @black;
height: 16px; height: 16px;
cursor: pointer; cursor: pointer;
} }
@ -408,6 +408,6 @@
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
-o-transform: rotate(45deg); -o-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
border: solid 1px @gray-dark; border: solid @scaled-one-px-value @gray-dark;
} }
} }

View file

@ -1,6 +1,6 @@
label { label {
&.link { &.link {
border-bottom: 1px dotted #aaa; border-bottom: @scaled-one-px-value dotted #aaa;
cursor: pointer; cursor: pointer;
&.disabled { &.disabled {
@ -108,4 +108,86 @@ label {
color: @gray-deep; color: @gray-deep;
white-space: nowrap; white-space: nowrap;
} }
}
#file-menu-panel {
> div {
height: 100%;
}
.panel-menu {
width: 260px;
float: left;
border-right: @scaled-one-px-value solid @gray-dark;
background-color: @gray-light;
}
.flex-settings {
&.bordered {
border-bottom: @scaled-one-px-value solid @gray;
}
overflow: hidden;
position: relative;
}
}
.settings-panel {
display: none;
overflow: visible;
margin-top: 7px;
& > table {
width: 100%;
}
&.active {
display: block;
}
.padding-small {
padding-bottom: 8px;
}
.padding-large {
padding-bottom: 16px;
}
.finish-cell {
height: 15px;
}
label {
.font-size-normal();
font-weight: normal;
&.input-label{
margin-bottom: 0;
vertical-align: middle;
}
&.header {
font-weight: bold;
}
}
.separator { width: 100%;}
.settings-hidden {
display: none;
}
textarea {
.user-select(text);
width: 100%;
resize: none;
margin-bottom: 5px;
border: @scaled-one-px-value solid @gray-dark;
height: 100%;
&.disabled {
opacity: 0.65;
cursor: default !important;
}
}
} }

View file

@ -22,8 +22,7 @@
margin: 4px; margin: 4px;
cursor: pointer; cursor: pointer;
.get-scaled-value(1px); .box-shadow(0 0 0 @scaled-one-px-value @gray);
.box-shadow(0 0 0 @scaledvalue @gray);
&:hover, &:hover,
&.selected { &.selected {
@ -60,8 +59,7 @@
opacity: 0.5; opacity: 0.5;
} }
.get-scaled-value(1px); .box-shadow(0 0 0 @scaled-one-px-value @gray);
.box-shadow(0 0 0 @scaledvalue @gray);
&:hover:not(.disabled), &:hover:not(.disabled),
&.selected:not(.disabled) { &.selected:not(.disabled) {

View file

@ -18,13 +18,13 @@
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
-o-transform: rotate(45deg); -o-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
border-top: solid 1px @gray-darker; border-top: solid @scaled-one-px-value @gray-darker;
border-left: solid 1px @gray-darker; border-left: solid @scaled-one-px-value @gray-darker;
border-radius: 0 3px; border-radius: 0 3px;
box-sizing: content-box; box-sizing: content-box;
.thumb-top-inner { .thumb-top-inner {
border-top: solid 1px #fff; border-top: solid @scaled-one-px-value #fff;
border-left: solid 1px #fff; border-left: solid @scaled-one-px-value #fff;
height: 100%; height: 100%;
} }
} }
@ -36,12 +36,12 @@
width: 10px; width: 10px;
height: 9px; height: 9px;
background-color: #ffffff; background-color: #ffffff;
border: solid 1px @gray-darker; border: solid @scaled-one-px-value @gray-darker;
border-top: none; border-top: none;
border-radius: 2px; border-radius: 2px;
box-sizing: content-box; box-sizing: content-box;
.thumb-bottom-inner { .thumb-bottom-inner {
border: solid 1px #fff; border: solid @scaled-one-px-value #fff;
border-top: none; border-top: none;
height: 100%; height: 100%;
} }
@ -49,11 +49,11 @@
&.active { &.active {
.thumb-top { .thumb-top {
border-top: solid 1px #000; border-top: solid @scaled-one-px-value #000;
border-left: solid 1px #000; border-left: solid @scaled-one-px-value #000;
} }
.thumb-bottom { .thumb-bottom {
border: solid 1px #000; border: solid @scaled-one-px-value #000;
border-top: none; border-top: none;
} }
} }
@ -80,8 +80,8 @@
// filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */ // filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
background-position: 0 0; background-position: 0 0;
outline: 1px solid rgba(162, 162, 162, 1); outline: @scaled-one-px-value solid rgba(162, 162, 162, 1);
border: 1px solid #FFFFFF; border: @scaled-one-px-value solid #FFFFFF;
cursor: copy; cursor: copy;
} }
} }

View file

@ -19,7 +19,7 @@
height: 14px; height: 14px;
background: #fff; background: #fff;
border: 1px solid @gray; border: @scaled-one-px-value solid @gray;
border-radius: 50%; border-radius: 50%;
} }

View file

@ -469,7 +469,7 @@
background-color: #fff; background-color: #fff;
&:not(:active) { &:not(:active) {
box-shadow: inset 0 0 0 1px #cbcbcb; box-shadow: inset 0 0 0 @scaled-one-px-value #cbcbcb;
} }
&, .icon { &, .icon {

View file

@ -1,16 +1,6 @@
#file-menu-panel { #file-menu-panel {
> div {
height: 100%;
}
.panel-menu { .panel-menu {
width: 260px;
float: left;
//border-right: 1px solid @gray-dark;
.adaptive-solid-border(1px, @gray-dark, right);
background-color: @gray-light;
li { li {
list-style: none; list-style: none;
position: relative; position: relative;
@ -121,16 +111,6 @@
} }
} }
.flex-settings {
#file-menu-panel & {
&.bordered {
border-bottom: 1px solid @gray;
}
overflow: hidden;
position: relative;
}
}
#panel-settings, #panel-settings,
#panel-info { #panel-info {
#file-menu-panel & { #file-menu-panel & {

View file

@ -1,69 +1,11 @@
.settings-panel { .settings-panel {
display: none;
overflow: visible;
margin-top: 7px;
& > table {
width: 100%;
}
&.active {
display: block;
}
.padding-extra-small {
padding-bottom: 2px;
}
.padding-small {
padding-bottom: 8px;
}
.padding-medium { .padding-medium {
padding-bottom: 12px; padding-bottom: 12px;
} }
.padding-large { .padding-extra-small {
padding-bottom: 16px; padding-bottom: 2px;
}
.finish-cell {
height: 15px;
}
label {
.font-size-normal();
font-weight: normal;
&.input-label{
margin-bottom: 0;
vertical-align: middle;
}
&.header {
font-weight: bold;
}
}
.separator { width: 100%;}
.settings-hidden {
display: none;
}
textarea {
.user-select(text);
width: 100%;
resize: none;
margin-bottom: 5px;
border: 1px solid @gray-dark;
height: 100%;
&.disabled {
opacity: 0.65;
cursor: default !important;
}
} }
} }
.right-panel .settings-panel { .right-panel .settings-panel {

View file

@ -47,16 +47,7 @@
} }
#file-menu-panel { #file-menu-panel {
> div {
height: 100%;
}
.panel-menu { .panel-menu {
width: 260px;
float: left;
border-right: 1px solid @gray-dark;
background-color: @gray-light;
li { li {
list-style: none; list-style: none;
position: relative; position: relative;
@ -152,14 +143,6 @@
} }
} }
.flex-settings {
&.bordered {
border-bottom: 1px solid @gray;
}
overflow: hidden;
position: relative;
}
#panel-settings, #panel-settings,
#panel-info { #panel-info {
padding: 0; padding: 0;

View file

@ -1,63 +1,7 @@
.settings-panel { .settings-panel {
display: none;
overflow: visible;
margin-top: 7px;
& > table {
width: 100%;
}
&.active {
display: block;
}
.padding-small {
padding-bottom: 8px;
}
.padding-large {
padding-bottom: 16px;
}
.finish-cell {
height: 15px;
}
label {
.font-size-normal();
font-weight: normal;
&.input-label{
margin-bottom: 0;
vertical-align: middle;
}
&.header {
font-weight: bold;
}
}
.separator { width: 100%;}
.settings-hidden {
display: none;
}
textarea {
.user-select(text);
width: 100%;
resize: none;
margin-bottom: 5px;
border: 1px solid @gray-dark;
height: 100%;
&.disabled {
opacity: 0.65;
cursor: default !important;
}
}
} }
.right-panel .settings-panel { .right-panel .settings-panel {
label.input-label{ label.input-label{
vertical-align: baseline; vertical-align: baseline;

View file

@ -47,16 +47,7 @@
} }
#file-menu-panel { #file-menu-panel {
> div {
height: 100%;
}
.panel-menu { .panel-menu {
width: 260px;
float: left;
border-right: 1px solid @gray-dark;
background-color: @gray-light;
li { li {
list-style: none; list-style: none;
position: relative; position: relative;
@ -142,14 +133,6 @@
} }
} }
.flex-settings {
&.bordered {
border-bottom: 1px solid @gray;
}
overflow: hidden;
position: relative;
}
#panel-settings-general, #panel-settings-general,
#panel-settings-print { #panel-settings-print {
& > div { & > div {
@ -172,7 +155,7 @@
#id-settings-menu { #id-settings-menu {
.dataview { .dataview {
border-right: 1px solid @gray-dark; border-right: @scaled-one-px-value solid @gray-dark;
& > div:not([class^=ps-scrollbar]) { & > div:not([class^=ps-scrollbar]) {
display: block; display: block;

View file

@ -1,63 +1,7 @@
.settings-panel { .settings-panel {
display: none;
overflow: visible;
margin-top: 7px;
& > table {
width: 100%;
}
&.active {
display: block;
}
.padding-small {
padding-bottom: 8px;
}
.padding-large {
padding-bottom: 16px;
}
.finish-cell {
height: 15px;
}
label {
.font-size-normal();
font-weight: normal;
&.input-label{
margin-bottom: 0;
vertical-align: middle;
}
&.header {
font-weight: bold;
}
}
.separator { width: 100%;}
.settings-hidden {
display: none;
}
textarea {
.user-select(text);
width: 100%;
resize: none;
margin-bottom: 5px;
border: 1px solid @gray-dark;
height: 100%;
&.disabled {
opacity: 0.65;
cursor: default !important;
}
}
} }
.right-panel .settings-panel { .right-panel .settings-panel {
label.input-label{ label.input-label{
vertical-align: baseline; vertical-align: baseline;