-
Notifications
You must be signed in to change notification settings - Fork 127
Styling Guide
Murhaf Sousli edited this page Jun 16, 2018
·
6 revisions
There are several classes that help you to create your custom styles
.sb-moon-theme {
&.sb-group {
/** ... share buttons container */
}
.sb-wrapper { /** ... share button wrapper */
background-color: var(--button-color);
.sb-inner { /** ... inner wrapper */
.sb-content { /** ... content wrapper */
.sb-icon { /** ... icon wrapper */ }
.sb-text { /** ... text wrapper */ }
}
.sb-count { /** ... count wrapper */ }
}
// For conditional styles
&.sb-show-icon.sb-show-text.sb-show-count {
/** ... Apply when icon, text and count are shown */
.sb-icon { /** ... icon wrapper */ }
.sb-text { /** ... text wrapper */ }
}
}
}
If you use .sb-moon-theme
then the theme name will become moon
:
<share-buttons theme="moon"></share-buttons>