|
|
| (27 intermediate revisions by one other user not shown) |
| Line 1: |
Line 1: |
| /****************************** Tabs Styles ******************************/
| |
| div.tabdiv {
| |
| display: flex;
| |
| background-color: #888;
| |
| }
| |
|
| |
| div.tabdiv > div {
| |
| flex: 1;
| |
| }
| |
|
| |
| div.tabdiv div.tabdiv {
| |
| display: block;
| |
| }
| |
|
| |
| div.tabdiv div.tabdiv > ul > li {
| |
| display: inline-block;
| |
| }
| |
|
| |
| div.tabdiv * {
| |
| color: #fff;
| |
| border-color: #fff;
| |
| }
| |
|
| |
| div.tabdiv > div {
| |
| background-color: #2a2a2a;
| |
| padding: 10px;
| |
| -webkit-clip-path: polygon(0% 13px, 13px 0%, 100% 0%, 100% 100%, 0% 100%);
| |
| clip-path: polygon(0% 13px, 13px 0%, 100% 0%, 100% 100%, 0% 100%);
| |
| }
| |
|
| |
| div.tabdiv > ul {
| |
| margin: 0;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| div.tabdiv > ul > li {
| |
| display: block;
| |
| margin: 5px 32px 5px 0;
| |
| padding: 0 20px;
| |
| background-clip: border-box;
| |
| }
| |
|
| |
| div.tabdiv > ul > li a {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| div.tabdiv > ul > li,
| |
| div.tabdiv > ul > li:after {
| |
| height: 32px;
| |
| line-height: 32px;
| |
| }
| |
|
| |
| div.tabdiv > ul > li:before,
| |
| div.tabdiv > ul > li:after {
| |
| content: '';
| |
| display: inline-block;
| |
| position: absolute;
| |
| -webkit-clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
| |
| clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
| |
| }
| |
|
| |
| div.tabdiv > ul > li:before {
| |
| width: 13px;
| |
| height: 13px;
| |
| top: 0;
| |
| left: 0;
| |
| }
| |
|
| |
| div.tabdiv > ul > li:after {
| |
| width: 32px;
| |
| right: -32px;
| |
| }
| |
|
| |
| div.tabdiv > ul > li:hover:before,
| |
| div.tabdiv > ul > li.active:before {
| |
| background-color: #d38f00;
| |
| }
| |
|
| |
| div.tabdiv > ul > li:hover,
| |
| div.tabdiv > ul > li:hover:after,
| |
| div.tabdiv > ul > li.active,
| |
| div.tabdiv > ul > li.active:after {
| |
| background-color: #f8d800;
| |
| }
| |
|
| |
| div.tabdiv > ul > li.active a {
| |
| color: #300000;
| |
| }
| |
|
| |
| /****************************** Checkbox / Radio Styles ******************************/
| |
| input[type='radio'],
| |
| input[type='checkbox'] {
| |
| width: 17px;
| |
| height: 17px;
| |
| }
| |
|
| |
| input[type='radio']:before,
| |
| input[type='radio']:after,
| |
| input[type='checkbox']:before,
| |
| input[type='checkbox']:after {
| |
| content: '';
| |
| position: absolute;
| |
| border: 2px #777 solid;
| |
| }
| |
|
| |
| input[type='radio']:before,
| |
| input[type='checkbox']:before {
| |
| width: 13px;
| |
| height: 13px;
| |
| top: 0;
| |
| left: 0;
| |
| z-index: 1;
| |
| background-color: #888;
| |
| -webkit-clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 100% 50%, 100% 0%);
| |
| clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 100% 50%, 100% 0%);
| |
| }
| |
|
| |
| input[type='radio']:after,
| |
| input[type='checkbox']:after {
| |
| width: 7px;
| |
| height: 7px;
| |
| top: 10px;
| |
| left: 10px;
| |
| z-index: 2;
| |
| background-color: transparent;
| |
| -webkit-transform: rotate(45deg);
| |
| -moz-transform: rotate(45deg);
| |
| -o-transform: rotate(45deg);
| |
| -ms-transform: rotate(45deg);
| |
| transform: rotate(45deg);
| |
| -webkit-clip-path: polygon(0% 0%, 50% 50%, 0% 100%);
| |
| -clip-path: polygon(0% 0%, 50% 50%, 0% 100%);
| |
| }
| |
|
| |
| input[type='radio'] + label,
| |
| input[type='radio'] + label a,
| |
| input[type='checkbox'] + label,
| |
| input[type='checkbox'] + label a {
| |
| background-color: #2a2a2a;
| |
| color: #888;
| |
| }
| |
|
| |
| input[type='radio']:checked:before,
| |
| input[type='checkbox']:checked:before {
| |
| background-color: #f8a500;
| |
| border-color: #f8a500;
| |
| }
| |
|
| |
| input[type='radio']:checked:after,
| |
| input[type='checkbox']:checked:after {
| |
| border-color: #f8a500;
| |
| }
| |
|
| |
| input[type='radio']:checked + label,
| |
| input[type='radio']:checked + label a,
| |
| input[type='checkbox']:checked + label,
| |
| input[type='checkbox']:checked + label a {
| |
| color: #fff;
| |
| }
| |
|
| |
| /****************************** Extension MenuSidebar Styles ******************************/ | | /****************************** Extension MenuSidebar Styles ******************************/ |
| /* Allow popup submenus to overflow the sidebar area for the Vector skin */ | | /* Allow popup submenus to overflow the sidebar area for the Vector skin */ |
| Line 338: |
Line 178: |
| html * { | | html * { |
| font-family: "Microsoft YaHei"; | | font-family: "Microsoft YaHei"; |
| | } |
| | |
| | .vgrid-table > div:not(.vgrid-cat) ul li { |
| | list-style: none; |
| | } |
| | |
| | #p-logo { |
| | background: transparent |
| } | | } |