用户:某不知名鸽子/common.css:修订间差异
来自Limbo Wiki
小无编辑摘要 |
小无编辑摘要 |
||
第1行: | 第1行: | ||
.tab .TabLabelText { | |||
padding: 1px; | |||
background: #fff; | |||
cursor: pointer; | |||
flex: none; | |||
background- | } | ||
} | .tab .TabLabel { | ||
z-index: 2; | |||
position: relative; | |||
-webkit-user-select: none; | |||
-moz-user-select: none; | |||
-ms-user-select: none; | |||
user-select: none; | |||
display: flex; | |||
flex-wrap: wrap; | |||
} | |||
.tab .TabLabelText.selected { | |||
padding: 1px; | |||
. | background: white; | ||
} | |||
border: 1px solid; | |||
border- | .tab .TabContent { | ||
border- | background: white; | ||
padding: 20px 30px; | |||
position: relative; | |||
z-index: 1; | |||
border: 1px solid #aaa; | |||
} | |||
} | .tab .TabContentText { | ||
. | display: none; | ||
} | |||
border:1px solid; | |||
border- | .tab .TabContentText.selected { | ||
display: block; | |||
border- | } | ||
display: | .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: 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; | |||
} | } |
2022年8月19日 (五) 05:25的版本
.tab .TabLabelText { padding: 1px; background: #fff; cursor: pointer; flex: none; } .tab .TabLabel { z-index: 2; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; display: flex; flex-wrap: wrap; } .tab .TabLabelText.selected { padding: 1px; 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: 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; }