Move common Sass variables into a single file
Part of slowly trying to bring all styles into a single CSS file.
This commit is contained in:
parent
36ccb4618f
commit
ab09379a51
@ -7073,7 +7073,7 @@ body.reset {
|
|||||||
display: block !important; }
|
display: block !important; }
|
||||||
#conversejs .button-primary {
|
#conversejs .button-primary {
|
||||||
color: white;
|
color: white;
|
||||||
background-color: #3AA569; }
|
background-color: #E7A151; }
|
||||||
#conversejs .button-secondary {
|
#conversejs .button-secondary {
|
||||||
color: white;
|
color: white;
|
||||||
background-color: #387592; }
|
background-color: #387592; }
|
||||||
@ -8067,7 +8067,7 @@ body.reset {
|
|||||||
background-color: #E77051; }
|
background-color: #E77051; }
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chatroom-description,
|
#conversejs.converse-embedded .chat-head-chatroom .chatroom-description,
|
||||||
#conversejs .chat-head-chatroom .chatroom-description {
|
#conversejs .chat-head-chatroom .chatroom-description {
|
||||||
color: white;
|
color: #f6ccc1;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
@ -8089,12 +8089,6 @@ body.reset {
|
|||||||
#conversejs.converse-embedded .chat-head-chatroom .chatbox-btn.button-on:before,
|
#conversejs.converse-embedded .chat-head-chatroom .chatbox-btn.button-on:before,
|
||||||
#conversejs .chat-head-chatroom .chatbox-btn.button-on:before {
|
#conversejs .chat-head-chatroom .chatbox-btn.button-on:before {
|
||||||
color: #E77051; }
|
color: #E77051; }
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title,
|
|
||||||
#conversejs .chat-head-chatroom .chat-title {
|
|
||||||
color: #FF977C; }
|
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-name,
|
|
||||||
#conversejs .chat-head-chatroom .chat-title .chatroom-name {
|
|
||||||
color: white; }
|
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-jid,
|
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-jid,
|
||||||
#conversejs .chat-head-chatroom .chat-title .chatroom-jid {
|
#conversejs .chat-head-chatroom .chat-title .chatroom-jid {
|
||||||
font-size: 12px; }
|
font-size: 12px; }
|
||||||
@ -8406,11 +8400,6 @@ body.reset {
|
|||||||
#conversejs .message.chat-msg .spoiler-toggle:before {
|
#conversejs .message.chat-msg .spoiler-toggle:before {
|
||||||
padding-right: 0.25em;
|
padding-right: 0.25em;
|
||||||
whitespace: nowrap; }
|
whitespace: nowrap; }
|
||||||
#conversejs .message.chat-msg .avatar {
|
|
||||||
background: #818479;
|
|
||||||
height: 36px;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 36px; }
|
|
||||||
#conversejs .message.chat-msg .chat-msg-content {
|
#conversejs .message.chat-msg .chat-msg-content {
|
||||||
margin-left: 0.5rem;
|
margin-left: 0.5rem;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
@ -8422,13 +8411,25 @@ body.reset {
|
|||||||
color: #666; }
|
color: #666; }
|
||||||
#conversejs .message.chat-msg .chat-msg-text .emojione {
|
#conversejs .message.chat-msg .chat-msg-text .emojione {
|
||||||
margin-bottom: -6px; }
|
margin-bottom: -6px; }
|
||||||
|
#conversejs .message.chat-msg .avatar {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
background: #818479;
|
||||||
|
height: 36px;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 36px; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading {
|
#conversejs .message.chat-msg .chat-msg-heading {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
padding-right: 0.25rem;
|
||||||
padding-bottom: 0.25rem;
|
padding-bottom: 0.25rem;
|
||||||
display: block; }
|
display: block; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
|
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
|
||||||
font-weight: bold; }
|
font-weight: bold; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
|
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
|
||||||
padding-left: 0.5em; }
|
padding-left: 0.5em; }
|
||||||
|
#conversejs .message.chat-msg.chat-action .chat-msg-heading {
|
||||||
|
margin-top: 0; }
|
||||||
|
#conversejs .message.chat-msg.chat-msg-followup {
|
||||||
|
padding: 0.25rem 1rem; }
|
||||||
#conversejs .message.chat-msg.chat-msg-followup .chat-msg-heading,
|
#conversejs .message.chat-msg.chat-msg-followup .chat-msg-heading,
|
||||||
#conversejs .message.chat-msg.chat-msg-followup .avatar {
|
#conversejs .message.chat-msg.chat-msg-followup .avatar {
|
||||||
display: none; }
|
display: none; }
|
||||||
@ -8602,11 +8603,6 @@ body.reset {
|
|||||||
background: #3d6b00;
|
background: #3d6b00;
|
||||||
color: inherit; }
|
color: inherit; }
|
||||||
|
|
||||||
/*
|
|
||||||
Color scheme helpers:
|
|
||||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
|
||||||
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
|
||||||
*/
|
|
||||||
#conversejs.converse-embedded {
|
#conversejs.converse-embedded {
|
||||||
-webkit-box-sizing: border-box;
|
-webkit-box-sizing: border-box;
|
||||||
-moz-box-sizing: border-box;
|
-moz-box-sizing: border-box;
|
||||||
|
@ -8209,7 +8209,7 @@ body {
|
|||||||
background-color: #E77051; }
|
background-color: #E77051; }
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chatroom-description,
|
#conversejs.converse-embedded .chat-head-chatroom .chatroom-description,
|
||||||
#conversejs .chat-head-chatroom .chatroom-description {
|
#conversejs .chat-head-chatroom .chatroom-description {
|
||||||
color: white;
|
color: #f6ccc1;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
@ -8231,12 +8231,6 @@ body {
|
|||||||
#conversejs.converse-embedded .chat-head-chatroom .chatbox-btn.button-on:before,
|
#conversejs.converse-embedded .chat-head-chatroom .chatbox-btn.button-on:before,
|
||||||
#conversejs .chat-head-chatroom .chatbox-btn.button-on:before {
|
#conversejs .chat-head-chatroom .chatbox-btn.button-on:before {
|
||||||
color: #E77051; }
|
color: #E77051; }
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title,
|
|
||||||
#conversejs .chat-head-chatroom .chat-title {
|
|
||||||
color: #FF977C; }
|
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-name,
|
|
||||||
#conversejs .chat-head-chatroom .chat-title .chatroom-name {
|
|
||||||
color: white; }
|
|
||||||
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-jid,
|
#conversejs.converse-embedded .chat-head-chatroom .chat-title .chatroom-jid,
|
||||||
#conversejs .chat-head-chatroom .chat-title .chatroom-jid {
|
#conversejs .chat-head-chatroom .chat-title .chatroom-jid {
|
||||||
font-size: 14px; }
|
font-size: 14px; }
|
||||||
@ -8405,7 +8399,7 @@ body {
|
|||||||
background-color: orange; }
|
background-color: orange; }
|
||||||
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .occupants ul li.moderator,
|
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .occupants ul li.moderator,
|
||||||
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.moderator {
|
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.moderator {
|
||||||
color: #E77051; }
|
color: #D24E2B; }
|
||||||
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .occupants ul li.visitor,
|
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .occupants ul li.visitor,
|
||||||
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.visitor {
|
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.visitor {
|
||||||
color: #A8ABA1; }
|
color: #A8ABA1; }
|
||||||
@ -8594,11 +8588,6 @@ body {
|
|||||||
#conversejs .message.chat-msg .spoiler-toggle:before {
|
#conversejs .message.chat-msg .spoiler-toggle:before {
|
||||||
padding-right: 0.25em;
|
padding-right: 0.25em;
|
||||||
whitespace: nowrap; }
|
whitespace: nowrap; }
|
||||||
#conversejs .message.chat-msg .avatar {
|
|
||||||
background: #818479;
|
|
||||||
height: 36px;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 36px; }
|
|
||||||
#conversejs .message.chat-msg .chat-msg-content {
|
#conversejs .message.chat-msg .chat-msg-content {
|
||||||
margin-left: 0.5rem;
|
margin-left: 0.5rem;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
@ -8610,13 +8599,25 @@ body {
|
|||||||
color: #666; }
|
color: #666; }
|
||||||
#conversejs .message.chat-msg .chat-msg-text .emojione {
|
#conversejs .message.chat-msg .chat-msg-text .emojione {
|
||||||
margin-bottom: -6px; }
|
margin-bottom: -6px; }
|
||||||
|
#conversejs .message.chat-msg .avatar {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
background: #818479;
|
||||||
|
height: 36px;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 36px; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading {
|
#conversejs .message.chat-msg .chat-msg-heading {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
padding-right: 0.25rem;
|
||||||
padding-bottom: 0.25rem;
|
padding-bottom: 0.25rem;
|
||||||
display: block; }
|
display: block; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
|
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
|
||||||
font-weight: bold; }
|
font-weight: bold; }
|
||||||
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
|
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
|
||||||
padding-left: 0.5em; }
|
padding-left: 0.5em; }
|
||||||
|
#conversejs .message.chat-msg.chat-action .chat-msg-heading {
|
||||||
|
margin-top: 0; }
|
||||||
|
#conversejs .message.chat-msg.chat-msg-followup {
|
||||||
|
padding: 0.25rem 1rem; }
|
||||||
#conversejs .message.chat-msg.chat-msg-followup .chat-msg-heading,
|
#conversejs .message.chat-msg.chat-msg-followup .chat-msg-heading,
|
||||||
#conversejs .message.chat-msg.chat-msg-followup .avatar {
|
#conversejs .message.chat-msg.chat-msg-followup .avatar {
|
||||||
display: none; }
|
display: none; }
|
||||||
|
@ -136,7 +136,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.chat-title {
|
.chat-title {
|
||||||
color: $chat-head-text-color;
|
color: white;
|
||||||
display: block;
|
display: block;
|
||||||
line-height: $line-height-large;
|
line-height: $line-height-large;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -11,7 +11,7 @@
|
|||||||
background-color: $chatroom-head-color;
|
background-color: $chatroom-head-color;
|
||||||
|
|
||||||
.chatroom-description {
|
.chatroom-description {
|
||||||
color: white;
|
color: lighten($chatroom-head-color, 25%);
|
||||||
font-size: $font-size-large;
|
font-size: $font-size-large;
|
||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
@ -37,10 +37,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.chat-title {
|
.chat-title {
|
||||||
color: $chatroom-color-lightest;
|
|
||||||
.chatroom-name {
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
.chatroom-jid {
|
.chatroom-jid {
|
||||||
font-size: $font-size-small;
|
font-size: $font-size-small;
|
||||||
}
|
}
|
||||||
|
@ -19,7 +19,7 @@
|
|||||||
.separator-text {
|
.separator-text {
|
||||||
background: white;
|
background: white;
|
||||||
bottom: 1px; // Offset needed due to .separator border size
|
bottom: 1px; // Offset needed due to .separator border size
|
||||||
color: #666;
|
color: $message-text-color;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
line-height: 2em;
|
line-height: 2em;
|
||||||
padding: 0 1em;
|
padding: 0 1em;
|
||||||
@ -91,13 +91,6 @@
|
|||||||
whitespace: nowrap;
|
whitespace: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.avatar {
|
|
||||||
background: $gray-color;
|
|
||||||
height: 36px;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 36px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chat-msg-content {
|
.chat-msg-content {
|
||||||
margin-left: 0.5rem;
|
margin-left: 0.5rem;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
@ -111,13 +104,22 @@
|
|||||||
|
|
||||||
.chat-msg-text {
|
.chat-msg-text {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
color: #666;
|
color: $message-text-color;
|
||||||
.emojione {
|
.emojione {
|
||||||
margin-bottom: -6px;
|
margin-bottom: -6px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
background: $gray-color;
|
||||||
|
height: 36px;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 36px;
|
||||||
|
}
|
||||||
.chat-msg-heading {
|
.chat-msg-heading {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
padding-right: 0.25rem;
|
||||||
padding-bottom: 0.25rem;
|
padding-bottom: 0.25rem;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
@ -128,7 +130,14 @@
|
|||||||
padding-left: 0.5em;
|
padding-left: 0.5em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&.chat-action {
|
||||||
|
.chat-msg-heading {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
&.chat-msg-followup {
|
&.chat-msg-followup {
|
||||||
|
padding: 0.25rem 1rem;
|
||||||
|
|
||||||
.chat-msg-heading,
|
.chat-msg-heading,
|
||||||
.avatar {
|
.avatar {
|
||||||
display: none;
|
display: none;
|
||||||
|
119
sass/_variables.scss
Normal file
119
sass/_variables.scss
Normal file
@ -0,0 +1,119 @@
|
|||||||
|
/*
|
||||||
|
Color scheme helpers:
|
||||||
|
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
||||||
|
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
||||||
|
*/
|
||||||
|
$subdued-color: #A8ABA1 !default;
|
||||||
|
$gray-color: #818479 !default;
|
||||||
|
$dark-gray-color: #585B51!default;
|
||||||
|
$visitor-color: #A8ABA1 !default;
|
||||||
|
|
||||||
|
$lightest-blue: #89B7CD;
|
||||||
|
$light-blue: #578EA9;
|
||||||
|
$blue: #387592;
|
||||||
|
$dark-blue: #206485;
|
||||||
|
$darkest-blue: #114C68;
|
||||||
|
|
||||||
|
$lightest-red: #FFB9A7;
|
||||||
|
$light-red: #FF977C;
|
||||||
|
$red: #E77051;
|
||||||
|
$dark-red: #D24E2B;
|
||||||
|
$darkest-red: #A53214;
|
||||||
|
|
||||||
|
$lightest-orange: #FFD6A7;
|
||||||
|
$light-orange: #E7A151;
|
||||||
|
$orange: #E7A151;
|
||||||
|
$dark-orange: #D2842B;
|
||||||
|
$darkest-orange: #A56214;
|
||||||
|
|
||||||
|
$greenish-white: #E7FBF0;
|
||||||
|
$reddish-white: #FFECE7;
|
||||||
|
|
||||||
|
$light-green: #5CBC86;
|
||||||
|
$green: #3AA569;
|
||||||
|
$dark-green: #1E9652;
|
||||||
|
$darkest-green: #0E763B;
|
||||||
|
|
||||||
|
$lightest-green: #E7FBF0;
|
||||||
|
$light-green: #5CBC86;
|
||||||
|
$green: #3AA569;
|
||||||
|
$dark-green: #1E9652;
|
||||||
|
$darkest-green: #0E763B;
|
||||||
|
|
||||||
|
$link-color: $light-blue !default;
|
||||||
|
$dark-link-color: $dark-blue !default;
|
||||||
|
$global-background-color: $light-blue !default;
|
||||||
|
|
||||||
|
$inverse-link-color: white !default;
|
||||||
|
$link-shadow-color: #FAFAFA !default;
|
||||||
|
$text-shadow-color: #FAFAFA !default;
|
||||||
|
$text-color: #777 !default;
|
||||||
|
$message-text-color: #666 !default;
|
||||||
|
$light-text-color: #A8ABA1 !default;
|
||||||
|
$border-color: #CCC !default;
|
||||||
|
$icon-color: $blue !default;
|
||||||
|
$save-button-color: $green !default;
|
||||||
|
|
||||||
|
$chat-textarea-height: 60px !default;
|
||||||
|
|
||||||
|
$send-button-height: 27px !default;
|
||||||
|
$send-button-margin: 3px !default;
|
||||||
|
|
||||||
|
$message-them-color: $green !default;
|
||||||
|
|
||||||
|
$roster-height: 194px !default;
|
||||||
|
|
||||||
|
$chat-head-color: $green !default;
|
||||||
|
$chat-head-text-color: white !default;
|
||||||
|
$chat-head-inverse-text-color: white !default;
|
||||||
|
|
||||||
|
$input-focus-color: #1A9707 !default;
|
||||||
|
$highlight-color: #DCF9F6 !default;
|
||||||
|
|
||||||
|
$primary-color: $orange !default;
|
||||||
|
$secondary-color: $blue !default;
|
||||||
|
$warning-color: $dark-red !default;
|
||||||
|
|
||||||
|
$light-background-border-color: #B1BFC4 !default;
|
||||||
|
$light-background-color: #FCFDFD !default;
|
||||||
|
|
||||||
|
$moderator-color: $dark-red !default;
|
||||||
|
$online-color: $green !default;
|
||||||
|
$error-color: $darkest-red !default;
|
||||||
|
$info-color: $dark-green !default;
|
||||||
|
|
||||||
|
$rounded-border-radius: 4px !default;
|
||||||
|
|
||||||
|
$button-border-radius: 5px !default;
|
||||||
|
$chatbox-border-radius: 4px !default;
|
||||||
|
$bottom-gutter-height: 35px !default;
|
||||||
|
|
||||||
|
$mobile_landscape_height: 450px !default;
|
||||||
|
$mobile_portrait_length: 480px !default;
|
||||||
|
|
||||||
|
$message-font-size: 14px !default;
|
||||||
|
|
||||||
|
$font-size-tiny: 10px !default;
|
||||||
|
|
||||||
|
$controlbox-width: 250px !default;
|
||||||
|
$chat-gutter: 0.5em !default;
|
||||||
|
$minimized-chats-width: 130px !default;
|
||||||
|
|
||||||
|
$mobile-chat-width: 100% !default;
|
||||||
|
$mobile-chat-height: 400px !default;
|
||||||
|
$small-mobile-chat-height: 300px !default;
|
||||||
|
|
||||||
|
$font-path: "../fonticons/fonts/" !default;
|
||||||
|
|
||||||
|
$chatroom-head-color: $red !default;
|
||||||
|
$chatroom-color-light: $light-red !default;
|
||||||
|
$chatroom-color-dark: $darkest-red !default;
|
||||||
|
$chatroom-message-them-color: $green !default;
|
||||||
|
|
||||||
|
$headline-head-color: $orange !default;
|
||||||
|
|
||||||
|
$box-close-button-padding-top: 4px !default;
|
||||||
|
$box-close-button-padding-bottom: 4px !default;
|
||||||
|
$box-close-button-padding-left: 4px !default;
|
||||||
|
$box-close-button-padding-right: 4px !default;
|
||||||
|
$box-close-font-size: 16px !default;
|
@ -7,6 +7,7 @@
|
|||||||
*/
|
*/
|
||||||
@import "font-awesome";
|
@import "font-awesome";
|
||||||
@import "bourbon";
|
@import "bourbon";
|
||||||
|
@import "variables";
|
||||||
@import "converse/variables";
|
@import "converse/variables";
|
||||||
|
|
||||||
@import "bootstrap/scss/functions";
|
@import "bootstrap/scss/functions";
|
||||||
|
@ -1,139 +1,28 @@
|
|||||||
/*
|
|
||||||
Color scheme helpers:
|
|
||||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
|
||||||
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
|
||||||
*/
|
|
||||||
|
|
||||||
$subdued-color: #A8ABA1 !default;
|
|
||||||
$gray-color: #818479 !default;
|
|
||||||
$dark-gray-color: #585B51!default;
|
|
||||||
$visitor-color: #A8ABA1 !default;
|
|
||||||
|
|
||||||
$lightest-blue: #89B7CD;
|
|
||||||
$light-blue: #578EA9;
|
|
||||||
$blue: #387592;
|
|
||||||
$dark-blue: #206485;
|
|
||||||
$darkest-blue: #114C68;
|
|
||||||
|
|
||||||
$lightest-red: #FFB9A7;
|
|
||||||
$light-red: #FF977C;
|
|
||||||
$red: #E77051;
|
|
||||||
$dark-red: #D24E2B;
|
|
||||||
$darkest-red: #A53214;
|
|
||||||
|
|
||||||
$lightest-orange: #FFD6A7;
|
|
||||||
$light-orange: #E7A151;
|
|
||||||
$orange: #E7A151;
|
|
||||||
$dark-orange: #D2842B;
|
|
||||||
$darkest-orange: #A56214;
|
|
||||||
|
|
||||||
$greenish-white: #E7FBF0;
|
|
||||||
$reddish-white: #FFECE7;
|
|
||||||
|
|
||||||
$lightest-green: #BCEDD1;
|
|
||||||
$light-green: #5CBC86;
|
|
||||||
$green: #3AA569;
|
|
||||||
$dark-green: #1E9652;
|
|
||||||
$darkest-green: #0E763B;
|
|
||||||
|
|
||||||
$link-color: $light-blue !default;
|
|
||||||
$dark-link-color: $dark-blue !default;
|
|
||||||
$global-background-color: $light-blue !default;
|
|
||||||
|
|
||||||
$inverse-link-color: white !default;
|
|
||||||
$link-shadow-color: #FAFAFA !default;
|
|
||||||
$text-shadow-color: #FAFAFA !default;
|
|
||||||
$text-color: #777 !default;
|
|
||||||
$light-text-color: #A8ABA1 !default;
|
|
||||||
$border-color: #CCC !default;
|
|
||||||
$icon-color: $blue !default;
|
|
||||||
$save-button-color: $green !default;
|
|
||||||
$chat-textarea-height: 60px !default;
|
|
||||||
$max-chat-textarea-height: 200px !default;
|
$max-chat-textarea-height: 200px !default;
|
||||||
$send-button-height: 27px !default;
|
$emoji-picker-height: 100px !default;
|
||||||
$send-button-margin: 3px !default;
|
|
||||||
|
|
||||||
$message-them-color: $green !default;
|
|
||||||
|
|
||||||
$roster-height: 194px !default;
|
|
||||||
$roster-item-height: 60px !default;
|
$roster-item-height: 60px !default;
|
||||||
|
|
||||||
$chat-head-color: $green !default;
|
|
||||||
$chat-head-text-color: white !default;
|
|
||||||
$chat-head-inverse-text-color: white !default;
|
|
||||||
$chat-head-height: 55px !default;
|
$chat-head-height: 55px !default;
|
||||||
|
|
||||||
$input-focus-color: #1A9707 !default;
|
|
||||||
$highlight-color: #DCF9F6 !default;
|
|
||||||
|
|
||||||
$controlbox-dropdown-height: 25px !default;
|
$controlbox-dropdown-height: 25px !default;
|
||||||
$controlbox-head-color: $light-blue !default;
|
$controlbox-head-color: $light-blue !default;
|
||||||
$controlbox-head-height: 55px !default;
|
$controlbox-head-height: 55px !default;
|
||||||
$controlbox-pane-padding: 1em !default;
|
$controlbox-pane-padding: 1em !default;
|
||||||
|
|
||||||
$primary-color: $green !default;
|
|
||||||
$secondary-color: $blue !default;
|
|
||||||
$warning-color: $dark-red !default;
|
|
||||||
|
|
||||||
$light-background-border-color: #B1BFC4 !default;
|
|
||||||
$light-background-color: #FCFDFD !default;
|
|
||||||
|
|
||||||
$moderator-color: $dark-red !default;
|
|
||||||
$online-color: $green !default;
|
|
||||||
$error-color: $darkest-red !default;
|
|
||||||
$info-color: $dark-green !default;
|
|
||||||
|
|
||||||
$rounded-border-radius: 4px !default;
|
|
||||||
|
|
||||||
$button-border-radius: 5px !default;
|
|
||||||
$chatbox-border-radius: 4px !default;
|
|
||||||
$bottom-gutter-height: 35px !default;
|
|
||||||
$chatbox-hover-height: 1em !default;
|
$chatbox-hover-height: 1em !default;
|
||||||
|
|
||||||
$mobile_landscape_height: 450px !default;
|
|
||||||
$mobile_portrait_length: 480px !default;
|
|
||||||
|
|
||||||
$message-font-size: 14px !default;
|
|
||||||
|
|
||||||
$font-size-tiny: 10px !default;
|
|
||||||
$font-size-small: 12px !default;
|
$font-size-small: 12px !default;
|
||||||
$font-size: 14px !default;
|
$font-size: 14px !default;
|
||||||
$font-size-large: 16px !default;
|
$font-size-large: 16px !default;
|
||||||
$font-size-huge: 20px !default;
|
$font-size-huge: 20px !default;
|
||||||
$legend-font-size: 16px !default;
|
$legend-font-size: 16px !default;
|
||||||
|
|
||||||
$toolbar-color: $greenish-white !default;
|
|
||||||
|
|
||||||
$emoji-picker-height: 100px !default;
|
|
||||||
|
|
||||||
$line-height-small: 14px !default;
|
$line-height-small: 14px !default;
|
||||||
$line-height: 16px !default;
|
$line-height: 16px !default;
|
||||||
$line-height-large: 20px !default;
|
$line-height-large: 20px !default;
|
||||||
|
|
||||||
$controlbox-width: 250px !default;
|
|
||||||
$chat-width: 250px !default;
|
$chat-width: 250px !default;
|
||||||
$chat-height: 450px !default;
|
$chat-height: 450px !default;
|
||||||
$chat-gutter: 0.5em !default;
|
|
||||||
$minimized-chats-width: 130px !default;
|
|
||||||
|
|
||||||
$mobile-chat-width: 100% !default;
|
|
||||||
$mobile-chat-height: 400px !default;
|
|
||||||
$small-mobile-chat-height: 300px !default;
|
|
||||||
|
|
||||||
$font-path: "../fonticons/fonts/" !default;
|
|
||||||
|
|
||||||
$chatroom-width: 400px !default;
|
$chatroom-width: 400px !default;
|
||||||
$chatroom-head-color: $red !default;
|
|
||||||
$chatroom-color-light: $light-red !default;
|
|
||||||
$chatroom-color-lightest: $light-red !default;
|
|
||||||
$chatroom-color-dark: $darkest-red !default;
|
|
||||||
$chatroom-message-them-color: $green !default;
|
|
||||||
$chatroom-toolbar-color: $reddish-white !default;
|
|
||||||
|
|
||||||
$headline-head-color: $orange !default;
|
|
||||||
|
|
||||||
$box-close-button-padding-top: 4px !default;
|
|
||||||
$box-close-button-padding-bottom: 4px !default;
|
|
||||||
$box-close-button-padding-left: 4px !default;
|
|
||||||
$box-close-button-padding-right: 4px !default;
|
|
||||||
$box-close-font-size: 16px !default;
|
|
||||||
|
@ -7,6 +7,7 @@
|
|||||||
*/
|
*/
|
||||||
@import "font-awesome";
|
@import "font-awesome";
|
||||||
@import "bourbon";
|
@import "bourbon";
|
||||||
|
@import "variables";
|
||||||
@import "inverse/variables";
|
@import "inverse/variables";
|
||||||
|
|
||||||
@import "bootstrap/scss/functions";
|
@import "bootstrap/scss/functions";
|
||||||
|
@ -1,145 +1,36 @@
|
|||||||
/*
|
$max-chat-textarea-height: 400px !default;
|
||||||
Color scheme helpers:
|
|
||||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
|
||||||
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
|
||||||
*/
|
|
||||||
$subdued-color: #A8ABA1 !default;
|
|
||||||
$gray-color: #818479 !default;
|
|
||||||
$dark-gray-color: #585B51!default;
|
|
||||||
$visitor-color: #A8ABA1 !default;
|
|
||||||
|
|
||||||
$lightest-blue: #89B7CD;
|
|
||||||
$light-blue: #578EA9;
|
|
||||||
$blue: #387592;
|
|
||||||
$dark-blue: #206485;
|
|
||||||
$darkest-blue: #114C68;
|
|
||||||
|
|
||||||
$lightest-red: #FFB9A7;
|
|
||||||
$light-red: #FF977C;
|
|
||||||
$red: #E77051;
|
|
||||||
$dark-red: #D24E2B;
|
|
||||||
$darkest-red: #A53214;
|
|
||||||
|
|
||||||
$lightest-orange: #FFD6A7;
|
|
||||||
$light-orange: #E7A151;
|
|
||||||
$orange: #E7A151;
|
|
||||||
$dark-orange: #D2842B;
|
|
||||||
$darkest-orange: #A56214;
|
|
||||||
|
|
||||||
$greenish-white: #E7FBF0;
|
|
||||||
$reddish-white: #FFECE7;
|
|
||||||
|
|
||||||
$lightest-green: #E7FBF0;
|
|
||||||
$light-green: #5CBC86;
|
|
||||||
$green: #3AA569;
|
|
||||||
$dark-green: #1E9652;
|
|
||||||
$darkest-green: #0E763B;
|
|
||||||
|
|
||||||
$link-color: $light-blue !default;
|
|
||||||
$dark-link-color: $dark-blue !default;
|
|
||||||
$global-background-color: $light-blue !default;
|
|
||||||
|
|
||||||
$inverse-link-color: white !default;
|
|
||||||
$link-shadow-color: #FAFAFA !default;
|
|
||||||
$text-shadow-color: #FAFAFA !default;
|
|
||||||
$text-color: #777 !default;
|
|
||||||
$light-text-color: #A8ABA1 !default;
|
|
||||||
$border-color: #CCC !default;
|
|
||||||
$icon-color: $blue !default;
|
|
||||||
$save-button-color: $green !default;
|
|
||||||
$send-button-height: 27px !default;
|
|
||||||
$send-button-margin: 3px !default;
|
|
||||||
|
|
||||||
$message-them-color: $green !default;
|
|
||||||
|
|
||||||
$emoji-picker-height: 150px !default;
|
$emoji-picker-height: 150px !default;
|
||||||
|
|
||||||
$roster-height: 194px !default;
|
|
||||||
$roster-item-height: 30px !default;
|
$roster-item-height: 30px !default;
|
||||||
|
|
||||||
$flyout-padding: 1.2em;
|
$flyout-padding: 1.2em;
|
||||||
|
|
||||||
$chat-head-color: $green !default;
|
|
||||||
$chat-head-text-color: white !default;
|
|
||||||
$chat-head-inverse-text-color: white !default;
|
|
||||||
$chat-head-height: 62px !default;
|
$chat-head-height: 62px !default;
|
||||||
|
|
||||||
$chat-textarea-height: 60px !default;
|
|
||||||
$max-chat-textarea-height: 400px !default;
|
|
||||||
|
|
||||||
$input-focus-color: #1A9707 !default;
|
|
||||||
$highlight-color: #DCF9F6 !default;
|
|
||||||
|
|
||||||
$controlbox-dropdown-height: 30px !default;
|
$controlbox-dropdown-height: 30px !default;
|
||||||
$controlbox-head-color: $light-blue !default;
|
$controlbox-head-color: $light-blue !default;
|
||||||
$controlbox-head-height: 63px !default;
|
$controlbox-head-height: 63px !default;
|
||||||
$controlbox-pane-padding: $flyout-padding !default;
|
$controlbox-pane-padding: $flyout-padding !default;
|
||||||
|
|
||||||
$primary-color: $orange !default;
|
|
||||||
$secondary-color: $blue !default;
|
|
||||||
$warning-color: $dark-red !default;
|
|
||||||
|
|
||||||
$light-background-border-color: #B1BFC4 !default;
|
|
||||||
$light-background-color: #FCFDFD !default;
|
|
||||||
|
|
||||||
$moderator-color: $red !default;
|
|
||||||
$online-color: $green !default;
|
|
||||||
$error-color: $darkest-red !default;
|
|
||||||
$info-color: $dark-green !default;
|
|
||||||
|
|
||||||
$rounded-border-radius: 4px !default;
|
$rounded-border-radius: 4px !default;
|
||||||
|
|
||||||
$button-border-radius: 5px !default;
|
|
||||||
$chatbox-border-radius: 4px !default;
|
|
||||||
$bottom-gutter-height: 35px !default;
|
|
||||||
$chatbox-hover-height: 6px !default;
|
$chatbox-hover-height: 6px !default;
|
||||||
|
|
||||||
$mobile_landscape_height: 450px !default;
|
|
||||||
$mobile_portrait_length: 480px !default;
|
|
||||||
|
|
||||||
$message-font-size: 14px !default;
|
|
||||||
|
|
||||||
$font-size-tiny: 10px !default;
|
|
||||||
$font-size-small: 14px !default;
|
$font-size-small: 14px !default;
|
||||||
$font-size: 16px !default;
|
$font-size: 16px !default;
|
||||||
$font-size-large: 18px !default;
|
$font-size-large: 18px !default;
|
||||||
$font-size-huge: 26px !default;
|
$font-size-huge: 26px !default;
|
||||||
$legend-font-size: 18px !default;
|
$legend-font-size: 18px !default;
|
||||||
|
|
||||||
$toolbar-color: $greenish-white !default;
|
|
||||||
|
|
||||||
$line-height-small: 20px !default;
|
$line-height-small: 20px !default;
|
||||||
$line-height: 22px !default;
|
$line-height: 22px !default;
|
||||||
$line-height-large: 24px !default;
|
$line-height-large: 24px !default;
|
||||||
$line-height-huge: 30px !default;
|
$line-height-huge: 30px !default;
|
||||||
|
|
||||||
$controlbox-width: 250px !default;
|
|
||||||
$chat-width: 100% !default;
|
$chat-width: 100% !default;
|
||||||
$chat-height: 100%;
|
$chat-height: 100%;
|
||||||
$chat-gutter: 0.5em !default;
|
|
||||||
$minimized-chats-width: 130px !default;
|
|
||||||
|
|
||||||
$padding: 1em;
|
$padding: 1em;
|
||||||
|
|
||||||
$mobile-chat-width: 100% !default;
|
|
||||||
$mobile-chat-height: 400px !default;
|
|
||||||
$small-mobile-chat-height: 300px !default;
|
|
||||||
|
|
||||||
$font-path: "../fonticons/fonts/" !default;
|
|
||||||
|
|
||||||
$chatroom-head-height: 62px !default;
|
$chatroom-head-height: 62px !default;
|
||||||
$chatroom-width: 300px !default;
|
$chatroom-width: 300px !default;
|
||||||
$chatroom-head-color: $red !default;
|
|
||||||
$chatroom-color-light: $light-red !default;
|
|
||||||
$chatroom-color-lightest: $light-red !default;
|
|
||||||
$chatroom-color-dark: $darkest-red !default;
|
|
||||||
$chatroom-message-them-color: $green !default;
|
|
||||||
$chatroom-toolbar-color: $reddish-white !default;
|
|
||||||
|
|
||||||
$headline-head-color: $orange !default;
|
|
||||||
|
|
||||||
$box-close-button-padding-top: 4px !default;
|
|
||||||
$box-close-button-padding-bottom: 4px !default;
|
|
||||||
$box-close-button-padding-left: 4px !default;
|
|
||||||
$box-close-button-padding-right: 4px !default;
|
|
||||||
$box-close-font-size: 16px !default;
|
|
||||||
|
Loading…
Reference in New Issue
Block a user