Merge pull request #117 from DARIAH-DE/graph

Testing <- Graph
DARIAH-DE · Jan 24, 2019 · b477aa5 · b477aa5
2 parents 30cfe21 + 99f8f13
commit b477aa5
Show file tree

Hide file tree

Showing 7 changed files with 498 additions and 109 deletions.
diff --git a/application/gui.py b/application/gui.py
@@ -12,7 +12,7 @@
 PARENT = Path(__file__).parent
 TITLE = "Topics Explorer :: DARIAH-DE"
 ICON = str(Path(PARENT, "static", "img", "logos", "favicon-template.png"))
-PORT = 5000
+PORT = 5010
 
 # This is for high DPI scaling:
 if hasattr(QtCore.Qt, "AA_EnableHighDpiScaling"):
@@ -53,7 +53,7 @@ def __del__(self):
         self.wait()
 
     def run(self):
-        self.application.run(port=self.port)
+        self.application.run(port=self.port, debug=True)
 
 
 class WebPage(QtWebEngineWidgets.QWebEnginePage):

diff --git a/application/static/css/dariah-styles.css b/application/static/css/dariah-styles.css
@@ -1101,9 +1101,14 @@ th {
 }
 
 .header {
+    z-index: 10;
     background: #213365;
     padding: 0 12px;
-    position: relative
+    /*position: relative;*/
+    position: fixed;
+    top: 0;
+    width: 100%
+
 }
 
 .header:after,
@@ -1462,6 +1467,7 @@ th {
 }
 
 .main {
+    margin-top: 60px;
     -webkit-transition: -webkit-filter .2s;
     transition: -webkit-filter .2s;
     transition: filter .2s;
@@ -2863,4 +2869,108 @@ th {
     margin-right: auto;
     margin-bottom: 10px;
     width: 50px;
+}
+
+
+
+
+
+#document-document-graph{
+    margin: auto;
+    width: 60%;
+}
+
+wrapper {
+    position: relative;
+    width: 900px;
+    height: 900px;
+}
+
+/*div.outerBorder {*/
+    /*position: relative;*/
+    /*top: 400px;*/
+    /*width: 600px;*/
+    /*height: 44px;*/
+    /*margin: auto auto auto auto;*/
+    /*border: 8px solid rgba(0, 0, 0, 0.1);*/
+    /*background: rgb(252, 252, 252); !* Old browsers *!*/
+    /*background: -moz-linear-gradient(top, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%); !* FF3.6+ *!*/
+    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252, 252, 252, 1)), color-stop(100%, rgba(237, 237, 237, 1))); !* Chrome,Safari4+ *!*/
+    /*background: -webkit-linear-gradient(top, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%); !* Chrome10+,Safari5.1+ *!*/
+    /*background: -o-linear-gradient(top, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%); !* Opera 11.10+ *!*/
+    /*background: -ms-linear-gradient(top, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%); !* IE10+ *!*/
+    /*background: linear-gradient(to bottom, rgba(252, 252, 252, 1) 0%, rgba(237, 237, 237, 1) 100%); !* W3C *!*/
+    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#ededed', GradientType=0); !* IE6-9 *!*/
+    /*border-radius: 72px;*/
+    /*box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);*/
+/*}*/
+
+
+#loadingBar {
+    /*position: absolute;*/
+    margin: auto;
+    top: 0px;
+    left: 0px;
+    width: 902px;
+    height: 902px;
+    background-color: rgba(200, 200, 200, 0.8);
+    -webkit-transition: all 0.5s ease;
+    -moz-transition: all 0.5s ease;
+    -ms-transition: all 0.5s ease;
+    -o-transition: all 0.5s ease;
+    transition: all 0.5s ease;
+    opacity: 1;
+}
+
+#bar {
+    position: relative;
+    top: 0px;
+    left: 0px;
+    width: 20px;
+    height: 20px;
+    margin: auto auto 0 0;
+    border-radius: 11px;
+    border: 2px solid rgba(30, 30, 30, 0.05);
+    background: #494E7D;
+    box-shadow: 2px 0px 4px rgba(0, 0, 0, 0.4);
+}
+
+.slidecontainer {
+    margin: auto;
+  width: 60%; /* Width of the outside container */
+}
+
+/* The slider itself */
+.slider {
+  -webkit-appearance: none;  /* Override default CSS styles */
+  appearance: none;
+  width: 100%; /* Full-width */
+  height: 25px; /* Specified height */
+  background: #d3d3d3; /* Grey background */
+  outline: none; /* Remove outline */
+  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
+  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
+  transition: opacity .2s;
+}
+
+/* Mouse-over effects */
+.slider:hover {
+  opacity: 1; /* Fully shown on mouse-over */
+}
+
+/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
+.slider::-webkit-slider-thumb {
+  -webkit-appearance: none; /* Override default look */
+  appearance: none;
+  width: 25px; /* Set a specific slider handle width */
+  height: 25px; /* Slider handle height */
+  background: #494E7D; /* Green background */
+  cursor: pointer; /* Cursor on hover */
+}
+
+.slider::-moz-range-thumb {
+  width: 25px; /* Set a specific slider handle width */
+  height: 25px; /* Slider handle height */
+  background: #494E7D; /* Green background */
+  cursor: pointer; /* Cursor on hover */
 }