MediaWiki:Tabber.css

/* -- Tabbers -- */

/*general tabber styles*/ .tabber__tabs, .tabber__tab:hover, .tabber__tab--active, .tabber__tabs { box-shadow:none; }

.tabber__header { display: flex; flex-wrap: wrap; justify-content:center; margin: 0; padding: 3px 0; }

.tabber__tab { padding: 3px 0.5em; margin-left: 3px; border: 1px solid #ccc; border-bottom: none; background: #f2f7ff; text-decoration: none; }

/*specific tabber styles*/ /*themed tabber*/ .themedtabber .tabber__panel { padding: 0!important; border:none!important; }

.themedtabber .tabber__header { border-bottom: 2px solid #b39f73!important; padding: 1.0em!important; }

.themedtabber .tabber__tab { background-color: black!important; transition: background-color 0.2s!important; border: 1px solid #b39f73!important; line-height:2em!important; margin: 0 0.2em 0!important; padding: 3px 0.5em!important; border-radius: 0!important; color:white!important; }

.themedtabber .tabber__tab:hover, .themedtabber .tabber__tab--active { background-color: #C29C48!important; border: 1px solid #b39f73!important; }

/*dorm tabbers*/ .Heartslabyul .tabber__panel, .Savanaclaw .tabber__panel, .Octavinelle .tabber__panel, .Scarabia .tabber__panel, .Pomefiore .tabber__panel, .Ignihyde .tabber__panel, .Diasomnia .tabber__panel { padding: 5px; width: 100%; box-sizing: border-box; border: 1px solid var(--active-color, initial); }

.Heartslabyul .tabber__header, .Savanaclaw .tabber__header, .Octavinelle .tabber__header, .Scarabia .tabber__header, .Pomefiore .tabber__header, .Ignihyde .tabber__header, .Diasomnia .tabber__header { padding: 1.0em; border-bottom: 2px solid var(--active-color, initial); }

.Heartslabyul .tabber__tab, .Savanaclaw .tabber__tab, .Octavinelle .tabber__tab, .Scarabia .tabber__tab, .Pomefiore .tabber__tab, .Ignihyde .tabber__tab, .Diasomnia .tabber__tab { transition: background-color 0.2s; color: white; background-color: var(--tab-color, initial); border: none; }

.Heartslabyul .tabber__tab:hover, .Savanaclaw .tabber__tab:hover, .Octavinelle .tabber__tab:hover, .Scarabia .tabber__tab:hover, .Pomefiore .tabber__tab:hover, .Ignihyde .tabber__tab:hover, .Diasomnia .tabber__tab:hover { background-color: var(--hover-color, initial); }

.Heartslabyul .tabber__tab--active, .Savanaclaw .tabber__tab--active, .Octavinelle .tabber__tab--active, .Scarabia .tabber__tab--active, .Pomefiore .tabber__tab--active, .Ignihyde .tabber__tab--active, .Diasomnia .tabber__tab--active { background-color: var(--active-color, initial); }

.Heartslabyul .tabber { --tab-color: #d50000; --hover-color: #A51002; --active-color: #8A1305; }

.Savanaclaw .tabber { --tab-color: #F5C663; --hover-color: #ebab1c; --active-color: #EFA406; }

.Octavinelle .tabber { --tab-color: #8A80BB; --hover-color: #A7A0CC; --active-color: #493470; }

.Scarabia .tabber { --tab-color: #9a1719; --hover-color: #7E1402; --active-color: #611710; }

.Pomefiore .tabber { --tab-color: #352687; --hover-color: #7C6E66; --active-color: #241d48; }

.Ignihyde .tabber { --tab-color: #147AEE; --hover-color: #403e43; --active-color: #516EDD; }

.Diasomnia .tabber { --tab-color: #85c02e; --hover-color: #698740; --active-color: #375F00; }

/*misc tabber*/ .imgtabber .tabber__panel { padding: 5px 0; border:none; }

.servertab .tabbertab, .servertab .tabber__panel { padding: 20px ; border: none ; }

.servertab .tabber__header { position:sticky; top: 15px; border-bottom: none; }

.servertab .tabber__tab { height:20px; }

.servertab .tabber__tab { padding: 10px 10px; background-color: #1C3323; border-radius: 7px; border: none; color: white; }

.servertab .tabber__tab:hover, .servertab .tabber__tab--active { background-color: #2E533A; }