From 3201978aad9cc1f10a792c58debee838691652cf Mon Sep 17 00:00:00 2001 From: pinpom Date: Wed, 6 May 2020 11:11:37 +0800 Subject: [PATCH 1/7] add web folder --- web/README.md | 1 + web/css/buttons.css | 181 ++++++++++++++++++++++++++++++++++++++++ web/css/styles.css | 25 ++++++ web/images/nus-logo.svg | 1 + web/index.html | 83 ++++++++++++++++++ 5 files changed, 291 insertions(+) create mode 100644 web/README.md create mode 100644 web/css/buttons.css create mode 100644 web/css/styles.css create mode 100644 web/images/nus-logo.svg create mode 100644 web/index.html diff --git a/web/README.md b/web/README.md new file mode 100644 index 00000000..24fd0393 --- /dev/null +++ b/web/README.md @@ -0,0 +1 @@ +# Simple-QA-App diff --git a/web/css/buttons.css b/web/css/buttons.css new file mode 100644 index 00000000..2a88e8b6 --- /dev/null +++ b/web/css/buttons.css @@ -0,0 +1,181 @@ +/*======= 3. BUTTONS STYLES =======*/ +#label-icons .btn-radius { + border-radius: 100px !important; +} +#label-icons .btn { + font-size: 13px; + font-weight: bold; + letter-spacing: 1px; + border-radius: 2px; + padding: 13px 28px; + text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.14); + text-transform: uppercase; + box-shadow: 0 4px 9px 0 rgba(0, 0, 0, 0.2); +} +#label-icons .btn-sm { + font-size: 11px; + font-weight: 600; + padding: 11px 25px; +} +#label-icons .btn-lg { + padding: 18px 49px; +} +#label-icons .btn-xs { + font-size: 10px; + padding: 8px 14px; +} +#label-icons .btn-primary { + background: #5a7ce2; + background: -moz-linear-gradient(-45deg, #5a7ce2 0%, #8283e8 50%, #5c5de8 51%, #565bd8 71%, #575cdb 100%); + background: -webkit-linear-gradient(-45deg, #5a7ce2 0%,#8283e8 50%,#5c5de8 51%,#565bd8 71%,#575cdb 100%); + background: linear-gradient(135deg, #5a7ce2 0%,#8283e8 50%,#5c5de8 51%,#565bd8 71%,#575cdb 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5a7ce2', endColorstr='#575cdb',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-secondary{ + background: #797b7f; + background: -moz-linear-gradient(-45deg, #797b7f 0%, #b5b8bf 50%, #8e9397 51%, #8e9397 71%, #828589 100%); + background: -webkit-linear-gradient(-45deg, #797b7f 0%,#b5b8bf 50%,#8e9397 51%,#8e9397 71%,#828589 100%); + background: linear-gradient(135deg, #797b7f 0%,#b5b8bf 50%,#8e9397 51%,#8e9397 71%,#828589 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#797b7f', endColorstr='#828589',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-success{ + background: #05ac50; + background: -moz-linear-gradient(-45deg, #05ac50 0%, #21dd72 50%, #05c44e 51%, #05ac50 71%, #05ac50 100%); + background: -webkit-linear-gradient(-45deg, #05ac50 0%,#21dd72 50%,#05c44e 51%,#05ac50 71%,#05ac50 100%); + background: linear-gradient(135deg, #05ac50 0%,#21dd72 50%,#05c44e 51%,#05ac50 71%,#05ac50 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05ac50', endColorstr='#05ac50',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-danger{ + background: #e81216; + background: -moz-linear-gradient(-45deg, #e81216 0%, #f45355 50%, #f6290c 51%, #ed0e11 71%, #fc1b21 100%); + background: -webkit-linear-gradient(-45deg, #e81216 0%,#f45355 50%,#f6290c 51%,#ed0e11 71%,#fc1b21 100%); + background: linear-gradient(135deg, #e81216 0%,#f45355 50%,#f6290c 51%,#ed0e11 71%,#fc1b21 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e81216', endColorstr='#fc1b21',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-warning{ + background: #e5ae09; + background: -moz-linear-gradient(-45deg, #e5ae09 0%, #ffd044 50%, #ffc107 51%, #fc9014 71%, #f1890b 100%); + background: -webkit-linear-gradient(-45deg, #e5ae09 0%,#ffd044 50%,#ffc107 51%,#fc9014 71%,#f1890b 100%); + background: linear-gradient(135deg, #e5ae09 0%,#ffd044 50%,#ffc107 51%,#fc9014 71%,#f1890b 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5ae09', endColorstr='#f1890b',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; + color: #fff !important; +} +#label-icons .btn-info{ + background: #01a8c1; + background: -moz-linear-gradient(-45deg, #01a8c1 0%, #2adbf7 50%, #00b5d1 51%, #0aafc9 71%, #0599b1 100%); + background: -webkit-linear-gradient(-45deg, #01a8c1 0%,#2adbf7 50%,#00b5d1 51%,#0aafc9 71%,#0599b1 100%); + background: linear-gradient(135deg, #01a8c1 0%,#2adbf7 50%,#00b5d1 51%,#0aafc9 71%,#0599b1 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#01a8c1', endColorstr='#0599b1',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-light{ + background: #f2f2f2; + background: -moz-linear-gradient(-45deg, #f2f2f2 0%, #dddddd 50%, #ffffff 51%, #ffffff 71%, #f6f8fb 100%); + background: -webkit-linear-gradient(-45deg, #f2f2f2 0%,#dddddd 50%,#ffffff 51%,#ffffff 71%,#f6f8fb 100%); + background: linear-gradient(135deg, #f2f2f2 0%,#dddddd 50%,#ffffff 51%,#ffffff 71%,#f6f8fb 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#f6f8fb',GradientType=1 ); + color: #3f345f !important; + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +#label-icons .btn-dark{ + background: #343a40; + background: -moz-linear-gradient(-45deg, #343a40 0%, #667584 50%, #4e5256 51%, #242a30 71%, #343a40 100%); + background: -webkit-linear-gradient(-45deg, #343a40 0%,#667584 50%,#4e5256 51%,#242a30 71%,#343a40 100%); + background: linear-gradient(135deg, #343a40 0%,#667584 50%,#4e5256 51%,#242a30 71%,#343a40 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#343a40', endColorstr='#343a40',GradientType=1 ); + background-size: 400% 400%; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + -webkit-animation: AnimationName 3s ease infinite; + -moz-animation: AnimationName 3s ease infinite; + animation: AnimationName 3s ease infinite; + border: medium none; +} +@-webkit-keyframes AnimationName { + 0%{ + background-position:0% 31% + } + 50%{ + background-position:100% 70% + } + 100%{ + background-position:0% 31% + } +} +@-moz-keyframes AnimationName { + 0%{ + background-position:0% 31% + } + 50%{ + background-position:100% 70% + } + 100%{ + background-position:0% 31% + } +} +@keyframes AnimationName { + 0%{ + background-position:0% 31% + } + 50%{ + background-position:100% 70% + } + 100%{ + background-position:0% 31% + } +} \ No newline at end of file diff --git a/web/css/styles.css b/web/css/styles.css new file mode 100644 index 00000000..cc1f5604 --- /dev/null +++ b/web/css/styles.css @@ -0,0 +1,25 @@ +header h1 { + color: #0076bb; +} + +nav ul li { + float: left; + list-style-type: none +} + +nav ul li a { + display: block; + padding: .5rem 1rem; + background-color: #0076bb; +} +main h1 { + clear: both; +} + +main img{ + float: right; +} + +footer{ + text-align: center +} diff --git a/web/images/nus-logo.svg b/web/images/nus-logo.svg new file mode 100644 index 00000000..ee1cd6fe --- /dev/null +++ b/web/images/nus-logo.svg @@ -0,0 +1 @@ + diff --git a/web/index.html b/web/index.html new file mode 100644 index 00000000..fec9a50f --- /dev/null +++ b/web/index.html @@ -0,0 +1,83 @@ + + + + + + + Simple Website + + + + + + +
+
+
+
+
+
+
Welcome! Please ask question
+
+
+
+
+
+

+

+ +

+

+ + +
+
+
+
+
+ +
+
+
+
+ + + + + \ No newline at end of file From 22d061978d919a0ed1566427959952f20722f466 Mon Sep 17 00:00:00 2001 From: pinpom Date: Wed, 6 May 2020 12:33:21 +0800 Subject: [PATCH 2/7] add url input --- web/css/styles.css | 15 +++++++++++++++ web/index.html | 36 ++++++++++++++++++++++-------------- 2 files changed, 37 insertions(+), 14 deletions(-) diff --git a/web/css/styles.css b/web/css/styles.css index cc1f5604..ca6cbe46 100644 --- a/web/css/styles.css +++ b/web/css/styles.css @@ -1,3 +1,8 @@ +html, body { + font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif; + height: 100%; + } + header h1 { color: #0076bb; } @@ -23,3 +28,13 @@ main img{ footer{ text-align: center } + +.myurl { + width: 300px; +} +.myarea { + width: 640px; +} +.myquestion { + width: 680px; +} \ No newline at end of file diff --git a/web/index.html b/web/index.html index fec9a50f..d0afa0db 100644 --- a/web/index.html +++ b/web/index.html @@ -19,23 +19,28 @@
-
+
Welcome! Please ask question
-
-
-

-

- -

-

- - -
-
+ +

+ +

+ +
+
+

+

+ +

+

+ + +
+
@@ -57,7 +62,10 @@
Welcome! Please ask question
} } - console.log(JSON.stringify(s)) + var url = document.getElementById('url').value + + // console.log(JSON.stringify(s)) + // console.log(url) var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { @@ -73,7 +81,7 @@
Welcome! Please ask question
} } }; - xmlhttp.open("POST", "http://0.0.0.0:80/register", true); + xmlhttp.open("POST", url, true); xmlhttp.send(JSON.stringify(s)); From 9d24f48d5e60e7b61df381c6cc9914aa2844e075 Mon Sep 17 00:00:00 2001 From: pinpom Date: Wed, 6 May 2020 16:56:31 +0800 Subject: [PATCH 3/7] change logo img to link & add nav-bar style --- web/css/styles.css | 46 ++++++++++++++++++++++++++++++++++++++++++++++ web/index.html | 4 ++-- 2 files changed, 48 insertions(+), 2 deletions(-) diff --git a/web/css/styles.css b/web/css/styles.css index ca6cbe46..69413c06 100644 --- a/web/css/styles.css +++ b/web/css/styles.css @@ -37,4 +37,50 @@ footer{ } .myquestion { width: 680px; +} + + + + +.pipe-navbar .navbar-nav-scroll { + max-width: 100%; + height: 2.4rem; + + overflow: hidden; + } + + +@media (max-width: 991.98px) { + + + .pipe-navbar .navbar-nav-scroll .navbar-nav { + padding-bottom: 2rem; + overflow-x: auto; + white-space: nowrap; + -webkit-overflow-scrolling: touch; + } +} + +@media (min-width: 768px) { + @supports ((position: -webkit-sticky) or (position:sticky)) { + .pipe-navbar { + position: -webkit-sticky; + position: sticky; + top: 0; + z-index: 1071; + + } + } +} + +@media (max-width: 576px) { + .navbar-nav-scroll { + overflow-x: auto; + white-space: nowrap; + overflow: hidden; + font-size: 0.875rem; + -webkit-overflow-scrolling: touch; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + } } \ No newline at end of file diff --git a/web/index.html b/web/index.html index d0afa0db..895af1b0 100644 --- a/web/index.html +++ b/web/index.html @@ -10,11 +10,11 @@ - +
From 35fe17f4b1a12387eac2c6c516e289188fc981e7 Mon Sep 17 00:00:00 2001 From: pinpom Date: Tue, 19 May 2020 11:48:00 +0800 Subject: [PATCH 4/7] change input area width style --- web/css/styles.css | 6 +++--- web/index.html | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/web/css/styles.css b/web/css/styles.css index 69413c06..f18aa6ba 100644 --- a/web/css/styles.css +++ b/web/css/styles.css @@ -30,13 +30,13 @@ footer{ } .myurl { - width: 300px; + width: 450px; } .myarea { - width: 640px; + width: 666px; } .myquestion { - width: 680px; + width: 702px; } diff --git a/web/index.html b/web/index.html index 895af1b0..db22540d 100644 --- a/web/index.html +++ b/web/index.html @@ -45,7 +45,7 @@
Welcome! Please ask question
-
+
From 5f9aef4838bc23cee87a6c9175a4c405352155e7 Mon Sep 17 00:00:00 2001 From: pinpom Date: Tue, 19 May 2020 11:59:27 +0800 Subject: [PATCH 5/7] change web title --- web/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/index.html b/web/index.html index db22540d..2a7ce4ed 100644 --- a/web/index.html +++ b/web/index.html @@ -4,7 +4,7 @@ - Simple Website + Covid-19 Q&A From 0075451d3eb3e1ccc1ff2925b33fb10ce7efe1e7 Mon Sep 17 00:00:00 2001 From: pinpom Date: Thu, 21 May 2020 11:16:59 +0800 Subject: [PATCH 6/7] hardcoded question area --- web/index.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/web/index.html b/web/index.html index 2a7ce4ed..6bd4e417 100644 --- a/web/index.html +++ b/web/index.html @@ -33,10 +33,10 @@
Welcome! Please ask question

-

- +

+

-

+

@@ -44,7 +44,7 @@
Welcome! Please ask question
- +
@@ -64,7 +64,7 @@
Welcome! Please ask question
var url = document.getElementById('url').value - // console.log(JSON.stringify(s)) + console.log(JSON.stringify(s)) // console.log(url) var xmlhttp = new XMLHttpRequest(); From a55b812ea08d2f5fb5b2fb5c15de1a912af1279b Mon Sep 17 00:00:00 2001 From: pinpom Date: Tue, 26 May 2020 11:38:38 +0800 Subject: [PATCH 7/7] re-organize web folder --- web/{ => tasks/question_answering}/README.md | 0 web/{ => tasks/question_answering}/css/buttons.css | 0 web/{ => tasks/question_answering}/css/styles.css | 0 web/{ => tasks/question_answering}/images/nus-logo.svg | 0 web/{ => tasks/question_answering}/index.html | 2 +- 5 files changed, 1 insertion(+), 1 deletion(-) rename web/{ => tasks/question_answering}/README.md (100%) rename web/{ => tasks/question_answering}/css/buttons.css (100%) rename web/{ => tasks/question_answering}/css/styles.css (100%) rename web/{ => tasks/question_answering}/images/nus-logo.svg (100%) rename web/{ => tasks/question_answering}/index.html (98%) diff --git a/web/README.md b/web/tasks/question_answering/README.md similarity index 100% rename from web/README.md rename to web/tasks/question_answering/README.md diff --git a/web/css/buttons.css b/web/tasks/question_answering/css/buttons.css similarity index 100% rename from web/css/buttons.css rename to web/tasks/question_answering/css/buttons.css diff --git a/web/css/styles.css b/web/tasks/question_answering/css/styles.css similarity index 100% rename from web/css/styles.css rename to web/tasks/question_answering/css/styles.css diff --git a/web/images/nus-logo.svg b/web/tasks/question_answering/images/nus-logo.svg similarity index 100% rename from web/images/nus-logo.svg rename to web/tasks/question_answering/images/nus-logo.svg diff --git a/web/index.html b/web/tasks/question_answering/index.html similarity index 98% rename from web/index.html rename to web/tasks/question_answering/index.html index 6bd4e417..0eb2e29c 100644 --- a/web/index.html +++ b/web/tasks/question_answering/index.html @@ -33,7 +33,7 @@
Welcome! Please ask question

-

+