From d9884ef7848bfe7724c884e19d5ca6f1413c95eb Mon Sep 17 00:00:00 2001 From: Your Name Date: Thu, 16 Apr 2020 14:33:33 +0200 Subject: [PATCH] about page --- static/about.css | 62 ++++++++++++++++++++++++++++++++++++ static/index.css | 76 +++++++++++++++++++++++++++----------------- templates/about.html | 13 ++++++++ 3 files changed, 121 insertions(+), 30 deletions(-) create mode 100644 static/about.css create mode 100644 templates/about.html diff --git a/static/about.css b/static/about.css new file mode 100644 index 0000000..5aa3c22 --- /dev/null +++ b/static/about.css @@ -0,0 +1,62 @@ +body { + background-color: #F4EBE8; + +} + +.projtextcont{ + display: block; + /*align-items: center; + justify-content: center*/ + margin-left:200px; + font-family: Roboto Mono; + +} + +.projtext{ + width: 50%; + height: 50%; + display: block; + +} + +h1{ + display: block; +} + +.pagelink{ + position: fixed; + display: inline; + left:0px; + width:20px; + height:20px; + padding:10px; + background-color: white; + z-index: 10; + font-size: 18px; + text-align: center; + border-top-style: solid; + border-right-style: solid; + border-bottom-style: solid; + /*border-style: solid;*/ + border-width: 1px; + border-color: #371F10; + +} + +.pagelink:hover{ + background-color: #0BEFEB; +} +.pagelink a{ + text-decoration: none; +} + +.pagelink .pagename{ + display: inline; + position: absolute; + width: auto; + padding: 5px; + margin-left: 25px; + font-size: 13px; + background-color: white; + visibility: hidden; +}s \ No newline at end of file diff --git a/static/index.css b/static/index.css index 1fb3728..3cea8a2 100644 --- a/static/index.css +++ b/static/index.css @@ -5,7 +5,7 @@ body { display: inline-table; font-family: Roboto Mono; bottom: 20px; - + scrollbar-width: thin; } /*.img { @@ -64,27 +64,40 @@ display: inline-block; .pagelink{ position: fixed; - display: inline-block; + display: inline; left:0px; width:20px; + height:20px; padding:10px; background-color: white; z-index: 10; - font-size: 15px; - border-style: solid; + font-size: 18px; + text-align: center; + border-top-style: solid; + border-right-style: solid; + border-bottom-style: solid; + /*border-style: solid;*/ border-width: 1px; - border-color: #371F10 + border-color: #371F10; + +} + +.pagelink:hover{ + background-color: #0BEFEB; +} +.pagelink a{ + text-decoration: none; } .pagelink .pagename{ - display: block; + display: inline; position: absolute; - width:auto; + width: auto; padding: 5px; - font-size: 10px; + margin-left: 25px; + font-size: 13px; background-color: white; visibility: hidden; - font-size: 15px; } .pagelink:hover .pagename{ @@ -112,11 +125,11 @@ display: inline-block; padding: 10px; /*border-radius: 6px;*/ /* font-family: CothamSans;*/ - font-size: 18px; + font-size: 16px; position: absolute; /*top: 0px;*/ z-index: 1; - margin-top: 0px; + margin-top:-10px; /*vertical-align: top;*/ line-height: 1.3; word-wrap:break-word @@ -126,12 +139,12 @@ display: inline-block; visibility: visible; } -ul#nav li{ +/*ul#nav li{ display: inline; list-style: none; margin-left: 10px; /* margin-left: 10% - margin-right: 10%;*/ + margin-right: 10%; align-content: initial; font-size: 20px; @@ -147,13 +160,13 @@ ul#nav{ padding-left: 0px; border: none; width: 80vw; - /*display: inline;*/ + /*display: inline; height:20px; - /*overflow-x: scroll;*/ + /*overflow-x: scroll; left:0px; position: fixed; z-index: 1; -} +}*/ ul#menu li{ display: inline; @@ -165,31 +178,29 @@ ul#menu li{ } ul#menu{ - margin-left: 10px; + margin-left: 45px; margin-right: 10px; - top:0px; + top:-15px; bottom: 10px; padding-left: 0px; border: none; - width: 85vw; - /*display: inline;*/ + width: 80vw; height:100%; - /*overflow-x: scroll;*/ left:0px; margin-bottom: 20px; padding-bottom: 20px; position: absolute; - /*z-index: -1; */ + scrollbar-width: thin; } div#myBtnContainer{ - /* background-color: white;*/ + /*background-color: #F4EBE8;*/ /*margin-top: 20px;*/ margin-left: 30px; margin-bottom: 30px; border: none; - width: 15vw; + max-width: 15vw; display: inline; /* visibility: hidden;*/ height:100%; @@ -197,19 +208,24 @@ div#myBtnContainer{ top:0px; position: fixed; padding:10px; - overflow-y: scroll; + overflow-y: hidden; /*z-index: -1;*/ - +overflow-y: scroll; + scrollbar-width: thin; /* overflow-y: hidden;*/ } -div#bigbtncontainer{ +div#myBtnContainer:hover{ + +} + +/*div#bigbtncontainer{ overflow-y: hidden; - -ms-overflow-style: none; /* Internet Explorer 10+ */ + -ms-overflow-style: none; Internet Explorer 10+ scrollbar-width: thin; - /*overflow-y: scroll;*/ + /*overflow-y: scroll; -} +}*/ /*div#myBtnContainer:hover{ background-color: white; z-index: 1; diff --git a/templates/about.html b/templates/about.html new file mode 100644 index 0000000..1d22e9d --- /dev/null +++ b/templates/about.html @@ -0,0 +1,13 @@ + + + + + + + + {{ page.name }} + + + {{ body|safe }} + +