Skip to content

Instantly share code, notes, and snippets.

@nocd5
Last active December 6, 2018 04:15
Show Gist options
  • Save nocd5/db98dcd75a045462b66099dce647515c to your computer and use it in GitHub Desktop.
Save nocd5/db98dcd75a045462b66099dce647515c to your computer and use it in GitHub Desktop.
CSS for Tab Plus Plugin of Tablacus Explorer
* {
font-family: "monaco", "UD Digi Kyokasho N-R", "02UtsukushiMincho" !important;
}
.tab0 {
padding: 3px 0 0 12px;
background: #F0F0F0;
}
.tab,
.tab2,
.tab3,
.activetab,
.tab:hover,
.tab2:hover,
.tab3:hover {
border: 0;
box-shadow: none;
}
.tab,
.tab2,
.tab3,
.activetab {
position: relative;
padding: 0 2px;
margin: 0 10px;
height: 2em;
}
.tab,
.tab2,
.tab3 {
background: transparent;
}
.activetab {
background: #fff;
border-top: solid 1px #828790;
}
.activetab>* {
margin-top: -1px;
}
.tab:hover,
.tab2:hover,
.tab3:hover {
background: #d9ebf9;
}
.tab:before,
.tab:after,
.tab2:before,
.tab2:after,
.tab3:before,
.tab3:after,
.activetab:before,
.activetab:after {
position: absolute;
width: 26px;
}
.tab:before,
.tab:after,
.tab2:before,
.tab2:after,
.tab3:before,
.tab3:after {
content: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M24.5.5c-14.5%200-9.5%2024-24%2024h25V.5z%22%20fill%3D%22%23d9ebf9%22%2F%3E%3Cpath%20d%3D%22M25.5.5h-1c-14.5%200-9.5%2024-24%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22square%22%20stroke-opacity%3D%220%22%2F%3E%3C%2Fsvg%3E");
top: 0;
opacity: 0;
}
.tab:hover:before,
.tab:hover:after,
.tab2:hover:before,
.tab2:hover:after,
.tab3:hover:before,
.tab3:hover:after {
opacity: 1;
}
.activetab:before,
.activetab:after {
content: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M24.5.5c-14.5%200-9.5%2024-24%2024h25V.5z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M25.5.5h-1c-14.5%200-9.5%2024-24%2024%22%20fill%3D%22none%22%20stroke%3D%22%23828790%22%20stroke-linecap%3D%22square%22%2F%3E%3C%2Fsvg%3E");
top: -1px;
}
.tab:before,
.tab2:before,
.tab3:before,
.activetab:before {
left: -25px;
height: 2em;
}
.tab:after,
.tab2:after,
.tab3:after,
.activetab:after {
right: 1px;
transform: scaleX(-1);
transform-origin: right;
height: 2em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment