diff --git a/app/public/css/panel.css b/app/public/css/panel.css index 21bf33d..b1c7399 100644 --- a/app/public/css/panel.css +++ b/app/public/css/panel.css @@ -6,6 +6,7 @@ /* Subpanels */ @import "subpanel/dash.css"; +@import "subpanel/keys.css"; *, *:before, *:after { margin: 0; @@ -42,64 +43,6 @@ body { flex-direction: column; } -.keys { - display: flex; - flex-direction: row; - flex-wrap: wrap; -} - -.key { - background: #555; - border: 3px solid #2a9fd6; - border-radius: 5px; - box-shadow: 5px 5px 10px #000; - margin: 20px; - width: 300px; - height: 100px; - cursor: pointer; - display: flex; - justify-content: flex-start; - flex-direction: row; - transition: box-shadow 0.2s; - overflow: hidden; -} - -.key:hover { - box-shadow: 0 0 10px #eee; -} - -.key i { - font-size: 48px; - margin: auto 0 auto 20px; -} - -.key span { - font-size: 16px; - vertical-align: center; - margin: auto; - -moz-user-select: none; - user-select: none; -} - -.key-name { - color: #2a9fd6; - font-family: 'Roboto Mono', monospace; -} - -pre { - overflow: auto; - line-height: 1.7em; - font-family: 'Roboto Mono', monospace; - border: 1px solid #666; - border-radius: 4px; - display: block; - padding: 10px; - font-size: 14px; - margin: 10px 0; - background: #222; - color: #2a9fd6; -} - .modal, .modal-box { z-index: 900; @@ -136,10 +79,6 @@ pre { animation-timing-function: ease; } -#createKey { - max-width: 920px; -} - .modal-header { border: 2px solid #2a9fd6; border-radius: 8px 8px 0 0; @@ -207,48 +146,3 @@ button:hover { ::-moz-focus-inner { outline: none; } - -.btn-del { - text-transform: uppercase; - border: 2px solid #ff6666; - color: #ccc; -} - -.btn-del:hover { - background-color: #ff6666; -} - -em { - text-transform: uppercase; - font-weight: bold; -} - -#identifier { - font-size: 14px; - background: #222; - color: #d3d3d3; - border: 1px solid #666; - border-radius: 4px; - padding: 10px; - margin: 10px 0; -} - -th { - text-transform: uppercase; - font-weight: bold; - padding: 10px; -} - -td { - padding: 10px; -} - -td input { - vertical-align: middle; -} - -td label { - margin-bottom: 2px; - padding-left: 3px; -} - diff --git a/app/public/css/subpanel/dash.css b/app/public/css/subpanel/dash.css index ef70b03..53d5432 100644 --- a/app/public/css/subpanel/dash.css +++ b/app/public/css/subpanel/dash.css @@ -1,8 +1,3 @@ -#dash-container { - display: flex; - flex-direction: column; -} - .dash-row { display: flex; flex-wrap: nowrap; diff --git a/app/public/css/subpanel/keys.css b/app/public/css/subpanel/keys.css new file mode 100644 index 0000000..4de9510 --- /dev/null +++ b/app/public/css/subpanel/keys.css @@ -0,0 +1,105 @@ +.keys { + display: flex; + flex-direction: row; + flex-wrap: wrap; +} + +.key { + background: #000; + border: 3px solid #2a9fd6; + border-radius: 5px; + box-shadow: 5px 5px 10px #000; + margin: 20px; + width: 300px; + height: 100px; + cursor: pointer; + display: flex; + justify-content: flex-start; + flex-direction: row; + transition: box-shadow 0.2s; + overflow: hidden; +} + +.key:hover { + box-shadow: 0 0 10px #eee; +} + +.key i { + font-size: 48px; + margin: auto 0 auto 20px; +} + +.key span { + font-size: 16px; + vertical-align: center; + margin: auto; + -moz-user-select: none; + user-select: none; +} + +.key-name { + color: #2a9fd6; + font-family: 'Roboto Mono', monospace; +} + +pre { + overflow: auto; + line-height: 1.7em; + font-family: 'Roboto Mono', monospace; + border: 1px solid #666; + border-radius: 4px; + display: block; + padding: 10px; + font-size: 14px; + margin: 10px 0; + background: #222; + color: #2a9fd6; +} + +#createKey { + max-width: 920px; +} + +.btn-del { + text-transform: uppercase; + border: 2px solid #ff6666; + color: #ccc; +} + +.btn-del:hover { + background-color: #ff6666; +} + +#identifier { + font-size: 14px; + background: #222; + color: #d3d3d3; + border: 1px solid #666; + border-radius: 4px; + padding: 10px; + margin: 10px 0; +} + +th { + text-transform: uppercase; + font-weight: bold; + padding: 10px; +} + +td { + padding: 10px; +} + +td input { + vertical-align: middle; +} + +td label { + margin-bottom: 2px; + padding-left: 3px; +} + +em { + text-transform: uppercase; + font-weight: bold; +} \ No newline at end of file diff --git a/public/views/panel/dash.html b/public/views/panel/dash.html index 755ade6..d284de8 100644 --- a/public/views/panel/dash.html +++ b/public/views/panel/dash.html @@ -1,4 +1,4 @@ -
+