Lots of channel related fixes and updates
This commit is contained in:
N-Pex
parent
e3bfede77e
commit
ca777a83be
17 changed files with 508 additions and 59 deletions
|
|
@ -1,24 +1,130 @@
|
|||
.chat-root.channel {
|
||||
background-color: #f2f2f2;
|
||||
.chat-content {
|
||||
width: 100%;
|
||||
max-width: 700px;
|
||||
align-self: center;
|
||||
background-color: white;
|
||||
background-color: #f2f2f2;
|
||||
.chat-content {
|
||||
width: 100%;
|
||||
max-width: 700px;
|
||||
align-self: center;
|
||||
background-color: white;
|
||||
padding: 0 0;
|
||||
}
|
||||
|
||||
.messageOut,
|
||||
.messageIn,
|
||||
.messageOut.from-admin,
|
||||
.messageIn.from-admin {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
margin: 0 0 8px 0;
|
||||
padding: 16px 0 0 0;
|
||||
text-align: start;
|
||||
.senderAndTime {
|
||||
order: 2;
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
padding: 2px 12px 0 12px;
|
||||
.sender {
|
||||
font-size: 12 * $chat-text-size;
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
color: #1c1c31;
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
.time {
|
||||
font-size: 12 * $chat-text-size;
|
||||
margin: 0;
|
||||
color: #5f5f5f;
|
||||
}
|
||||
.status {
|
||||
font-size: 12 * $chat-text-size;
|
||||
margin: 0 0 0 10px;
|
||||
color: #5f5f5f;
|
||||
}
|
||||
}
|
||||
.avatar {
|
||||
order: 1;
|
||||
width: 40px !important;
|
||||
height: 40px !important;
|
||||
min-width: 40px !important;
|
||||
min-height: 40px !important;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.pin-icon {
|
||||
order: 3;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.op-button {
|
||||
order: 4;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.content {
|
||||
order: 5;
|
||||
flex: 0 0 100%;
|
||||
margin-top: 24px;
|
||||
.message {
|
||||
color: black !important;
|
||||
}
|
||||
}
|
||||
.bubble {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
color: black !important;
|
||||
background: none !important;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
padding: 0 15px 0 15px;
|
||||
}
|
||||
.bubble.image-bubble {
|
||||
/* full bleed */
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
.quick-reaction-container {
|
||||
order: 6;
|
||||
flex: 0 0 100%;
|
||||
margin: 24px 7px 0 7px;
|
||||
padding: 0 8px 16px 8px;
|
||||
.emoji {
|
||||
font-size: 12 * $chat-text-size;
|
||||
font-weight: 500;
|
||||
color: #1c1c31;
|
||||
.v-icon {
|
||||
width: 21px;
|
||||
height: 21px;
|
||||
}
|
||||
}
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.messageOut, .messageIn {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.senderAndTime {
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
.content {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.bubble {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
/* Make all images 'cover' */
|
||||
.v-image__image {
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.audio-player {
|
||||
color: #1c1c31 !important;
|
||||
.currentColor {
|
||||
background-color: #000000 !important;
|
||||
}
|
||||
.v-icon {
|
||||
color: black !important;
|
||||
}
|
||||
}
|
||||
|
||||
.poll-answer {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.messageOut.pinned,
|
||||
.messageIn.pinned,
|
||||
.messageOut.from-admin.pinned,
|
||||
.messageIn.from-admin.pinned {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,6 +64,10 @@
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.poll-answer:not(:last-child) {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.poll-percent-indicator {
|
||||
position: absolute;
|
||||
bottom: 2px;
|
||||
|
|
|
|||
7
src/assets/icons/ic_like.vue
Normal file
7
src/assets/icons/ic_like.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<svg width="23" height="22" viewBox="0 0 23 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M0.937496 8.11875C0.937496 12.4078 4.59281 16.6369 10.3003 20.2444C10.6172 20.4347 10.9941 20.625 11.25 20.625C11.5153 20.625 11.8931 20.4347 12.1997 20.2444C17.9062 16.6369 21.5625 12.4069 21.5625 8.11875C21.5625 4.44 18.9797 1.875 15.63 1.875C13.6903 1.875 12.1687 2.75625 11.25 4.08C10.3519 2.7675 8.82 1.875 6.87 1.875C3.53062 1.875 0.937496 4.44 0.937496 8.11875Z"
|
||||
stroke="#1C1C31" stroke-width="1.875" />
|
||||
</svg>
|
||||
</template>
|
||||
7
src/assets/icons/ic_like_filled.vue
Normal file
7
src/assets/icons/ic_like_filled.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<svg width="23" height="22" viewBox="0 0 23 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M0.937496 8.11875C0.937496 12.4078 4.59281 16.6369 10.3003 20.2444C10.6172 20.4347 10.9941 20.625 11.25 20.625C11.5153 20.625 11.8931 20.4347 12.1997 20.2444C17.9062 16.6369 21.5625 12.4069 21.5625 8.11875C21.5625 4.44 18.9797 1.875 15.63 1.875C13.6903 1.875 12.1687 2.75625 11.25 4.08C10.3519 2.7675 8.82 1.875 6.87 1.875C3.53062 1.875 0.937496 4.44 0.937496 8.11875Z"
|
||||
stroke="#1C1C31" stroke-width="1.875" fill="#1C1C31" />
|
||||
</svg>
|
||||
</template>
|
||||
8
src/assets/icons/ic_pin.vue
Normal file
8
src/assets/icons/ic_pin.vue
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<template>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M15.7073 13.6872L17.6164 10.9004C17.7545 10.6988 17.9912 10.588 18.2345 10.6111C18.4308 10.6297 18.6254 10.5611 18.7668 10.4236L19.0964 10.1028C19.5543 9.6572 19.7832 9.43441 19.855 9.17105C19.9019 8.9989 19.9019 8.81733 19.855 8.64518C19.7832 8.38182 19.5543 8.15903 19.0964 7.71343L16.4271 5.11574C16.0064 4.7064 15.7961 4.50174 15.5519 4.43288C15.3745 4.38285 15.1866 4.38285 15.0092 4.43288C14.765 4.50174 14.5547 4.7064 14.134 5.11574L13.7465 5.4929C13.5929 5.64236 13.5245 5.85893 13.5645 6.06947C13.613 6.32422 13.5024 6.58294 13.2849 6.72408L10.4028 8.59391L10.4027 8.59393C9.91388 8.91108 9.66945 9.06966 9.41623 9.20907C8.85769 9.51658 8.2644 9.75622 7.64897 9.92288C7.36996 9.99843 7.08396 10.0541 6.51198 10.1654L6.51195 10.1654L5.66826 10.3296C5.08079 10.444 4.80785 11.1271 5.15478 11.6148C7.16198 14.4362 9.66135 16.8728 12.533 18.8075L12.6081 18.858C13.1023 19.191 13.7762 18.9158 13.8962 18.3321L14.0479 17.5941C14.1585 17.0557 14.2138 16.7865 14.2867 16.524C14.4737 15.8504 14.7481 15.2043 15.103 14.6021C15.2414 14.3674 15.3967 14.1406 15.7073 13.6872Z"
|
||||
stroke="#222222" stroke-width="1.2" />
|
||||
<path d="M8.30331 15.668L3.00001 20.9713" stroke="black" stroke-width="1.2" stroke-linecap="round" />
|
||||
</svg>
|
||||
</template>
|
||||
8
src/assets/icons/ic_pin_filled.vue
Normal file
8
src/assets/icons/ic_pin_filled.vue
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<template>
|
||||
<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M16.2072 13.6872L18.1163 10.9004C18.2545 10.6988 18.4911 10.588 18.7344 10.6111C18.9307 10.6297 19.1254 10.5611 19.2667 10.4236L19.5963 10.1028C20.0542 9.6572 20.2832 9.43441 20.3549 9.17105C20.4018 8.9989 20.4018 8.81733 20.3549 8.64518C20.2832 8.38182 20.0542 8.15903 19.5963 7.71343L16.927 5.11574L16.927 5.11573C16.5063 4.7064 16.296 4.50174 16.0518 4.43288C15.8744 4.38285 15.6865 4.38285 15.5091 4.43288C15.2649 4.50174 15.0546 4.7064 14.6339 5.11574L14.2464 5.4929C14.0928 5.64236 14.0245 5.85893 14.0645 6.06947C14.1129 6.32422 14.0023 6.58294 13.7848 6.72408L10.9027 8.59391C10.4138 8.91107 10.1694 9.06965 9.91614 9.20907C9.3576 9.51658 8.7643 9.75622 8.14887 9.92288C7.86986 9.99843 7.58386 10.0541 7.01186 10.1654L6.16816 10.3296C5.5807 10.444 5.30775 11.1271 5.65469 11.6148C7.66189 14.4362 10.1613 16.8728 13.0329 18.8075L13.108 18.858C13.6022 19.191 14.2761 18.9158 14.3961 18.3321L14.5478 17.5941L14.5478 17.5941C14.6584 17.0557 14.7137 16.7865 14.7866 16.524C14.9736 15.8504 15.248 15.2043 15.603 14.6021C15.7413 14.3674 15.8966 14.1406 16.2072 13.6872L16.2072 13.6872Z"
|
||||
fill="black" stroke="#222222" stroke-width="1.2" />
|
||||
<path d="M8.80322 15.668L3.49992 20.9713" stroke="black" stroke-width="1.2" stroke-linecap="round" />
|
||||
</svg>
|
||||
</template>
|
||||
Loading…
Add table
Add a link
Reference in a new issue