diff options
author | Devaev Maxim <[email protected]> | 2020-07-18 10:51:20 +0300 |
---|---|---|
committer | Devaev Maxim <[email protected]> | 2020-07-18 10:51:20 +0300 |
commit | 6bd4fc769fb72a19ef7b7b035ffcbd3b97959ccc (patch) | |
tree | 48f8275cab2a755544b6fdca836788bfd675c909 /web/share/css | |
parent | 325bf6b5870f6e7c00c2132d109f121ead66a0e4 (diff) |
refactoring
Diffstat (limited to 'web/share/css')
-rw-r--r-- | web/share/css/kvm/about.css | 9 | ||||
-rw-r--r-- | web/share/css/tabs.css | 29 |
2 files changed, 24 insertions, 14 deletions
diff --git a/web/share/css/kvm/about.css b/web/share/css/kvm/about.css index 1b586bb6..22fb6abc 100644 --- a/web/share/css/kvm/about.css +++ b/web/share/css/kvm/about.css @@ -41,13 +41,6 @@ div#about td.copyright { font-size: 0.8em; } -div#about div#about-meta, div#about-hw, div#about-version, div#about-thanks { +div#about div.tabs div.tab div.code { height: 250px; } - -#about-tab-meta-button:checked~#about-tab-meta-content, -#about-tab-hw-button:checked~#about-tab-hw-content, -#about-tab-version-button:checked~#about-tab-version-content, -#about-tab-thanks-button:checked~#about-tab-thanks-content { - display: block; -} diff --git a/web/share/css/tabs.css b/web/share/css/tabs.css index 46c46b4b..fcd6f9b8 100644 --- a/web/share/css/tabs.css +++ b/web/share/css/tabs.css @@ -20,28 +20,45 @@ *****************************************************************************/ -div.tabs>input[type="radio"] { +div.tabs { + display: flex; + flex-wrap: wrap; +} + +div.tabs input[type="radio"] { display: none; } -div.tabs>div { +div.tabs div.tab { + order: 99; display: none; border: var(--border-default-thin); padding: 10px 10px; + width: 100%; } -div.tabs>label { - display: inline-block; +div.tabs label { + order: 1; + display: block; text-align: center; vertical-align: middle; user-select: none; - border: var(--border-default-thin); + border-top: var(--border-default-thin); + border-left: var(--border-default-thin); padding: 4px 8px; cursor: pointer; position: relative; top: 1px; } -div.tabs>input[type="radio"]:checked+label { +div.tabs label:last-of-type { + border-right: var(--border-default-thin); +} + +div.tabs input[type="radio"]:checked+label { background-color: var(--cs-control-default-bg); } + +div.tabs input[type="radio"]:checked+label+.tab { + display: block; +} |