번역 수정 중(보완예정)
This commit is contained in:
khk
parent
f6ac17924f
commit
90bdc56cf6
|
|
@ -141,25 +141,27 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.translation-section {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
||||
.translation-container {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: transparent;
|
||||
background-color: rgba(250, 255, 255, 0.8);
|
||||
border-top: 1px solid;
|
||||
|
||||
.translation-zone {
|
||||
.translation-container {
|
||||
.translation-section {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
border-top: 1px solid #dddddd;
|
||||
.translation-container {
|
||||
position: absolute;
|
||||
padding: 10px 10px 0 10px;
|
||||
background-color: rgba(250, 255, 255, 0.8);
|
||||
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;
|
||||
padding: 10px 10px 0 10px;
|
||||
background-color: rgba(250, 255, 255, 0.8);
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -328,8 +328,8 @@
|
|||
"size": "파일 크기",
|
||||
"download": "파일 다운로드",
|
||||
"delete": "파일 삭제",
|
||||
"save": "파일 저장",
|
||||
"saveAs": "파일을 다른 이름으로 저장",
|
||||
"save": "저장",
|
||||
"saveAs": "다른 이름으로 저장",
|
||||
"saveAll": "파일 모두 저장",
|
||||
"downloadSelected": "선택된 파일 다운로드",
|
||||
"openDownloadFolder": "다운로드 폴더 열기",
|
||||
|
|
|
|||
|
|
@ -237,13 +237,13 @@ $daesang-grey: (
|
|||
color: mat-color($warn, 800);
|
||||
}
|
||||
.border-primary-color {
|
||||
border: 1px solid mat-color($primary);
|
||||
border-color: 1px solid mat-color($primary);
|
||||
}
|
||||
.border-accent-bright {
|
||||
border-color: mat-color($accent, 300);
|
||||
}
|
||||
.border-accent-color {
|
||||
border: 1px solid mat-color($accent);
|
||||
border-color: 1px solid mat-color($accent);
|
||||
}
|
||||
.stroke-accent-darkest {
|
||||
stroke: mat-color($accent, 800);
|
||||
|
|
@ -420,9 +420,9 @@ $daesang-grey: (
|
|||
}
|
||||
}
|
||||
.translationForm {
|
||||
background-color: mat-color($accent, 200, 0.5);
|
||||
background-color: mat-color($accent, 200, 0.4);
|
||||
}
|
||||
.translation-preview {
|
||||
background-color: mat-color($accent, 800, 0.8);
|
||||
background-color: mat-color($accent, 900, 0.8);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +1,7 @@
|
|||
.translation-main {
|
||||
flex-direction: column;
|
||||
text-align: left;
|
||||
|
||||
.original {
|
||||
padding: 14px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -82,7 +82,9 @@ $meBox-bg: #ffffff;
|
|||
}
|
||||
}
|
||||
&.searched {
|
||||
color: red;
|
||||
.bubble {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
position: relative;
|
||||
padding: 20px;
|
||||
text-align: right;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
background-color: rgba(45, 58, 74, 0.8);
|
||||
img {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,15 +7,20 @@
|
|||
"
|
||||
class="translation-preview"
|
||||
>
|
||||
<span class="translation-section">
|
||||
{{ translationPreviewInfo.previewInfo.translation }}
|
||||
</span>
|
||||
<div class="btns">
|
||||
<div class="translation-section">
|
||||
<span class="translate-text">
|
||||
{{ translationPreviewInfo.previewInfo.translation }}
|
||||
</span>
|
||||
<button
|
||||
mat-stroked-button
|
||||
class="btn-translation-send"
|
||||
(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
|
||||
class="btn-close-translatebox bg-accent-dark"
|
||||
|
|
@ -39,6 +44,7 @@
|
|||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!--<span class="btn-close">
|
||||
<button
|
||||
mat-button
|
||||
|
|
|
|||
|
|
@ -3,38 +3,52 @@
|
|||
display: flex;
|
||||
flex-flow: row;
|
||||
justify-items: flex-end;
|
||||
align-items: center;
|
||||
color: #ffffff;
|
||||
.translation-section {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
font-size: 1.1em;
|
||||
padding: 0 20px 0 40px;
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
margin-left: auto;
|
||||
height: 100%;
|
||||
button {
|
||||
&.btn-send {
|
||||
width: 80px;
|
||||
background-color: #ffffff;
|
||||
color: #333333;
|
||||
}
|
||||
&.btn-close-translatebox {
|
||||
width: 3em;
|
||||
height: 100%;
|
||||
stroke: #ffffff;
|
||||
border: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
justify-items: center;
|
||||
margin-left: auto;
|
||||
|
||||
.translate-text {
|
||||
margin: 10px 10px 10px 30px;
|
||||
max-height: 100px;
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.btn-translation-send {
|
||||
/* min-width: 80px;
|
||||
background-color: rgb(255, 255, 255,0.1);
|
||||
border-radius: 0;
|
||||
border: none;*/
|
||||
background-color: #ffffff;
|
||||
color: #333333;
|
||||
border-radius: 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
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 {
|
||||
position: relative;
|
||||
display: flex;
|
||||
|
|
@ -60,6 +74,13 @@
|
|||
margin-right: 20px;
|
||||
.mat-form-field-wrapper {
|
||||
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 {
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user