Improve UI in offline Yaksh

1 files changed, 83 insertions, 18 deletions

diff --git a/yaksh/static/yaksh/css/offline.css b/yaksh/static/yaksh/css/offline.css
index 1ec40ab..66d805e 100644
--- a/yaksh/static/yaksh/css/offline.css
+++ b/yaksh/static/yaksh/css/offline.css
@@ -1,18 +1,83 @@
-.footer {

-    position: fixed;

-    left: 0;

-    bottom: 0;

-    width: 100%;

-    background-color: #D3D3D3;

-    color: black;

-    text-align: center;

-}

-

-.module {

-    border: none;

-    border-spacing: 0;

-    border-collapse: collapse;

-}

-.module tr td:nth-child(2) {

-    border-left: 1px solid #D3D3D3;

-}
\ No newline at end of file
+#footer {
+  position:fixed;
+  bottom:0;
+  width:100%;
+  height:60px;   /* Height of the footer */
+  background-color: #D3D3D3;
+  color: black;
+  text-align: center;
+}
+
+.module {
+  border: none;
+  border-spacing: 0;
+  border-collapse: collapse;
+}
+.module tr td:nth-child(2) {
+  border-left: 1px solid #D3D3D3;
+}
+
+/*
+ * Sidebar
+ */
+
+.sidebar {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 100; /* Behind the navbar */
+  padding: 48px 0 0; /* Height of navbar */
+  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
+}
+
+.sidebar-sticky {
+  position: relative;
+  top: 0;
+  height: calc(100vh - 48px);
+  padding-top: .5rem;
+  overflow-x: hidden;
+  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
+}
+
+@supports ((position: -webkit-sticky) or (position: sticky)) {
+  .sidebar-sticky {
+    position: -webkit-sticky;
+    position: sticky;
+  }
+}
+
+.sidebar .nav-link {
+  font-weight: 500;
+  color: #333;
+}
+
+.sidebar .nav-link .feather {
+  margin-right: 4px;
+  color: #999;
+}
+
+.sidebar .nav-link.active {
+  color: #007bff;
+}
+
+.sidebar .nav-link:hover .feather,
+.sidebar .nav-link.active .feather {
+  color: inherit;
+}
+
+.sidebar-heading {
+  font-size: .75rem;
+  text-transform: uppercase;
+}
+
+/*.footer {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    background-color: #D3D3D3;
+    color: black;
+    text-align: center;
+}
+*/
\ No newline at end of file