espocrm-extensions/espocrm-base
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

less ref

Browse Source
This commit is contained in:
Yuri Kuznetsov
2024-10-30 16:10:02 +02:00
parent fbc38c9a87
commit 10da8accd0
5 changed files with 59 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/less/espo/custom.less
+2 -1
View File
@@ -3905,7 +3905,7 @@ body > .autocomplete-suggestions.text-search-suggestions {
.iti__country-list {
margin-top: var(--1px); // To match positioning of other dropdowns.
z-index: 5;
max-height: var(--300px);
max-height: calc(var(--300px) + var(--5px));
background-color: var(--dropdown-bg);
border: var(--dropdown-border) solid var(--dropdown-border-width);
border-radius: var(--dropdown-border-radius);
@@ -3926,6 +3926,7 @@ body > .autocomplete-suggestions.text-search-suggestions {
.iti__divider {
border-bottom-color: var(--dropdown-divider-bg);
margin-bottom: var(--5px);
}
padding: var(--5px) 0;
frontend/less/espo/elements/panel.less
+2 -2
View File
@@ -188,8 +188,8 @@
user-select: none;
&.panel-heading-no-title {
padding-top: 6px;
padding-bottom: 6px;
padding-top: var(--6px);
padding-bottom: var(--6px);
}
padding-top: 0;
frontend/less/espo/misc/datepicker/datepicker.less
+10 -10
View File
@@ -43,18 +43,18 @@
&:after {
content: '';
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid var(--dropdown-bg);
border-left: var(--6px) solid transparent;
border-right: var(--6px)solid transparent;
border-bottom: var(--6px) solid var(--dropdown-bg);
border-top: 0;
position: absolute;
}
&.datepicker-orient-left:before { left: 6px; }
&.datepicker-orient-left:after { left: 7px; }
&.datepicker-orient-right:before { right: 6px; }
&.datepicker-orient-right:after { right: 7px; }
&.datepicker-orient-bottom:before { top: -7px; }
&.datepicker-orient-bottom:after { top: -6px; }
&.datepicker-orient-left:before { left: var(--6px); }
&.datepicker-orient-left:after { left: var(--7px); }
&.datepicker-orient-right:before { right: var(--6px); }
&.datepicker-orient-right:after { right: var(--7px); }
&.datepicker-orient-bottom:before { top: var(--minus-7px); }
&.datepicker-orient-bottom:after { top: var(--minus-6px); }
&.datepicker-orient-top:before {
bottom: var(--minus-7px);
border-bottom: 0;
@@ -245,7 +245,7 @@
float: left;
margin: 1%;
cursor: pointer;
border-radius: 4px;
border-radius: var(--border-radius-small);
&:hover,
&.focused {
background: var(--dropdown-link-hover-bg);
frontend/less/espo/misc/intl-tel-input/intlTelInput.less
+33 -32
View File
@@ -18,7 +18,7 @@
z-index: 0;
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-right: 36px;
padding-right: var(--36px);
margin-right: 0;
}
.iti__flag-container {
@@ -34,42 +34,43 @@
display: flex;
align-items: center;
height: 100%;
padding: 0 6px 0 8px;
padding: 0 var(--6px) 0 var(--8px);
}
.iti__arrow {
margin-left: 6px;
margin-left: var(--6px);
width: 0;
height: 0;
border-left: 3px solid transparent;
border-right: 3px solid transparent;
border-top: 4px solid #555;
border-left: var(--3px) solid transparent;
border-right: var(--3px) solid transparent;
border-top: var(--4px) solid #555;
}
[dir=rtl] .iti__arrow {
margin-right: 6px;
margin-right: var(--6px);
margin-left: 0;
}
.iti__arrow--up {
border-top: none;
border-bottom: 4px solid #555;
border-bottom: var(--4px) solid #555;
}
.iti__country-list {
position: absolute;
z-index: 2;
list-style: none;
padding: 0;
margin: 0 0 0 -1px;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
margin: 0 0 0 var(--minus-1px);
box-shadow: var(--1px) var(--1px) var(--4px) rgba(0, 0, 0, 0.2);
background-color: white;
border: 1px solid #ccc;
white-space: nowrap;
max-height: 200px;
max-height: var(--200px);
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.iti__country-list--dropup {
bottom: 100%;
margin-bottom: -1px;
margin-bottom: var(--minus-1px);
}
@media (max-width: 500px) {
.iti__country-list {
white-space: normal;
@@ -77,17 +78,17 @@
}
.iti__flag-box {
display: inline-block;
width: 20px;
width: var(--20px);
}
.iti__divider {
padding-bottom: 5px;
margin-bottom: 5px;
border-bottom: 1px solid #ccc;
padding-bottom: var(--5px);
margin-bottom: var(--5px);
border-bottom: var(--1px) solid #ccc;
}
.iti__country {
display: flex;
align-items: center;
padding: 5px 10px;
padding: var(--5px) var(--10px);
outline: none;
}
.iti__dial-code {
@@ -97,19 +98,19 @@
background-color: rgba(0, 0, 0, 0.05);
}
.iti__flag-box, .iti__country-name {
margin-right: 6px;
margin-right: var(--6px);
}
[dir=rtl] .iti__flag-box, [dir=rtl] .iti__country-name {
margin-right: 0;
margin-left: 6px;
margin-left: var(--6px);
}
.iti--allow-dropdown input,
.iti--allow-dropdown input[type=text],
.iti--allow-dropdown input[type=tel], .iti--separate-dial-code input,
.iti--separate-dial-code input[type=text],
.iti--separate-dial-code input[type=tel] {
padding-right: 6px;
padding-left: 52px;
padding-right: var(--6px);
padding-left: var(--50px);
margin-left: 0;
}
[dir=rtl] .iti--allow-dropdown input,
@@ -117,8 +118,8 @@
[dir=rtl] .iti--allow-dropdown input[type=tel], [dir=rtl] .iti--separate-dial-code input,
[dir=rtl] .iti--separate-dial-code input[type=text],
[dir=rtl] .iti--separate-dial-code input[type=tel] {
padding-right: 52px;
padding-left: 6px;
padding-right: var(--50px);
padding-left: var(--6px);
margin-right: 0;
}
.iti--allow-dropdown .iti__flag-container, .iti--separate-dial-code .iti__flag-container {
@@ -147,11 +148,11 @@
background-color: rgba(0, 0, 0, 0.05);
}
.iti--separate-dial-code.iti--show-flags .iti__selected-dial-code {
margin-left: 6px;
margin-left: var(--6px);
}
[dir=rtl] .iti--separate-dial-code.iti--show-flags .iti__selected-dial-code {
margin-left: 0;
margin-right: 6px;
margin-right: var(--6px);
}
.iti--container {
position: absolute;
@@ -165,10 +166,10 @@
}
.iti-mobile .iti--container {
top: 30px;
bottom: 30px;
left: 30px;
right: 30px;
top: var(--30px);
bottom: var(--30px);
left: var(--30px);
right: var(--30px);
position: fixed;
}
.iti-mobile .iti__country-list {
@@ -1260,12 +1261,12 @@
}
.iti__flag {
height: 15px;
height: var(--15px);
box-shadow: 0px 0px 1px 0px #888;
background-image: url("../img/flags.png?1");
background-repeat: no-repeat;
background-color: #dbdbdb;
background-position: 20px 0;
background-position: var(--20px) 0;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.iti__flag {
@@ -1275,4 +1276,4 @@
.iti__flag.iti__np {
background-color: transparent;
}
}
frontend/less/espo/misc/kanban.less
+12 -102
View File
@@ -13,29 +13,10 @@ div.list-kanban > div > table {
margin: 0;
overflow: hidden;
/*&:first-child {
> div {
border-top-left-radius: var(--border-radius);
border-bottom-left-radius: var(--border-radius);
}
}*/
&:last-child {
> div {
width: 100%;
/*&:before,
&:after {
display: none;
content: "";
}*/
/*.create-button {
right: 14px;
}*/
/*border-top-right-radius: var(--border-radius);
border-bottom-right-radius: var(--border-radius);*/
}
}
@@ -59,105 +40,38 @@ div.list-kanban > div > table {
border-radius: var(--border-radius);
}
/*> div:before,
> div:after {
content: " ";
display: inline-block;
width: 0;
height: 0;
border-top-width: 14px;
border-left-width: 15px;
border-bottom-width: 14px;
border-right-width: 0;
border-color: var(--label-default-bg);
border-style: solid;
position: absolute;
}
> div:before {
left: ~"calc(100%)";
z-index: 2;
border-top-color: transparent;
border-bottom-color: transparent;
}
> div:after {
border-left-color: transparent;
left: ~"calc(100% + 2px)";
}*/
}
th.group-header {
&.group-header-success {
> div {
background-color: var(--brand-success);
/*&:before {
border-left-color: var(--brand-success);
}*/
}
}
/*&.group-header-before-success {
> div:after {
border-color: var(--brand-success) var(--brand-success) var(--brand-success) transparent;
}
}*/
&.group-header-danger {
> div {
background-color: var(--brand-danger);
/*&:before {
border-left-color: var(--brand-danger);
}*/
}
}
&.group-header-before-danger {
/*> div:after {
border-color: var(--brand-danger) var(--brand-danger) var(--brand-danger) transparent;
}*/
}
&.group-header-warning {
> div {
background-color: var(--brand-warning);
/*&:before {
border-left-color: var(--brand-warning);
}*/
}
}
&.group-header-before-warning {
/*> div:after {
border-color: var(--brand-warning) var(--brand-warning) var(--brand-warning) transparent;
}*/
}
&.group-header-primary {
> div {
background-color: var(--brand-primary);
/*&:before {
border-left-color: var(--brand-primary);
}*/
}
}
&.group-header-before-primary {
/*> div:after {
border-color: var(--brand-primary) var(--brand-primary) var(--brand-primary) transparent;
}*/
}
&.group-header-info {
> div {
background-color: var(--brand-info);
/*&:before {
border-left-color: var(--brand-info);
}*/
}
}
&.group-header-before-info {
/*> div:after {
border-color: var(--brand-info) var(--brand-info) var(--brand-info) transparent;
}*/
}
}
td.group-column {
@@ -170,19 +84,19 @@ div.list-kanban > div > table {
}
.show-more a {
margin: 0 auto 8px;
margin: 0 auto var(--8px);
display: block;
height: 20px;
height: var(--20px);
> span {
top: -4px;
top: var(--minus-4px);
color: @text-muted;
position: relative;
}
}
.group-column-list {
min-height: 100px;
min-height: var(--100px);
}
.group-column-list.drop-active {
@@ -190,14 +104,14 @@ div.list-kanban > div > table {
}
.group-column-list.drop-hover {
border-top: 2px solid @gray-light;
border-top: var(--2px) solid @gray-light;
}
}
.item {
.panel {
.form-group {
margin-bottom: 3px;
margin-bottom: var(--3px);
.field-right-align {
text-align: right;
@@ -235,8 +149,8 @@ div.list-kanban > div > table {
}
.item-menu-container {
margin-top: -10px;
margin-right: -10px;
margin-top: var(--minus-10px);
margin-right: var(--minus-10px);
.dropdown-toggle:focus:focus-visible {
outline: none;
@@ -282,11 +196,7 @@ div.list-kanban > div > table {
}
.kanban-head-placeholder {
height: 28px;
}
.kanban-head-container {
//box-shadow: var(--default-box-shadow);
height: var(--28px);
}
.kanban-head-container.sticked {
@@ -336,10 +246,10 @@ div.list-kanban > div > table {
> th {
overflow: visible;
min-width: 0;
max-height: 28px;
max-height: var(--28px);
.kanban-group-label {
display: inline-block;
max-width: ~"calc(100% - 15px)";
max-width: ~"calc(100% - var(--15px))";
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
@@ -347,7 +257,7 @@ div.list-kanban > div > table {
&:hover {
.kanban-group-label {
max-width: ~"calc(100% - 30px)";
max-width: ~"calc(100% - var(--30px))";
}
}