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

Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

Browse Source
This commit is contained in:
leejinho 2020-01-28 13:43:33 +09:00
commit fe041f1ea2
7 changed files with 64 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
electron-projects/ucap-webmessenger-electron/src/app/AppWindow.ts
View File

@ -23,8 +23,8 @@ export class AppWindow {
// tslint:disable-next-line: variable-name // tslint:disable-next-line: variable-name
private _rendererReadyTime: number | null = null; private _rendererReadyTime: number | null = null;
private minWidth = 1160; private minWidth = 700;
private minHeight = 800; private minHeight = 600;
public constructor(private appIconPath: string) { public constructor(private appIconPath: string) {
const savedWindowState = windowStateKeeper({ const savedWindowState = windowStateKeeper({

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

@ -7,7 +7,7 @@ $otherBox-bg: #ffffff;
$meBox-line: #cccccc; $meBox-line: #cccccc;
$meBox-bg: #ffffff; $meBox-bg: #ffffff;
$tablet-l-width: 1024px; $tablet-l-width: 1024px;
$mob-l-width: 640px; $tablet-s-width: 768px;
.information-msg { .information-msg {
width: 100%; width: 100%;
} }
@ -56,15 +56,17 @@ $mob-l-width: 640px;
display: Flex; display: Flex;
flex-flow: row; flex-flow: row;
margin-left: 10px; margin-left: 10px;
max-width: 80%; width: 80%;
@media screen and (max-width: #{$mob-l-width}), @media screen and (max-width: #{$tablet-s-width}),
(max-height: 600px) { (max-height: 600px) {
flex-flow: column; flex-flow: column;
max-width: 80%;
width: unset;
} }
.message-main { .message-main {
margin-right: 6px; margin-right: 6px;
max-width: calc(100% - 60px); max-width: calc(100% - 60px);
@media screen and (max-width: #{$mob-l-width}), @media screen and (max-width: #{$tablet-s-width}),
(max-height: 600px) { (max-height: 600px) {
flex-flow: column; flex-flow: column;
max-width: 100%; max-width: 100%;
@ -88,7 +90,7 @@ $mob-l-width: 640px;
color: #666666; color: #666666;
word-wrap: break-word; word-wrap: break-word;
white-space: nowrap; white-space: nowrap;
@media screen and (max-width: #{$mob-l-width}), (max-height: 600px) { @media screen and (max-width: #{$tablet-s-width}), (max-height: 600px) {
flex-flow: row; flex-flow: row;
align-self: flex-start; align-self: flex-start;
ul { ul {
@ -99,34 +101,41 @@ $mob-l-width: 640px;
li { li {
display: inline-flex; display: inline-flex;
&.unread { &.unread {
padding: 0px 6px;
margin-left: 10px; margin-left: 10px;
border-radius: 30px;
background-color: #666666;
color: #ffffff;
} }
} }
} }
} }
} ul {
&.me { li {
.message-main-container { &.unread {
display: Flex; padding: 0px 6px;
flex-flow: row; border-radius: 30px;
margin-left: 0px; background-color: #888888;
margin-right: 10px; color: #ffffff;
@media screen and (max-width: #{$tablet-l-width}), display: inline-flex;
(max-height: 800px) { }
flex-flow: column;
} }
} }
} }
&.highlight { }
.bubble { &.me {
color: red; .message-main-container {
display: Flex;
flex-flow: row-reverse;
margin-left: 0px;
margin-right: 10px;
@media screen and (max-width: #{$tablet-s-width}),
(max-height: 600px) {
flex-flow: column;
} }
} }
} }
&.highlight {
.bubble {
color: red;
}
}
} }
.message-row.me { .message-row.me {
.profile-img { .profile-img {
@ -137,6 +146,8 @@ $mob-l-width: 640px;
display: none; display: none;
} }
.message-main { .message-main {
display: flex;
justify-content: flex-end;
text-align: right; text-align: right;
margin-left: 6px; margin-left: 6px;
margin-right: 0; margin-right: 0;
@ -146,7 +157,7 @@ $mob-l-width: 640px;
} }
.secondary-text { .secondary-text {
text-align: end; text-align: end;
@media screen and (max-width: #{$mob-l-width}), (max-height: 600px) { @media screen and (max-width: #{$tablet-s-width}), (max-height: 600px) {
flex-flow: column; flex-flow: column;
align-self: flex-end; align-self: flex-end;
} }

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

@ -3,7 +3,7 @@
text-align: left; text-align: left;
padding: 4px; padding: 4px;
.event-header { .event-header {
padding: 10px; padding: 8px 10px;
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;

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

@ -1,7 +1,6 @@
.translation-main { .translation-main {
flex-direction: column; flex-direction: column;
text-align: left; text-align: left;
.original { .original {
padding: 10px; padding: 10px;
} }
@ -9,6 +8,10 @@
padding: 10px; padding: 10px;
border-top: 1px solid #dddddd; border-top: 1px solid #dddddd;
} }
.sticker {
padding: 10px 10px 0;
text-align: center;
}
} }
.language { .language {
padding: 0px 6px 4px; padding: 0px 6px 4px;

20
projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.html
View File

@ -21,24 +21,24 @@
</div> </div>
<ul class="event-info"> <ul class="event-info">
<li class="event-date bg-accent-brightest"> <li class="event-date bg-accent-brightest">
<span class="text-accent-darkest">{{ <label class="text-accent-darkest">{{
'chat.event.videoConferenceRegister' | translate 'chat.event.videoConferenceRegister' | translate
}}</span }}</label
>{{ message.sentMessageJson.register }} ><span>{{ message.sentMessageJson.register }}</span>
</li> </li>
<li class="event-time bg-accent-brightest"> <li class="event-time bg-accent-brightest">
<span class="text-accent-darkest">{{ <label class="text-accent-darkest">{{
'chat.event.videoConferenceAttendee' | translate 'chat.event.videoConferenceAttendee' | translate
}}</span }}</label
>{{ message.sentMessageJson.attendee }} ><span>{{ message.sentMessageJson.attendee }}</span>
</li> </li>
<li class="event-time bg-accent-brightest"> <li class="event-time bg-accent-brightest">
<span class="text-accent-darkest">{{ <label class="text-accent-darkest">{{
'chat.event.videoConferenceDate' | translate 'chat.event.videoConferenceDate' | translate
}}</span }}</label
>{{ ><span>{{
message.sentMessageJson.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm' message.sentMessageJson.startDate | ucapDate: 'YYYY.MM.DD (ddd) a hh:mm'
}} }}</span>
</li> </li>
<li class="event-content"> <li class="event-content">
{{ message.sentMessageJson.title }} {{ message.sentMessageJson.title }}

18
projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/video-conference.component.scss
View File

@ -3,7 +3,7 @@
text-align: left; text-align: left;
padding: 4px; padding: 4px;
.event-header { .event-header {
padding: 10px; padding: 8px 10px;
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 600;
text-align: center; text-align: center;
@ -29,8 +29,15 @@
&.event-time { &.event-time {
padding: 4px 10px; padding: 4px 10px;
border-bottom: 1px dotted #dddddd; border-bottom: 1px dotted #dddddd;
display: flex;
label {
margin-right: 10px;
flex: 0 0 auto;
font-size: 0.96em;
font-weight: 600;
width: 40px;
}
span { span {
width: 60px;
padding: 1px 6px; padding: 1px 6px;
margin-right: 6px; margin-right: 6px;
border-radius: 100px; border-radius: 100px;
@ -39,7 +46,7 @@
justify-content: center; justify-content: center;
font-size: 0.96em; font-size: 0.96em;
margin-bottom: 2px; margin-bottom: 2px;
color: #777777; color: #444444;
} }
} }
&.event-content { &.event-content {
@ -53,11 +60,10 @@
.btn-box { .btn-box {
width: 100%; width: 100%;
height: 40px;
border-top: 1px solid #dddddd;
display: flex; display: flex;
width: 100%; width: 100%;
text-align: center; text-align: center;
padding-top: 4px;
ul { ul {
width: 100%; width: 100%;
li { li {
@ -67,7 +73,7 @@
text-align: center; text-align: center;
align-items: center; align-items: center;
font-size: 13px; font-size: 13px;
border-right: 1px solid #dddddd; border-right: 1px solid rgb(255, 255, 255, 0.6);
&:last-child { &:last-child {
border-right: none; border-right: none;
} }

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

@ -49,7 +49,7 @@
::ng-deep .translationForm { ::ng-deep .translationForm {
position: relative; position: relative;
display: flex; display: flex;
padding: 0 40px; padding: 0 2vw;
justify-items: flex-end; justify-items: flex-end;
align-content: space-between; align-content: space-between;
font-size: 0.9em; font-size: 0.9em;