Custom CSS Snippets

Heroic has a feature to use custom CSS themes. This feature is good to style Heroic but users may want to edit the current theme without having to create a custom one, or they want to apply customizations to Heroic that will persist between changing themes without having to apply the same CSS to each theme.

For that, Heroic supports a Custom CSS advanced feature in Settings (in the sidebar) > Advanced.

This page collects a few frequently asked customizations.

Hide store icons in library

.store-icon {
  display: none;
}

Hide Documentation sidebar item

[data-tour="sidebar-docs"] {
 display: none !important;
}

Hide donation sidebar item (:()

[data-tour="sidebar-community"] {
 display: none;
}

Hide Stores sidebar item

.SidebarItemWithSubmenu:has([data-tour="sidebar-stores"]) {
 display: none;
}