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

152
my-workspace/projects/sae-lib/inbox/translate-texts/translate-texts.scss
View file

@ -1,69 +1,141 @@
@use '../../src/styles/variables';
:host {
.translate-texts {
display: flex;
flex-direction: row;
justify-content: start;
gap: 16px;
}
#fromText,
#toText {
padding: variables.$spacing-4 42px variables.$spacing-4 variables.$spacing-4;
box-shadow: 0 19px 29px 0 rgba(30, 31, 34, 0.05);
background: white;
height: 235px;
width: 648px;
overflow-y: auto;
}
.delete-button {
border: 0;
border-radius: 100%;
background: #F2F2F2;
color: grey;
cursor: pointer;
padding: 10px;
float: right;
width: 37px;
visibility: hidden;
z-index: 10;
position: relative;
&:hover {
background: #888;
color: #222;
display: block;
}
&.is-visible {
visibility: visible;
}
}
textarea {
width: 100%;
height: 236px;
height: 200px;
flex-shrink: 0;
border-radius: 4px;
background: #FFF;
box-shadow: 0 19px 29px 0 rgba(30, 31, 34, 0.05);
border-width: 0;
color: variables.$csc-textarea-color;
padding: 16px 42px 16px 16px;
color: #1B1D27;
font-family: Barlow;
font-size: 16px;
color: variables.$csc-text-color;
font-size: variables.$spacing-4;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 22.4px */
margin-top: -40px;
background: transparent;
&::placeholder {
color: variables.$csc-textarea-placeholder-color;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 140%;
width: 370px;
}
}
.textarea-placeholder {
color: variables.$csc-textarea-placeholder-color;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 140%;
}
.click-file-upload {
cursor: pointer;
display: inline-flex;
height: 34px;
padding: 8px 20px;
justify-content: center;
align-items: center;
flex-shrink: 0;
color: variables.$csc-nav-color;
border-radius: variables.$radius-4;
border: 1px solid var(--color-text-title, variables.$csc-nav-color);
background: var(--color-background-card-on-base, #FFF);
left: 0;
top: 100px;
position: relative;
font-weight: 600;
i {
margin-left: 10px;
}
}
}
#fromText {
.file-selected {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-radius: 4px;
padding: 10px;
textarea {
background: variables.$csc-file-selector-bg-color;
.labeling {
display: flex;
flex-direction: row;
justify-content: start;
div {
padding-right: 10px;
}
}
.label {
color: variables.$csc-text-color;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 19.6px */
}
.weight {
color: variables.$csc-light-text-color;
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 140%;
}
}
}
button.is-outlined {
display: inline-flex;
height: 34px;
padding: var(--Spacing-Spacing-10, 4px) var(--Spacing-Spacing-30, 12px) var(--Spacing-Spacing-10, 4px) var(--Spacing-Spacing-20, 8px);
justify-content: center;
align-items: center;
flex-shrink: 0;
color: #255B8E;
border-radius: 8px;
border: 1px solid var(--color-text-title, #255B8E);
background: var(--color-background-card-on-base, #FFF);
left: 16px;
top: -50px;
position: relative;
i {
margin-right: 4px;
#fileUploadTranslator {
display: none;
}
}
#fileUploadTranslator {
display: none;
}