tykayn/ng-implementation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

up csc placeholder and file csv upload

Browse source
This commit is contained in:
Tykayn 2025-09-15 13:03:21 +02:00 • committed by tykayn
parent 8694a04ea9
commit a359d0f9b1
18 changed files with 632 additions and 452 deletions
Download patch file Download diff file Expand all files Collapse all files

191
my-workspace/projects/sae-lib/inputs/multi-selector/multi-selector.scss
View file

@ -1,107 +1,116 @@
@use '../../src/styles/variables';
.input-box {
margin-left: -1rem;
:host {
.d-none {
display: none;
}
.input-box {
margin-left: -1rem;
i {
.d-none {
display: none;
}
top: 10px;
left: 1rem;
i {
&::before {
left: 10px;
top: 10px;
left: 1rem;
&::before {
left: 10px;
top: 10px;
}
&.is-disabled {
color: #525668;
fill: #525668;
}
}
&.is-disabled {
color: #525668;
fill: #525668;
}
}
.search-placeholder,
.selector-button {
position: relative;
}
.search-placeholder {
top: 30px;
left: 16px;
}
.selector-button {
top: -36px;
right: -165px;
}
.selected-items-counter {
background: blue;
color: white;
border-radius: 200px;
padding: 10px;
display: inline-block;
line-height: 10px;
position: relative;
top: 33px;
left: 136px;
}
input {
border-radius: 8px;
border: 1px solid #8D91A4;
background: var(--color-background-card-on-base, #FFF);
padding: 10px 40px;
width: 210px;
height: 42px;
overflow: hidden;
color: var(--color-text-secondary, #525668);
text-overflow: ellipsis;
font-size: var(--Font-Base, 14px);
.is-disabled & {
border-color: #525668;
}
}
.dropdown {
background: white;
padding: 1rem;
border-radius: 8px;
position: relative;
display: block;
z-index: 10;
border-top-left-radius: 0;
border-top-right-radius: 0;
top: -28px;
border-left: 1px solid #8D91A4;
border-bottom: 1px solid #8D91A4;
border-right: 1px solid #8D91A4;
.dropdown-list {
max-height: 200px;
overflow-y: auto;
.search-placeholder,
.selector-button {
position: relative;
}
.dropdown-item {
padding: 4px;
cursor: pointer;
.search-placeholder {
top: 30px;
left: 16px;
}
&:hover {
background: #525668;
color: white;
.selector-button {
top: -32px;
right: -183px;
}
.selected-items-counter {
background: variables.$csc-chips-bg-color;
color: white;
border-radius: 200px;
padding: 10px;
display: inline-block;
line-height: 10px;
position: relative;
top: 2px;
left: -53px;
visibility: hidden;
&.is-visible {
visibility: visible;
}
}
input {
border-radius: 8px;
border: 1px solid #8D91A4;
background: var(--color-background-card-on-base, #FFF);
padding: 10px 40px;
width: 210px;
height: 42px;
overflow: hidden;
color: var(--color-text-secondary, #525668);
text-overflow: ellipsis;
font-size: var(--Font-Base, 14px);
.is-disabled & {
border-color: #525668;
}
}
.dropdown {
background: white;
padding: 1rem;
border-radius: 8px;
position: relative;
display: block;
z-index: 10;
border-top-left-radius: 0;
border-top-right-radius: 0;
top: -28px;
border-left: 1px solid #8D91A4;
border-bottom: 1px solid #8D91A4;
border-right: 1px solid #8D91A4;
.dropdown-list {
max-height: 200px;
overflow-y: auto;
}
.dropdown-item {
padding: 4px;
cursor: pointer;
&:hover {
background: #525668;
color: white;
}
}
}
}
}