From a1f69d978426c6a4cb7e8f3116e087553dbbffd5 Mon Sep 17 00:00:00 2001 From: crupest Date: Thu, 31 Aug 2023 19:18:48 +0800 Subject: ... --- FrontEnd/src/components/tab/TabBar.css | 38 ++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 FrontEnd/src/components/tab/TabBar.css (limited to 'FrontEnd/src/components/tab/TabBar.css') diff --git a/FrontEnd/src/components/tab/TabBar.css b/FrontEnd/src/components/tab/TabBar.css new file mode 100644 index 00000000..09d48c59 --- /dev/null +++ b/FrontEnd/src/components/tab/TabBar.css @@ -0,0 +1,38 @@ +.cru-tab-bar { + border-bottom: var(--cru-clickable-normal-color) 1px solid; + display: flex; +} + +.cru-tab-bar-tab-area { + display: flex; + align-items: center; + gap: 0.5em; + border: var(--cru-clickable-normal-color) 1px solid; + border-bottom: none; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + padding: 0.2em 0.5em; +} + +.cru-tab-bar-item { + color: var(--cru-clickable-normal-color); + transition: all 0.5s; + border-radius: 5px; + cursor: pointer; + padding: 0.3em 1em; +} + +.cru-tab-bar-item:hover { + color: var(--cru-push-button-text-color); + background-color: var(--cru-clickable-normal-color); +} + +.cru-tab-bar-item.active { + color: var(--cru-push-button-text-color); + background-color: var(--cru-clickable-normal-color); + border-color: var(--cru-primary-color); +} + +.cru-tab-bar-action-area { + margin-left: auto; +} -- cgit v1.2.3