butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

More poll styling

Browse source
This commit is contained in:
N Pex 2022-05-17 15:16:53 +00:00
parent 98ed17723d
commit 32ebd86c5d
12 changed files with 361 additions and 344 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/assets/css/_variables.scss
View file

@ -15,5 +15,5 @@ $chat-button-height: 50px;
$voice-recorder-color: #6f6f6f;
$voice-recording-color: red;
$voice-recorded-color: #3ae17d;
$poll-hilite-color: $very-very-purple;
$poll-hilite-color: #6360f0;
$poll-hilite-color-bg: #d6d5fc;

4
src/assets/css/chat.scss
View file

@ -611,6 +611,10 @@ $admin-fg: white;
box-shadow: 4px 4px 8px rgba(0,0,0,0.15);
}
.send-options {
z-index: 11; // Above mic button
}
.message-operations-picker {
background-color: white;
text-align: center;

83
src/assets/css/components/_poll.scss
View file

@ -2,19 +2,57 @@
width: 70%;
}
.poll-bubble {
color: black;
padding: $chat-standard-padding-s !important;
font-family: "Inter", sans-serif;
font-size: 16 * $chat-text-size;
line-height: 16 * $chat-text-size;
}
.from-admin .poll-bubble {
color: rgba(white, 0.9);
}
.poll-icon {
path {
fill: currentColor;
}
}
.poll-check-icon {
width: 14.18px;
height: 12px;
}
.poll-question {
font-weight: 700;
margin-top: $chat-standard-padding-xs;
margin-bottom: $chat-standard-padding-s;
}
.poll-answer {
border: 1px solid #666;
border-radius: 5px;
padding: 10px;
margin: 10px;
border: 1px solid currentColor;
border-radius: 4px;
padding: 15px 14px;
margin: 0px;
&.winner {
font-weight: 700;
}
&.selected {
border: 1px solid $poll-hilite-color;
background-color: $poll-hilite-color-bg;
color: #1d1d1d;
font-weight: 700;
}
&.result {
border: none;
padding: 15px 0px;
}
.poll-answer-title {
color: #444;
}
.poll-answer-num-votes {
font-size: 0.7rem;
font-size: 0.75rem;
}
justify-content: space-between;
position: relative;
@ -23,32 +61,49 @@
.poll-percent-indicator {
position: absolute;
bottom: 2px;
left: 2px;
right: 2px;
height: 4px;
left: 0px;
right: 0px;
height: 8px;
margin-top: 4px;
.bar {
background-color: $poll-hilite-color;
background-color: #7e7cf8;
position: absolute;
bottom: 0px;
left: 0px;
top: 0px;
border-radius: 3px;
border-radius: 4px;
}
}
.poll-status {
margin: 10px;
justify-content: space-between;
font-size: 13px;
line-height: 117%;
margin: 0px;
.poll-status-title {
font-size: 0.7rem;
}
.poll-status-close {
font-size: 0.7rem;
color: $poll-hilite-color;
}
}
.poll-submit {
.v-btn {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 11 * $chat-text-size;
color: white;
text-transform: uppercase;
background-color: $poll-hilite-color !important;
border: 1px solid black;
border-radius: 21px !important;
height: 42px !important;
margin-top: $chat-standard-padding-xs;
margin-bottom: $chat-standard-padding-xs;
}
}
// Creation dialog
//
.poll-create-dialog-content {