Skip to content

Instantly share code, notes, and snippets.

@marktenney
Created October 27, 2021 14:30
Show Gist options
  • Save marktenney/cf54f0e84a0b15f25aee21262b94e51f to your computer and use it in GitHub Desktop.
Save marktenney/cf54f0e84a0b15f25aee21262b94e51f to your computer and use it in GitHub Desktop.
/* Styles for wireframes at dev.digitalchurch.website/wireframe */
.bg-img-placeholder > .fl-row-content-wrap,
.bg-img-placeholder > .fl-col-content {
background-color: #1a202b;
background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMTQxNjFiIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0wIDQwTDQwIDBIMjBMMCAyME00MCA0MFYyMEwyMCA0MCIvPjwvZz48L3N2Zz4=);
background-size: 24px;
}
.fl-builder-content a.fl-button *, .fl-builder-content a.fl-button:visited * {
color:unset;
}
.fl-builder-content a.fl-button,
.fl-builder-content a.fl-button:visited {
background-color:var(--global-palette-btn-bg);
color:var(--global-palette-btn);
}
.primary-button-light a:hover,
.primary-button-light a:active,
.fl-builder-content a.fl-button:hover,
.fl-builder-content a.fl-button:active {
background-color:var(--global-palette2);
color:var(--global-palette-btn-hover);
}
.fl-builder-content .transparent-button-light a.fl-button,
.fl-builder-content .transparent-button-light a.fl-button:visited {
background-color:transparent;
border:2px solid var(--global-palette-btn-bg);
color:var(--global-palette-btn-bg);
}
.transparent-button-light span {
color:var(--global-palette-btn-bg);
}
.fl-builder-content .transparent-button-light a.fl-button:hover {
background-color:var(--global-palette2);
background-color:var(--global-palette-btn-bg-hover);
border-color:var(--global-palette2);
border-color:var(--global-palette-btn-bg-hover);
color:#ffffff;
color:var(--global-palette9);
color:var(--global-palette-btn-hover);
}
.transparent-button-light a:hover span {
color:var(--global-palette-btn-hover);
}
.button-link-light a.fl-button {
background-color:transparent;
border:none;
color:var(--global-palette-btn-bg);
}
.button-link-light a.fl-button:hover {
background-color:transparent;
border:none;
color:var(--global-palette-btn-bg-hover);
}
.button-link-light span,
.button-link-light i.fl-button-icon-after {
color:var(--global-palette1);
}
.button-link-light span:hover,
.button-link-light .fl-button-icon-after i:hover {
color:var(--global-palette2);
}
.button-group-light a,
.button-group-light a:visited {
background:var(--global-palette-btn-bg);
}
.button-group-light a.fl-button:hover {
background:var(--global-palette-btn-bg-hover);
}
.button-group-dark a.fl-button,
.button-group-dark a.fl-button:visited {
background:var(--global-palette-btn-bg);
}
.button-group-dark a.fl-button:hover {
background:var(--global-palette-btn-bg-hover);
}
.fl-builder-content .fl-accordion-button {
background-color:var(--global-palette8);
}
.fl-builder-content .fl-accordion .fl-accordion-content {
background-color:var(--global-palette8);
}
.fl-builder-content .accordion-dark .fl-accordion-button {
background-color:var(--global-palette4);
}
.fl-builder-content .accordion-dark .fl-accordion .fl-accordion-content {
background-color:var(--global-palette4);
}
.brand-page-dotnav .pp-dotnav .pp-dot a:hover .pp-dot-circle {
background-color: var(--global-palette1);
}
a.fl-tab-active {
color:var(--global-palette1);
}
.fl-tabs-panels,
.fl-tabs-label.fl-tab-active {
background-color:var(--global-palette8);
}
.fl-builder-content .tabs-dark .fl-tabs-panels,
.fl-builder-content .tabs-dark .fl-tabs-label.fl-tab-active {
background-color:var(--global-palette4);
}
.light-bg > .fl-row-content-wrap,
.light-bg > .fl-col-content {
background-color:var(--global-palette9);
}
.lighter-bg > .fl-row-content-wrap,
.lighter-bg > .fl-col-content {
background-color:var(--global-palette8);
}
.subtle-bg > .fl-row-content-wrap,
.subtle-bg > .fl-col-content {
background-color:var(--global-palette7);
}
.fl-builder-content .primary-brand-text :not(input):not(textarea):not(select):not(a):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.fl-menu-mobile-toggle) span.fl-heading-text {
color: var(--global-palette1);
}
.fl-builder-content .secondary-brand-text :not(input):not(textarea):not(select):not(a):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.fl-menu-mobile-toggle) span.fl-heading-text {
color: var(--global-palette2);
}
.fl-builder-content .subtle-text :not(input):not(textarea):not(select):not(a):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.fl-menu-mobile-toggle) span.fl-heading-text {
color: var(--global-palette6);
}
.fl-builder-content .dark .subtle-text :not(input):not(textarea):not(select):not(a):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.fl-menu-mobile-toggle) span.fl-heading-text {
color: var(--global-palette7);
}
.fl-builder-content .highlight-text :not(input):not(textarea):not(select):not(a):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.fl-menu-mobile-toggle) span.fl-heading-text {
background: var(--global-palette1);
padding:4px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment