From 877900f47beb0a559608f790294e2aff8069d5aa Mon Sep 17 00:00:00 2001 From: Sanchita Mishra <59258203+SanchitaMishra170676@users.noreply.github.com> Date: Thu, 1 Oct 2020 17:44:20 +0530 Subject: [PATCH] improved indentation | spaces Added intension for better look and understanding. --- dist/css/status_panel.css | 189 +++++++++++++++++++++++--------------- 1 file changed, 116 insertions(+), 73 deletions(-) diff --git a/dist/css/status_panel.css b/dist/css/status_panel.css index 42481a4f..a312010b 100644 --- a/dist/css/status_panel.css +++ b/dist/css/status_panel.css @@ -1,11 +1,15 @@ .status-panel { - overflow: hidden; - position: relative; - width: 100%; - height: 100%; - text-align: center; } + overflow: hidden; + position: relative; + width: 100%; + height: 100%; + text-align: center; +} + .status-panel h1 { - font-size: 1.5rem; } + font-size: 1.5rem; +} + .status-panel .st-card-front { position: absolute; width: 100%; @@ -13,90 +17,129 @@ display: flex; flex-direction: column; justify-content: center; - align-content: center; } + align-content: center; +} + .status-panel .st-card-back { display: flex; justify-content: space-between; - flex-direction: column; } - .status-panel .st-card-back .top_section .status-panel-annotation_row { - text-align: left; - font-size: 0.85rem; } - .status-panel .st-card-back .top_section .status-panel-annotation_row .row-overflow { - max-width: 150px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; } - .status-panel .st-card-back .bottom_section { - display: flex; - flex-direction: column; - justify-content: center; - align-content: center; } - .status-panel .st-card-back .bottom_section .status_alerts_row { - min-height: 1px; } - .status-panel .st-card-back .bottom_section .status_alerts_row .status_extra_alerts { - padding-top: 2px; - font-size: 0.85rem; } - .status-panel .st-card-back .center_content_hidden_section { - min-height: 1px; } - .status-panel .st-card-front, - .status-panel .st-card-back { - backface-visibility: hidden; - transition: transform 0.5s; } - -.marquee_container { - overflow: hidden; } - .marquee_container .marquee_element { - backface-visibility: hidden; - transition: transform 0.5s; - display: inline-block; - animation: marquee_container 15s linear infinite; } - .marquee_container .marquee_element:hover { - animation-play-state: paused; } + flex-direction: column; +} + + .status-panel .st-card-back .top_section .status-panel-annotation_row { + text-align: left; + font-size: 0.85rem; +} + + .status-panel .st-card-back .top_section .status-panel-annotation_row .row-overflow { + max-width: 150px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + + .status-panel .st-card-back .bottom_section { + display: flex; + flex-direction: column; + justify-content: center; + align-content: center; +} + + .status-panel .st-card-back .bottom_section .status_alerts_row { + min-height: 1px; +} + + .status-panel .st-card-back .bottom_section .status_alerts_row .status_extra_alerts { + padding-top: 2px; + font-size: 0.85rem; +} + + .status-panel .st-card-back .center_content_hidden_section { + min-height: 1px; +} + + .status-panel .st-card-front, + .status-panel .st-card-back{ + backface-visibility: hidden; + transition: transform 0.5s; +} + + .marquee_container { + overflow: hidden; +} + + .marquee_container .marquee_element { + backface-visibility: hidden; + transition: transform 0.5s; + display: inline-block; + animation: marquee_container 15s linear infinite; +} + + .marquee_container .marquee_element:hover { + animation-play-state: paused; +} + /* Make it move */ + @keyframes marquee_container { 0% { - transform: translate(0, 100%); } + transform: translate(0, 100%); + } 100% { - transform: translate(0, -100%); } } -.st-card-front .ok-text, .st-card-front .warning-text, .st-card-front .fail-text, .st-card-front .no-data-text, .st-card-front .disabled-text { - display: none; - font-size: 2.0rem; } + transform: translate(0, -100%); + } +} + .st-card-front .ok-text, .st-card-front .warning-text, .st-card-front .fail-text, .st-card-front .no-data-text, .st-card-front .disabled-text { + display: none; + font-size: 2.0rem; +} + + .ok-state .ok-text { + display: block; +} -.ok-state .ok-text { - display: block; } + .warn-state .warning-text { + display: block; +} -.warn-state .warning-text { - display: block; } + .error-state .fail-text { + display: block; +} -.error-state .fail-text { - display: block; } + .no-data-state .no-data-text { + display: block; +} -.no-data-state .no-data-text { - display: block; } + .disabled-state .disabled-text { + display: block; +} -.disabled-state .disabled-text { - display: block; } + .st-card.effect-hover .st-card-back { + -webkit-transform: rotateY(-180deg); + transform: rotateY(-180deg); +} -.st-card.effect-hover .st-card-back { - -webkit-transform: rotateY(-180deg); - transform: rotateY(-180deg); } + .st-card.effect-hover:hover .st-card-front, .st-card.effect-hover.flipped .st-card-front { + -webkit-transform: rotateY(-180deg); + transform: rotateY(-180deg); +} -.st-card.effect-hover:hover .st-card-front, .st-card.effect-hover.flipped .st-card-front { - -webkit-transform: rotateY(-180deg); - transform: rotateY(-180deg); } + .st-card.effect-hover:hover .st-card-back, .st-card.effect-hover.flipped .st-card-back { + -webkit-transform: rotateY(0); + transform: rotateY(0); +} -.st-card.effect-hover:hover .st-card-back, .st-card.effect-hover.flipped .st-card-back { - -webkit-transform: rotateY(0); - transform: rotateY(0); } + .st-card:not(.effect-hover) .st-card-front { + display: none; +} -.st-card:not(.effect-hover) .st-card-front { - display: none; } + .boldAlertMetric { + font-weight: bold; +} -.boldAlertMetric { - font-weight: bold; } + .italicAlertMetric { + font-style: italic; +} -.italicAlertMetric { - font-style: italic; } -/*# sourceMappingURL=status_panel.css.map */