|
|
| 第1行： |
第1行： |
| .tab .TabLabelText{ | | .inline-text-blocked:hover, .inline-text-blocked:active { |
| padding:1px;
| | color: white |
| background:#FFF;
| |
| cursor:pointer;
| |
| flex:none;
| |
| } | | } |
|
| | |
| .tab .TabLabel{ | | .inline-text-blocked a { |
| z-index:2;
| | color: inherit; |
| position:relative;
| |
| -webkit-user-select:none;
| |
| -moz-user-select:none;
| |
| -o-user-select:none;
| |
| user-select:none;
| |
| display:flex;
| |
| flex-wrap:wrap;
| |
| } | | } |
|
| | |
| .tab .TabLabelText.selected{ | | .inline-text-blocked:hover a, .inline-text-blocked:active a { |
| padding:1px;
| | color: white |
| background:white;
| |
| }
| |
|
| |
| .tab .TabContent{
| |
| background:white;
| |
| padding:20px 30px;
| |
| position:relative;
| |
| z-index:1;
| |
| border:1px solid #AAA;
| |
| }
| |
|
| |
| .tab .TabContentText{
| |
| display:none;
| |
| }
| |
|
| |
| .tab .TabContentText.selected{
| |
| display:block;
| |
| }
| |
|
| |
| .tab .tabLabelTop .TabLabelText{
| |
| border-top:3px solid transparent;
| |
| border-left:1px solid transparent;
| |
| border-right:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelTop .TabLabelText.selected{
| |
| border-top:3px solid green;
| |
| border-left:1px solid #AAA;
| |
| border-right:1px solid #AAA;
| |
| }
| |
|
| |
| .tab .tabLabelTop.reverse .TabLabelText{
| |
| border-bottom:3px solid transparent;
| |
| border-left:1px solid transparent;
| |
| border-right:1px solid transparent;
| |
| border-top:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelTop.reverse .TabLabelText.selected{
| |
| border-bottom:3px solid green;
| |
| border-left:1px solid #AAA;
| |
| border-right:1px solid #AAA;
| |
| border-top:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelBottom .TabLabelText{
| |
| border-bottom:3px solid transparent;
| |
| border-left:1px solid transparent;
| |
| border-right:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelBottom .TabLabelText.selected{
| |
| border-bottom:3px solid green;
| |
| border-left:1px solid #AAA;
| |
| border-right:1px solid #AAA;
| |
| }
| |
|
| |
| .tab .tabLabelBottom.reverse .TabLabelText{
| |
| border-top:3px solid transparent;
| |
| border-left:1px solid transparent;
| |
| border-right:1px solid transparent;
| |
| border-bottom:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelBottom.reverse .TabLabelText.selected{
| |
| border-top:3px solid green;
| |
| border-left:1px solid #AAA;
| |
| border-right:1px solid #AAA;
| |
| border-bottom:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelLeft .TabLabelText{
| |
| border-left:3px solid transparent;
| |
| border-top:1px solid transparent;
| |
| border-bottom:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelLeft .TabLabelText.selected{
| |
| border-left:3px solid green;
| |
| border-top:1px solid #AAA;
| |
| border-bottom:1px solid #AAA;
| |
| }
| |
|
| |
| .tab .tabLabelLeft.reverse .TabLabelText{
| |
| border-right:3px solid transparent;
| |
| border-top:1px solid transparent;
| |
| border-bottom:1px solid transparent;
| |
| border-left:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelLeft.reverse .TabLabelText.selected{
| |
| border-right:3px solid green;
| |
| border-top:1px solid #AAA;
| |
| border-bottom:1px solid #AAA;
| |
| border-left:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelRight .TabLabelText{
| |
| border-right:3px solid transparent;
| |
| border-top:1px solid transparent;
| |
| border-bottom:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelRight .TabLabelText.selected{
| |
| border-right:3px solid green;
| |
| border-top:1px solid #AAA;
| |
| border-bottom:1px solid #AAA;
| |
| }
| |
|
| |
| .tab .tabLabelRight.reverse .TabLabelText{
| |
| border-left:3px solid transparent;
| |
| border-top:1px solid transparent;
| |
| border-bottom:1px solid transparent;
| |
| border-right:1px solid transparent;
| |
| }
| |
|
| |
| .tab .tabLabelRight.reverse .TabLabelText.selected{
| |
| border-left:3px solid green;
| |
| border-top:1px solid #AAA;
| |
| border-bottom:1px solid #AAA;
| |
| border-right:1px solid transparent;
| |
| }
| |
|
| |
| .tab .Tabs .TabDivider{
| |
| width:100%;
| |
| order:2;
| |
| }
| |
|
| |
| .tab .Tabs.reverse .TabDivider{
| |
| height:2px;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft .TabLabel,
| |
| .tab .Tabs.tabLabelRight .TabContent{
| |
| order:1;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft .TabContent,
| |
| .tab .Tabs.tabLabelRight .TabLabel{
| |
| order:3;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft,
| |
| .tab .Tabs.tabLabelRight{
| |
| display:flex;
| |
| flex-wrap:nowrap;
| |
| width:auto;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft .TabDivider,
| |
| .tab .Tabs.tabLabelRight .TabDivider{
| |
| height:100%;
| |
| width:0;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft.reverse .TabDivider,
| |
| .tab .Tabs.tabLabelRight.reverse .TabDivider{
| |
| width:1px;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft .TabLabel,
| |
| .tab .Tabs.tabLabelRight .TabLabel{
| |
| flex-direction:column;
| |
| }
| |
|
| |
| .tab .Tabs.tabLabelLeft:not(.AutoWidth) .TabContent,
| |
| .tab .Tabs.tabLabelRight:not(.AutoWidth) .TabContent{
| |
| flex:1;
| |
| }
| |
|
| |
| .Tabs{
| |
| max-width:100%;
| |
| }
| |
|
| |
| .Tabs.AutoWidth{
| |
| width:-webkit-max-content;
| |
| width:-moz-max-content;
| |
| width:max-content;
| |
| display:flow-root;
| |
| }
| |
|
| |
| .Tabs.FloatLeft{
| |
| float:left;
| |
| margin-right:1em;
| |
| }
| |
|
| |
| .Tabs.FloatRight{
| |
| float:right;
| |
| margin-left:1em;
| |
| }
| |
|
| |
| .Tabs .Tab{
| |
| border-bottom:1px solid #AAA;
| |
| }
| |
|
| |
| .Tabs .Tab:first-child{
| |
| border-top:1px solid #AAA;
| |
| }
| |
|
| |
| .Tabs .Tab .TabLabelText{
| |
| padding:7px;
| |
| }
| |
|
| |
| .Tabs .Tab .TabContentText{
| |
| padding:3px;
| |
| }
| |
|
| |
| .infotemplatebox>table td>.Tabs .TabLabel,
| |
| .infotemplatebox>table td>.Tabs .TabContent{
| |
| margin:0 -1px;
| |
| } | | } |