ucap/next-ucap-messenger
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

번역 수정 중(보완예정)

Browse Source
This commit is contained in:
khk 2020-01-09 18:44:04 +09:00
parent f6ac17924f
commit 90bdc56cf6
9 changed files with 147 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss
View File

@ -141,25 +141,27 @@
} }
} }
} }
.translation-section { .translation-container {
display: flex; .translation-section {
flex-flow: column; display: flex;
flex-flow: column;
.translation-container { border-top: 1px solid #dddddd;
position: absolute; .translation-container {
bottom: 0;
left: 0;
width: 100%;
background-color: transparent;
background-color: rgba(250, 255, 255, 0.8);
border-top: 1px solid;
.translation-zone {
position: absolute; position: absolute;
padding: 10px 10px 0 10px;
background-color: rgba(250, 255, 255, 0.8);
bottom: 0; bottom: 0;
left: 0;
width: 100%; width: 100%;
background-color: transparent;
background-color: rgba(250, 255, 255, 0.8);
border-top: 1px solid;
.translation-zone {
position: absolute;
padding: 10px 10px 0 10px;
background-color: rgba(250, 255, 255, 0.8);
bottom: 0;
width: 100%;
}
} }
} }
} }

4
projects/ucap-webmessenger-app/src/assets/i18n/ko.json
View File

@ -328,8 +328,8 @@
"size": "파일 크기", "size": "파일 크기",
"download": "파일 다운로드", "download": "파일 다운로드",
"delete": "파일 삭제", "delete": "파일 삭제",
"save": "파일 저장", "save": "저장",
"saveAs": "파일을 다른 이름으로 저장", "saveAs": "다른 이름으로 저장",
"saveAll": "파일 모두 저장", "saveAll": "파일 모두 저장",
"downloadSelected": "선택된 파일 다운로드", "downloadSelected": "선택된 파일 다운로드",
"openDownloadFolder": "다운로드 폴더 열기", "openDownloadFolder": "다운로드 폴더 열기",

8
projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
View File

@ -237,13 +237,13 @@ $daesang-grey: (
color: mat-color($warn, 800); color: mat-color($warn, 800);
} }
.border-primary-color { .border-primary-color {
border: 1px solid mat-color($primary); border-color: 1px solid mat-color($primary);
} }
.border-accent-bright { .border-accent-bright {
border-color: mat-color($accent, 300); border-color: mat-color($accent, 300);
} }
.border-accent-color { .border-accent-color {
border: 1px solid mat-color($accent); border-color: 1px solid mat-color($accent);
} }
.stroke-accent-darkest { .stroke-accent-darkest {
stroke: mat-color($accent, 800); stroke: mat-color($accent, 800);
@ -420,9 +420,9 @@ $daesang-grey: (
} }
} }
.translationForm { .translationForm {
background-color: mat-color($accent, 200, 0.5); background-color: mat-color($accent, 200, 0.4);
} }
.translation-preview { .translation-preview {
background-color: mat-color($accent, 800, 0.8); background-color: mat-color($accent, 900, 0.8);
} }
} }

62
projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/mass-translation.component.scss
View File

@ -0,0 +1,62 @@
.translation-main {
flex-direction: column;
text-align: left;
.original {
padding: 14px;
}
.translation {
padding: 10px;
border-top: 1px solid #dddddd;
}
}
.btn-box {
width: 100%;
height: 40px;
border-top: 1px solid #dddddd;
display: flex;
ul {
width: 100%;
li {
width: 50%;
height: 100%;
display: inline-block;
text-align: center;
align-items: center;
font-size: 13px;
border-right: 1px solid #dddddd;
&:last-child {
border-right: none;
}
.mat-button {
width: 100%;
height: 100%;
display: block;
padding: 0px 6px 4px;
}
}
&.expired {
li {
width: 100%;
white-space: nowrap;
color: #999999;
align-items: center;
line-height: 40px;
}
}
}
}
.translation-main {
.language {
padding: 0px 6px 4px;
background-color: #222222;
border-radius: 4px;
font-size: 1em;
color: #fff;
margin-top: -4px;
margin-right: 6px;
transform: translateY(-2px);
}
}

2
projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/translation.component.scss
View File

@ -1,5 +1,7 @@
.translation-main { .translation-main {
flex-direction: column;
text-align: left; text-align: left;
.original { .original {
padding: 14px; padding: 14px;
} }

4
projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.scss
View File

@ -82,7 +82,9 @@ $meBox-bg: #ffffff;
} }
} }
&.searched { &.searched {
color: red; .bubble {
color: red;
}
} }
} }

2
projects/ucap-webmessenger-ui/src/lib/components/sticker-selector.component.scss
View File

@ -20,7 +20,7 @@
position: relative; position: relative;
padding: 20px; padding: 20px;
text-align: right; text-align: right;
background-color: rgba(0, 0, 0, 0.4); background-color: rgba(45, 58, 74, 0.8);
img { img {
margin-right: 40px; margin-right: 40px;
} }

16
projects/ucap-webmessenger-ui/src/lib/components/translation-section.component.html
View File

@ -7,15 +7,20 @@
" "
class="translation-preview" class="translation-preview"
> >
<span class="translation-section"> <div class="translation-section">
{{ translationPreviewInfo.previewInfo.translation }} <span class="translate-text">
</span> {{ translationPreviewInfo.previewInfo.translation }}
<div class="btns"> </span>
<button <button
mat-stroked-button mat-stroked-button
class="btn-translation-send"
(click)="onClickSendTranslationMessage(translationPreviewInfo)" (click)="onClickSendTranslationMessage(translationPreviewInfo)"
> >
{{ 'chat.send' | translate }} <!--{{ 'chat.send' | translate }}-->
<svg _ngcontent-smu-c52="" fill="none" height="20" stroke="currentColor" stroke-linecap="butt" stroke-linejoin="round"
stroke-width="2" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg">
<path _ngcontent-smu-c52="" d="M12 19V6M5 12l7-7 7 7"></path>
</svg>
</button> </button>
<button <button
class="btn-close-translatebox bg-accent-dark" class="btn-close-translatebox bg-accent-dark"
@ -39,6 +44,7 @@
</svg> </svg>
</button> </button>
</div> </div>
<!--<span class="btn-close"> <!--<span class="btn-close">
<button <button
mat-button mat-button

67
projects/ucap-webmessenger-ui/src/lib/components/translation-section.component.scss
View File

@ -3,38 +3,52 @@
display: flex; display: flex;
flex-flow: row; flex-flow: row;
justify-items: flex-end; justify-items: flex-end;
align-items: center;
color: #ffffff; color: #ffffff;
.translation-section { .translation-section {
display: flex; display: flex;
flex: 1 1 auto; flex: 1 1 auto;
font-size: 1.1em; font-size: 1.1em;
padding: 0 20px 0 40px;
} .translate-text {
.btns { margin: 10px 10px 10px 30px;
display: flex; max-height: 100px;
flex-flow: row; word-break: break-all;
margin-left: auto; white-space: pre-wrap;
height: 100%; overflow-y: auto;
button { display: flex;
&.btn-send { flex: 1 1 auto;
width: 80px; }
background-color: #ffffff; .btn-translation-send {
color: #333333; /* min-width: 80px;
} background-color: rgb(255, 255, 255,0.1);
&.btn-close-translatebox { border-radius: 0;
width: 3em; border: none;*/
height: 100%; background-color: #ffffff;
stroke: #ffffff; color: #333333;
border: none; border-radius: 0;
display: flex; width: 40px;
justify-content: center; height: 40px;
justify-items: center; border-radius: 50%;
margin-left: auto; margin-right: 20px;
padding: 0;
min-width: 40px;
align-self: center;
}
.btn-close-translatebox {
height: 100%;
stroke: #ffffff;
border: none;
display: flex;
justify-content: center;
justify-items: center;
margin-left: auto;
svg {
width: 40px;
} }
} }
} }
} }
::ng-deep .translationForm { ::ng-deep .translationForm {
position: relative; position: relative;
display: flex; display: flex;
@ -60,6 +74,13 @@
margin-right: 20px; margin-right: 20px;
.mat-form-field-wrapper { .mat-form-field-wrapper {
width: 100%; width: 100%;
line-height: 0.8em;
.mat-form-field-infix {
padding: 0.2em 0 0;
}
}
.mat-form-field-underline {
bottom: 0.8em;
} }
} }
.mat-slide-toggle { .mat-slide-toggle {