diff options
| -rw-r--r-- | static/style.css | 29 | ||||
| -rw-r--r-- | templates/cytoscape.html | 16 |
2 files changed, 44 insertions, 1 deletions
diff --git a/static/style.css b/static/style.css index 867a753..f57b27c 100644 --- a/static/style.css +++ b/static/style.css @@ -5,6 +5,17 @@ left: 0px; } +@media (min-width: 768px){ + .container{ + max-width:90%; + } +} + +@media (min-width: 992px){ + .container{ + max-width:90%; + } +} a:link { color: #097DC9; @@ -24,3 +35,21 @@ a:hover { a:active { color: #097DC9; } + +* { + box-sizing: border-box; +} + +.column { + float: left; +} + +.left { + width: 80%; +} + +.right { + width: 20%; +} + + diff --git a/templates/cytoscape.html b/templates/cytoscape.html index e837e0c..98968c8 100644 --- a/templates/cytoscape.html +++ b/templates/cytoscape.html @@ -3,7 +3,20 @@ <script src="https://cdnjs.cloudflare.com/ajax/libs/cytoscape/3.6.0/cytoscape.min.js" integrity="sha256-uZV2wRlscgr52q3Wb3Oew0rKCPsM3g4aBTv46sF4qzg=" crossorigin="anonymous"></script> - <div id="cy"></div> + +<div class="row"> + <div class="column left" > + +<h4> {{ message |safe}} </h4> + </div> + + <div class="column right"> + + {{ message2 |safe}} +</div> + + + <div id="cy"></div> <script> var cy = cytoscape({ container: document.getElementById('cy'), @@ -89,4 +102,5 @@ }); </script> + {% endblock %} |