jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #2488 from Safelite/CASH-313-chat-style-updates

Browse source 
CASH-313 Chat style updates.
This commit is contained in:
bmauger 2025-05-06 16:16:55 -04:00 committed by GitHub
commit 92bb35c21b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 97 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

164
src/digital-components/salesforce-webchat/salesforce-webchat.vue
View file

@ -65,77 +65,107 @@ export default {
}
}
.dockableContainer.showDockableContainer .sidebarBody {
button {
background: #0070d1;
color: #fff;
&:hover {
background: #06577c !important;
.dockableContainer {
&.showDockableContainer {
font-family: AvertaRegular;
color: #4d5151;
.sidebarBody {
button {
background: #0070d1;
color: #fff;
&:hover {
background: #06577c !important;
}
}
.form-element__help {
color: #db0020;
}
.embeddedServiceSidebarFormField {
.uiInput {
.uiLabel-left {
color: #4d5151;
}
}
}
.embeddedServiceSidebarButton {
&.uiButton--inverse {
.label {
color: #fff;
text-decoration: underline;
}
&:not(:disabled):focus {
background-color: #0070d1;
}
}
}
.embeddedServiceLiveAgentStateChatAvatar {
&.isLightningOutContext {
.agentIconColor0 {
background-color: #0070d1;
}
}
}
.embeddedServiceLiveAgentStateChatInputFooter {
.footerMenuWrapper {
.footer-menu-items {
.slds-dropdown__item {
> a {
padding-left: 0;
max-width: 100%;
display: flex;
justify-content: center;
}
}
}
}
}
.embeddedServiceLiveAgentStateChatInputFooter {
.footerMenuWrapper {
.footer-menu-items {
a {
margin: 0 auto;
}
}
}
}
}
.chatHeaderBranding {
background-color: #0070d1;
}
span {
&.required {
color: #db0020;
}
}
}
.embeddedServiceSidebarFormField .uiInput input {
border: 1px solid #8e9292;
}
.embeddedServiceHelpButton {
.helpButton {
.uiButton {
background-color: #0070d1 !important;
}
}
.embeddedServiceSidebarButton.uiButton--inverse .label {
color: #fff;
text-decoration: underline;
}
.embeddedServiceLiveAgentStateChatAvatar.isLightningOutContext .agentIconColor0 {
background-color: #0070d1;
}
.embeddedServiceSidebarFormField .uiInput .uiLabel-left {
font-family: AvertaRegular;
color: #727676;
}
.form-element__help {
color: #db0020;
}
.embeddedServiceSidebarFormField .uiInput input {
border: 1px solid #06577c;
}
.embeddedServiceLiveAgentStateChatInputFooter
.footerMenuWrapper
.footer-menu-items
.slds-dropdown__item
> a {
padding-left: 0;
max-width: 100%;
display: flex;
justify-content: center;
}
.embeddedServiceLiveAgentStateChatInputFooter .footerMenuWrapper .footer-menu-items a {
margin: 0 auto;
}
.embeddedServiceSidebarButton.uiButton--inverse:not(:disabled):focus {
background-color: #0070d1;
.embeddedServiceIcon {
display: inline-block !important;
}
}
.embeddedServiceHelpButton .helpButton .uiButton {
background-color: #0070d1 !important;
}
.modalContainer.sidebarMinimized.layout-docked.embeddedServiceSidebar
.embeddedServiceSidebarMinimizedDefaultUI.helpButton,
.modalContainer.sidebarMinimized.layout-docked.embeddedServiceSidebar
.sidebarHeader.minimizedContainer.embeddedServiceSidebarMinimizedDefaultUI {
background-color: #0070d1;
border: 1px solid #0070d1;
}
.dockableContainer.showDockableContainer .chatHeaderBranding {
background-color: #0070d1;
}
.dockableContainer.showDockableContainer {
font-family: AvertaRegular;
color: #727676;
}
.dockableContainer.showDockableContainer span.required {
color: #db0020;
}
.dockableContainer.showDockableContainer .sidebarBody button:hover {
.modalContainer {
&.sidebarMinimized {
&.layout-docted {
&.embeddedServiceSidebar {
.embeddedServiceSidebarMinimizedDefaultUI {
.helpButton,
.sidebarHeader {
&.minimizedContainer {
.embeddedServiceSidebarMinimizedDefaultUI {
background-color: #0070d1;
border: 1px solid #0070d1;
}
}
}
}
}
}
}
}
</style>