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

CASH-313 chat styling.

Browse source
This commit is contained in:
Bryan Mauger 2025-05-05 10:04:55 -04:00
parent 68e49b26bb
commit 61a975a715
1 changed files with 54 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -51,7 +51,7 @@ export default {
};
</script>
<style type="text/css">
<style lang="scss">
.salesforce-webchat {
.salesforce-chat-button {
width: 1.5rem;
@ -65,52 +65,78 @@ export default {
}
}
/* .embeddedServiceHelpButton .helpButton .uiButton {
background-color: red;
font-family: "Arial", sans-serif;
.dockableContainer.showDockableContainer .sidebarBody {
button {
background: #0070d1;
color: #fff;
&:hover {
background: #06577c!important;
}
}
.embeddedServiceSidebarFormField .uiInput input {
border: 1px solid #8e9292;
}
.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;
}
}
.embeddedServiceHelpButton .helpButton .uiButton:focus {
outline: 1px solid #167cac;
} */
.embeddedServiceHelpButton .helpButton .uiButton {
background-color: #0070d1!important;
background-color: #0070d1 !important;
}
.modalContainer.sidebarMinimized.layout-docked.embeddedServiceSidebar .embeddedServiceSidebarMinimizedDefaultUI.helpButton,
.modalContainer.sidebarMinimized.layout-docked.embeddedServiceSidebar .sidebarHeader.minimizedContainer.embeddedServiceSidebarMinimizedDefaultUI {
.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,
.dockableContainer.showDockableContainer .sidebarBody .embeddedServiceLiveAgentStateChatAvatar.isLightningOutContext .agentIconColor0 {
.dockableContainer.showDockableContainer .chatHeaderBranding {
background-color: #0070d1;
}
.dockableContainer.showDockableContainer,
.dockableContainer.showDockableContainer .sidebarBody .embeddedServiceSidebarFormField .uiInput .uiLabel-left {
.dockableContainer.showDockableContainer {
font-family: AvertaRegular;
color: #727676;
}
.dockableContainer.showDockableContainer span.required,
.dockableContainer.showDockableContainer .sidebarBody .form-element__help {
.dockableContainer.showDockableContainer span.required {
color: #db0020;
}
.dockableContainer.showDockableContainer .sidebarBody button {
background: linear-gradient(270deg, #0070d1 0%, #003d58 100%);
color: #fff;
}
.dockableContainer.showDockableContainer .sidebarBody button:hover {
.dockableContainer.showDockableContainer .sidebarBody .embeddedServiceSidebarFormField .uiInput input {
border: 1px solid #8e9292;
}
.dockableContainer.showDockableContainer .sidebarBody .embeddedServiceSidebarButton.uiButton--inverse .label {
color: #fff;
text-decoration: underline;
}
</style>