From ae155b2d7e6f402b56e38477f0076a2bd5c2ae5b Mon Sep 17 00:00:00 2001 From: Gregory Ballantine Date: Sat, 29 Oct 2022 01:14:08 -0400 Subject: [PATCH] Made the tabs look better --- assets/coffee/cpu.coffee | 1 - assets/coffee/gpu.coffee | 1 - assets/coffee/sentry.coffee | 4 ++++ assets/sass/sentry.sass | 40 +++++++++++++++++++++++++++++++++++++ assets/twig/layout.twig | 20 +++++++++++-------- 5 files changed, 56 insertions(+), 10 deletions(-) diff --git a/assets/coffee/cpu.coffee b/assets/coffee/cpu.coffee index 3ddd7d0..587da67 100644 --- a/assets/coffee/cpu.coffee +++ b/assets/coffee/cpu.coffee @@ -9,7 +9,6 @@ window.addEventListener('load', () -> document.getElementById('cpuThreads').innerText = data.cores document.getElementById('cpuClockBase').innerText = data.speed document.getElementById('cpuClockBoost').innerText = data.speedMax - console.log(data) ).catch((error) -> console.error(error) ) diff --git a/assets/coffee/gpu.coffee b/assets/coffee/gpu.coffee index 51e483f..727c6b1 100644 --- a/assets/coffee/gpu.coffee +++ b/assets/coffee/gpu.coffee @@ -23,7 +23,6 @@ loadGpus = () -> optionElem.setAttribute('value', i) document.getElementById('gpuSelector').appendChild(optionElem) i++ - console.log(data) ).catch((error) -> console.error(error) ) diff --git a/assets/coffee/sentry.coffee b/assets/coffee/sentry.coffee index 0c34a3d..19a5335 100644 --- a/assets/coffee/sentry.coffee +++ b/assets/coffee/sentry.coffee @@ -1,11 +1,15 @@ @openTab = (tab) -> + # show the component info that's selected + tabs = document.querySelectorAll('.tab-button') displays = document.querySelectorAll('.component-display') i = 0 while i < displays.length if displays[i].getAttribute('data-component') == tab displays[i].classList.add('active') + tabs[i].classList.add('active') else displays[i].classList.remove('active') + tabs[i].classList.remove('active') i++ @formatBytes = (bytes, decimals = 2) -> diff --git a/assets/sass/sentry.sass b/assets/sass/sentry.sass index f9f0ed8..6f41d15 100644 --- a/assets/sass/sentry.sass +++ b/assets/sass/sentry.sass @@ -1,4 +1,8 @@ +$tab-bar-height: 50px + body + margin: 0 + padding: $tab-bar-height 0 0 background: white font-size: 18px @@ -33,6 +37,42 @@ button .container.fluid max-width: 100% + margin: 0 + +#wrapper + margin-top: 25px + +#tab-bar + position: fixed + top: 0 + left: 0 + z-index: 10 + width: 100% + height: $tab-bar-height + margin: 0 + padding: 0 + background: #eee + border-bottom: 1px solid #bbb + box-shadow: 0 1px 2px rgba(0, 0, 0, .25) + + .row + display: relative + + .tab-button + float: left + height: 50px + margin: 0 + background-color: #eee + border: none + border-right: 1px solid #999 + border-radius: 0 + color: #212121 + font-size: 2rem + font-weight: bold + transition: all 230ms ease-in-out + + &.active + background-color: white .component-display display: none diff --git a/assets/twig/layout.twig b/assets/twig/layout.twig index 8f1e8c3..cbe8eeb 100644 --- a/assets/twig/layout.twig +++ b/assets/twig/layout.twig @@ -14,17 +14,21 @@ -
- -
-
- - - - + +
+
+
+
+ + + + +
+
+
{% include 'cpu.twig' %}