diff --git a/src/components/Game.vue b/src/components/Game.vue index ca992ad..570706f 100644 --- a/src/components/Game.vue +++ b/src/components/Game.vue @@ -11,7 +11,6 @@ /> -
@@ -66,14 +65,8 @@ function gatherLayerProps(layer: GenericLayer) { flex-grow: 1; } -.separator { - position: absolute; - right: -4px; - top: 0; - bottom: 0; - width: 8px; - background: var(--outline); - z-index: 1; +.tab + .tab > .inner-tab { + border-left: solid 4px var(--outline); } @@ -82,7 +75,7 @@ function gatherLayerProps(layer: GenericLayer) { height: 4px; border: none; background: var(--outline); - margin: var(--feature-margin) -10px; + margin: var(--feature-margin) 0; } .tab .modal-body hr { diff --git a/src/components/layout/Sticky.vue b/src/components/layout/Sticky.vue index 5413d36..4a598d4 100644 --- a/src/components/layout/Sticky.vue +++ b/src/components/layout/Sticky.vue @@ -43,18 +43,7 @@ onMounted(() => { .sticky { position: sticky; background: var(--background); - margin-left: -10px; - margin-right: -10px; - padding-left: 10px; - padding-right: 10px; - width: 100%; + width: calc(100% - 2px); z-index: 3; } - -.modal-body .sticky { - margin-left: 0; - margin-right: 0; - padding-left: 0; - padding-right: 0; -} diff --git a/src/features/tabs/TabFamily.vue b/src/features/tabs/TabFamily.vue index 72ccd8b..4d52ab8 100644 --- a/src/features/tabs/TabFamily.vue +++ b/src/features/tabs/TabFamily.vue @@ -168,29 +168,22 @@ export default defineComponent({ margin-bottom: 20px; } -.tab-family-container .sticky { - margin-left: -3px !important; - margin-right: -3px !important; -} - .tab-buttons-container { - width: calc(100% - 14px); z-index: 4; } .tab-buttons-container:not(.floating) { - border-top: solid 4px; border-bottom: solid 4px; border-color: inherit; } +:not(.layer-tab):not(.modal-body) > .tab-family-container > .tab-buttons-container:not(.floating) { + width: calc(100% + 6px); + margin-left: -3px; +} + .tab-buttons-container:not(.floating) .tab-buttons { - width: calc(100% + 14px); - margin-left: -7px; - margin-right: -7px; - box-sizing: border-box; text-align: left; - padding-left: 14px; margin-bottom: -4px; } @@ -239,11 +232,7 @@ export default defineComponent({ > .tab-family-container > .tab-buttons-container:not(.floating):first-child .tab-buttons { - padding-left: 2px; -} - -.tab-buttons-container:not(.floating):first-child { - border-top: 0; + padding-left: 0; } .minimizable > .tab-buttons-container:not(.floating):first-child {