diff --git a/css/bladeburner.scss b/css/bladeburner.scss index 0f25aa194..398b254a4 100644 --- a/css/bladeburner.scss +++ b/css/bladeburner.scss @@ -1,11 +1,13 @@ @import "theme"; -#bladeburner-container p, -#bladeburner-container pre, -#bladeburner-container a, -#bladeburner-container div, -#bladeburner-container td { - font-size: $defaultFontSize * 0.8125; +#bladeburner-container { + a, + div, + p, + pre, + td { + font-size: $defaultFontSize * 0.8125; + } } .bladeburner-action { @@ -13,10 +15,10 @@ margin: 7px; padding: 7px; white-space: pre-wrap; -} -.bladeburner-action pre { - white-space: pre-wrap; + pre { + white-space: pre-wrap; + } } /* Whatever action is currently active */ @@ -25,25 +27,29 @@ } /* Action & Skills panel navigation button */ -.bladeburner-nav-button { +%bladburner-nav-button { border: 1px solid #fff; - color: #fff; - padding: 2px; margin: 2px; + padding: 2px; } -.bladeburner-nav-button:hover { - background-color: #3d4044; +.bladeburner-nav-button { + color: #fff; + + @extend %bladburner-nav-button; + + &:hover { + background-color: #3d4044; + } } .bladeburner-nav-button-inactive { - border: 1px solid #fff; - padding: 2px; - margin: 2px; text-decoration: none; background-color: #555; cursor: default; pointer-events: none; + + @extend %bladburner-nav-button; } /* Bladeburner Console */ diff --git a/css/interactivetutorial.scss b/css/interactivetutorial.scss index 698d5e7c8..15b8f3cc9 100644 --- a/css/interactivetutorial.scss +++ b/css/interactivetutorial.scss @@ -18,10 +18,10 @@ overflow: auto; /* Enable scroll if needed */ background-color: #444; /* Fallback color */ color: #fff; -} -#interactive-tutorial-container > strong { - background-color: #444; + > strong { + background-color: #444; + } } #interactive-tutorial-text { @@ -41,6 +41,13 @@ font-size: $defaultFontSize * 1.25; font-weight: bold; background-color: #000; + + &:hover, + &:focus { + color: #fff; + text-decoration: none; + cursor: pointer; + } } #interactive-tutorial-exit { @@ -55,14 +62,3 @@ #interactive-tutorial-next { float: right; } - -#interactive-tutorial-exit:hover, -#interactive-tutorial-exit:focus, -#interactive-tutorial-next:hover, -#interactive-tutorial-next:focus, -#interactive-tutorial-back:hover, -#interactive-tutorial-back:focus { - color: #fff; - text-decoration: none; - cursor: pointer; -}