Shopify themes, liquid, logos, and UX
Hi - I'd like to change the content colour of the footer content that is currently black to white.
Store Link - https://c92cd8-82.myshopify.com/
Shrine PRO Theme
Thanks so much!
Solved! Go to the solution
This is an accepted solution.
Hello @AAABARTON1
Welcome to Shopify Community.
Add below CSS in 'Assets > base.css' file
.footer *, .footer a, .footer .footer-block__details-content .list-menu__item--link, .footer .copyright__content a {
color: #fff;
}
.footer input, .footer button {
border-color: #fff !important;
background-color: transparent !important;
color: #f9447b !important;
}
.footer button:after {
background-color: #fff !important;
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
color: #fff !important;
}
.footer button:before {
background-color: #f9447b !important;
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
color: #fff !important;
}
.footer button:hover, .footer button:focus,
.footer button:hover:before, .footer button:focus:before {
background-color: #fff !important;
color: #f9447b !important;
}
.footer .field:after {
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
}
OUTPUT:
Thanks
This is an accepted solution.
Hello @AAABARTON1
Welcome to Shopify Community.
Add below CSS in 'Assets > base.css' file
.footer *, .footer a, .footer .footer-block__details-content .list-menu__item--link, .footer .copyright__content a {
color: #fff;
}
.footer input, .footer button {
border-color: #fff !important;
background-color: transparent !important;
color: #f9447b !important;
}
.footer button:after {
background-color: #fff !important;
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
color: #fff !important;
}
.footer button:before {
background-color: #f9447b !important;
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
color: #fff !important;
}
.footer button:hover, .footer button:focus,
.footer button:hover:before, .footer button:focus:before {
background-color: #fff !important;
color: #f9447b !important;
}
.footer .field:after {
box-shadow: 0 0 0 var(--inputs-border-width) rgba(255, 255, 255, var(--inputs-border-opacity))
}
OUTPUT:
Thanks
Worked, thanks so much!!
Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024The Hydrogen Visual Editor is now available to merchants in Shopify Editions | Summer '...
By JasonH Sep 2, 2024Note: Customizing your CSS requires some familiarity with CSS and HTML. Before you cust...
By JasonH Aug 12, 2024