How to show Tabs in Database views
Copy and paste the below snippet in your custom CSS to make your database views appear in different tabs.
/* render database views as tabs */ .notion-collection-view-dropdown-content { display: flex; box-shadow: none; align-items: center; justify-content: start; gap: 30px; flex-wrap: wrap; margin: 0 auto !important; } .notion-collection-view-dropdown-content-item-active-icon>svg { display: none !important; } .notion-view-type>svg{ display: none !important; } .notion-collection-view-type-title{ overflow: unset; } .notion-collection-view-dropdown-content-item { padding: 10px 20px 10px 20px; border-radius:5px; box-shadow:0px 0px 0px 2px black; color: white !important; } .notion-collection-view-dropdown-content-item:focus, .notion-collection-view-dropdown-content-item-active { background-color:black; color: white !important; } .notion-collection-view-dropdown-content-item-active>.notion-collection-view-type>.notion-view-type>.notion-collection-view-type-title{ color: white !important; } .dropdown { display: block; } .dropdown-trigger { display: none; } .dropdown-menu { display: block; position: unset; z-index: 99; } .dropdown-content{ background: unset; } .notion-collection-view-dropdown-content{ padding: 25px 0px 25px 0px; } .notion-collection-header{ display: flex; justify-content: start; padding-left: 90px; align-items: center; margin: 10px 0px 60px 0px; } .notion-collection-view-dropdown-content { display: flex; box-shadow: none; align-items: center; justify-content: center; gap: 15px; flex-wrap: wrap; }