diff options
-rw-r--r-- | codeless/settings.py | 10 | ||||
-rw-r--r-- | codeless/urls.py | 2 | ||||
-rw-r--r-- | static/inventory/bank.css | 76 | ||||
-rw-r--r-- | static/inventory/card.css | 59 | ||||
-rw-r--r-- | static/inventory/sidenav.css | 114 | ||||
-rw-r--r-- | static/inventory/table.css | 112 | ||||
-rw-r--r-- | static/inventory/web-common/.gitignore | 6 | ||||
-rw-r--r-- | static/inventory/web-common/demo.css | 69 | ||||
-rw-r--r-- | static/inventory/web-common/taler-fallback.css | 15 | ||||
-rw-r--r-- | templates/inventory/base1.html | 49 | ||||
-rw-r--r-- | templates/inventory/base2.html | 49 | ||||
-rw-r--r-- | templates/inventory/digital_inventory.html | 172 | ||||
-rw-r--r-- | templates/inventory/home.html | 186 | ||||
-rw-r--r-- | templates/inventory/index.html | 78 | ||||
-rw-r--r-- | templates/inventory/login.html | 177 | ||||
-rw-r--r-- | templates/inventory/new_product.html | 180 | ||||
-rw-r--r-- | templates/inventory/order.html | 138 | ||||
-rw-r--r-- | templates/inventory/product.html | 196 | ||||
-rw-r--r-- | templates/inventory/signup.html | 179 |
19 files changed, 653 insertions, 1214 deletions
diff --git a/codeless/settings.py b/codeless/settings.py index cc60008..1d53365 100644 --- a/codeless/settings.py +++ b/codeless/settings.py @@ -107,7 +107,15 @@ USE_TZ = True # Static files (CSS, JavaScript, Images) # https://docs.djangoproject.com/en/1.8/howto/static-files/ -STATIC_URL = '/static/' +STATIC_ROOT = 'staticfiles' +STATIC_PATH = os.path.join(BASE_DIR,'static/inventory') + +STATIC_URL = '/static/' + +STATICFILES_DIRS = ( + STATIC_PATH, +) + MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'media') diff --git a/codeless/urls.py b/codeless/urls.py index 10b6aa3..1d85bde 100644 --- a/codeless/urls.py +++ b/codeless/urls.py @@ -3,6 +3,8 @@ from django.contrib import admin from django.contrib.auth import views as auth_views from django.conf import settings from django.conf.urls.static import static +from django.views.generic import TemplateView + urlpatterns = [ # Examples: diff --git a/static/inventory/bank.css b/static/inventory/bank.css new file mode 100644 index 0000000..0b195ba --- /dev/null +++ b/static/inventory/bank.css @@ -0,0 +1,76 @@ +h1.nav { + width: 92%; + display: inline-block; +} + +div.pages-list { + margin-top: 15px; +} + +a.page-number { + color: blue; +} + +a.current-page-number { + color: inherit; +} + +a.pure-button { + position: absolute; + right: 20px; + top: 23px; +} + +.cancelled { + text-decoration: line-through; +} + +input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} + +input[type="number"] { + -moz-appearance: textfield; +} + +#transfer-fields { + display: flex; + flex-wrap: wrap; +} + +#id_amount { + width: 6em; + display: inline-block; + border-radius: 4px 0px 0px 4px; +} + +/** + * Amount without the currency, + * placed left to a .currency-indicator. + */ +#main .amount { + width: 6em; + display: inline-block; + border-radius: 4px 0px 0px 4px; +} + +/* + * Currency indicator to the right of input fields, + * with non-rounded corners to the left. + */ +#main .currency-indicator { + color: black; + display: inline-block; + border-radius: 0px 4px 4px 0px; +} + +#main .fieldlabel { + display: block; + padding-bottom: 0.5em; +} + +#main .fieldbox { + margin-right: 1em; + margin-bottom: 0.5em; +} diff --git a/static/inventory/card.css b/static/inventory/card.css new file mode 100644 index 0000000..ca0c299 --- /dev/null +++ b/static/inventory/card.css @@ -0,0 +1,59 @@ +.btn { + background-color: white; + border: 1px solid #cccccc; + color: #696969; + padding: 0.5rem; + text-transform: lowercase; +} +.btnblock { + display: block; + width: 100%; +} +.cards { + display: flex; + flex-wrap: wrap; + list-style: none; + margin: 0; + padding: 0; +} +.cards__item { + /*display: flex;*/ + padding: 1rem; +} +@media (min-width: 40rem) { + .cards__item { + width: 50%; + } +} +@media (min-width: 56rem) { + .cards__item { + width: 33.3333%; + } +} +.card { + background-color: white; + border-radius: 0.25rem; + box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25); + display: flex; + flex-direction: column; + overflow: hidden; +} +.card__content { + display: flex; + flex: 1 1 auto; + flex-direction: column; + padding: 1rem; +} +.card__title { + color: #696969; + font-size: 1.25rem; + font-weight: 300; + letter-spacing: 2px; + text-transform: uppercase; +} +.card__text { + flex: 1 1 auto; + font-size: 0.875rem; + line-height: 1.5; + margin-bottom: 1.25rem; +}
\ No newline at end of file diff --git a/static/inventory/sidenav.css b/static/inventory/sidenav.css new file mode 100644 index 0000000..66d25df --- /dev/null +++ b/static/inventory/sidenav.css @@ -0,0 +1,114 @@ +*, +*::before, +*::after { + box-sizing: border-box; +} +html { + background-color: #f0f0f0; +} +body { + /*color: #999999;*/ + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-style: normal; + font-weight: 400; + letter-spacing: 0; + padding: 1rem; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -moz-font-feature-settings: "liga" on; +} +#contact {width:100%; height:100%; margin 0 auto; /*background: #DDD;*/ } + +.container {width:900px; height:auto; margin: 0 auto; padding: 50px 0;} + +#contact .container form input, +#contact .container form textarea { + width:97.4%; + height:30px; + padding:5px 10px; + font-size: 12px; + color:#999; + letter-spacing:1px; + background: #FFF; + border:2px solid #FFF; + margin-bottom:25px;} + +#contact .container form input:focus, +#contact .container form textarea:focus { + border:2px solid #dd4545; + color:#999;} + +#contact .container form textarea { + height:150px;} + +#contact .container form .submit { + width:97%; + padding:5px 10px; + font-size: 12px; + letter-spacing:1px; + background:#dd4545; + height:40px; + text-transform:uppercase; + letter-spacing:1px; + color:#FFF; + border:2px solid #b43838; + -webkit-transition:all .1s ease-in-out; + -moz-transition:all .1s ease-in-out; + -ms-transition:all .1s ease-in-out; + -o-transition:all .1s ease-in-out; + transition:all .1s ease-in-out;} + +#contact .container form .submit:hover { + color:#FFF; + border:2px solid #dd4545; + background: #b43838; + cursor:pointer;} + +#contact .container form .required { + color:#b43838;} + +ul { + color:red; + font-size:20px; + list-style-type: none; + margin: 0; + padding: 0;} + +.tooltip { + position: relative; + display: inline-block; +} + +.tooltip .tooltiptext { + visibility: hidden; + width: 300px; + background-color: #555; + color: #fff; + text-align: center; + border-radius: 6px; + padding: 5px 0; + position: absolute; + z-index: 1; + bottom: 125%; + left: 50%; + margin-left: -60px; + opacity: 0; + transition: opacity 0.3s; +} + +.tooltip .tooltiptext::after { + content: ""; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: #555 transparent transparent transparent; +} + +.tooltip:hover .tooltiptext { + visibility: visible; + opacity: 1; + }
\ No newline at end of file diff --git a/static/inventory/table.css b/static/inventory/table.css new file mode 100644 index 0000000..aae793d --- /dev/null +++ b/static/inventory/table.css @@ -0,0 +1,112 @@ +.table-fill { + background: white; + border-radius:3px; + border-collapse: collapse; + height: 320px; + margin: auto; + max-width: 600px; + padding:5px; + width: 100%; + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); + animation: float 5s infinite; +} + +th { + color:#D5DDE5;; + background:#1b1e24; + border-bottom:4px solid #9ea7af; + border-right: 1px solid #343a45; + font-size:23px; + font-weight: 100; + padding:24px; + text-align:left; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); + vertical-align:middle; +} + +th:first-child { + border-top-left-radius:3px; +} + +th:last-child { + border-top-right-radius:3px; + border-right:none; +} + +tr { + border-top: 1px solid #C1C3D1; + border-bottom-: 1px solid #C1C3D1; + color:#45485a; + font-size:16px; + font-weight:normal; + text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1); +} + +tr:hover td { + background:#4E5066; + color:#FFFFFF; + border-top: 1px solid #22262e; +} + +tr:first-child { + border-top:none; +} + +tr:last-child { + border-bottom:none; +} + +tr:nth-child(odd) td { + background:#EBEBEB; +} + +tr:nth-child(odd):hover td { + background:#4E5066; +} + +tr:last-child td:first-child { + border-bottom-left-radius:3px; +} + +tr:last-child td:last-child { + border-bottom-right-radius:3px; +} + +td { + background:#FFFFFF; + padding:20px; + text-align:left; + vertical-align:middle; + font-weight:300; + font-size:18px; + text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1); + border-right: 1px solid #C1C3D1; +} + +td:last-child { + border-right: 0px; +} + +th.text-left { + text-align: left; +} + +th.text-center { + text-align: center; +} + +th.text-right { + text-align: right; +} + +td.text-left { + text-align: left; +} + +td.text-center { + text-align: center; +} + +td.text-right { + text-align: right; +}
\ No newline at end of file diff --git a/static/inventory/web-common/.gitignore b/static/inventory/web-common/.gitignore new file mode 100644 index 0000000..e64e5c1 --- /dev/null +++ b/static/inventory/web-common/.gitignore @@ -0,0 +1,6 @@ +Makefile +Makefile.in +# these should be commited pre-build to the repo, too: +#taler-wallet-lib.js + +.idea diff --git a/static/inventory/web-common/demo.css b/static/inventory/web-common/demo.css new file mode 100644 index 0000000..b2688ad --- /dev/null +++ b/static/inventory/web-common/demo.css @@ -0,0 +1,69 @@ +/* style common to all demo pages */ + +.demobar h1 { + text-align: center; +} +.demobar > p { + padding: 0.5em; +} +.demobar a, +.demobar a:visited { + color: inherit; +} +.adorn-brackets::before { + content: "❬"; + color: #aa3939; +} +.adorn-brackets::after { + content: "❭"; + color: #aa3939; +} +.tt { + font-family: 'Lucida Console', Monaco, monospace; +} + +.informational-ok { + background: lightgreen; + border-radius: 1em; + padding: 0.5em; +} + +.informational-fail { + background: lightpink; + border-radius: 1em; + padding: 0.5em; +} + +.content { + overflow-x: auto; +} +.demobar { + overflow-x: auto; + background-color: #033; + color: white; +} + +body { + overflow-y: scroll; +} + +@media (min-width: 500px) { + .content { + margin-left: 25%; + padding-left: 2em; + margin-right: 1em; + overflow-x: auto; + } + .demobar { + height: 100%; + margin: 0; + top: 0; + left: 0; + background-color: #033; + color: white; + position: fixed; + width: 25%; + padding-right: 1em; + overflow: auto; + } +} diff --git a/static/inventory/web-common/taler-fallback.css b/static/inventory/web-common/taler-fallback.css new file mode 100644 index 0000000..e403d71 --- /dev/null +++ b/static/inventory/web-common/taler-fallback.css @@ -0,0 +1,15 @@ +/* Fallback stylesheet. Should be included in the document as follows: + * + * <link rel="stylesheet" + * href="taler-fallback.css" + * id="taler-presence-stylesheet /> + * + * When either the taler-wallet-lib is included or the wallet is presence, + * it will take over this stylesheet for presence detection. + * + * This fallback stylesheet makes sure that classes for presence detection + * are displayed correctly, even if JavaScript is disabled and the wallet + * is not present. + */ + +.taler-installed-show { display: none; } diff --git a/templates/inventory/base1.html b/templates/inventory/base1.html new file mode 100644 index 0000000..4c227e9 --- /dev/null +++ b/templates/inventory/base1.html @@ -0,0 +1,49 @@ +<!doctype html> +<!-- +This file is part of the Taler Codeless Merchant. +(C) 2018 GNUnet e.V. + +The Taler Codeless Merchant is free software: you can redistribute it and/or +modify it under the terms of the GNU Affero General Public License as published +by the Free Software Foundation, either version 3 of the License, or (at your +option) any later version. + +The Taler Codeless Merchant is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY +or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License +for more details. + +You should have received a copy of the GNU Affero General Public License along +with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. + +@author Shivam Kohli +@author Marcello Stanisci +@author Florian Dold + --> +{% load staticfiles %} +<html data-taler-nojs="true"> + <head> + <title>Merchant Demo</title> + <link rel="stylesheet" type="text/css" href="{% static 'pure.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'web-common/demo.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'sidenav.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'web-common/taler-fallback.css' %}" id="taler-presence-stylesheet" /> + <link rel="stylesheet" type="text/css" href="{% static 'bank.css' %}" /> + {% block head %} {% endblock %} + </head> + <body> + <div class="demobar"> + <h1><span class="tt adorn-brackets">Codeless Demo</span></h1> + <h1><span class="it"><a href="">Merchant</a></span></h1> + <p>Codeless is a platform for the merchant where they can manage their inventory and simultaneously create a 'Buy Now' button for the specific product. This code can be directly copy pasted on the seller's frontend and can be used for 'Pay with Taler'.</p> + <li><a href="/accounts/login">LOGIN</a></li> + <li><a href="/signup">REGISTER</a></li></li> + <li><a href="/password_reset">FORGET PASSWORD</a></li> + <p>You can learn more about Taler on our main <a href="https://taler.net">website</a>.</p> + </div> + <div class="content"> + {% block headermsg %} {% endblock %} + {% block content %} {% endblock %} + </div> + </body> +</html> diff --git a/templates/inventory/base2.html b/templates/inventory/base2.html new file mode 100644 index 0000000..d6aa9d3 --- /dev/null +++ b/templates/inventory/base2.html @@ -0,0 +1,49 @@ +<!doctype html> +<!-- +This file is part of the Taler Codeless Merchant. +(C) 2018 GNUnet e.V. + +The Taler Codeless Merchant is free software: you can redistribute it and/or +modify it under the terms of the GNU Affero General Public License as published +by the Free Software Foundation, either version 3 of the License, or (at your +option) any later version. + +The Taler Codeless Merchant is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY +or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License +for more details. + +You should have received a copy of the GNU Affero General Public License along +with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. + +@author Shivam Kohli +@author Marcello Stanisci +@author Florian Dold + --> +{% load staticfiles %} +<html data-taler-nojs="true"> + <head> + <title>Merchant Demo</title> + <link rel="stylesheet" type="text/css" href="{% static 'pure.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'web-common/demo.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'sidenav.css' %}" /> + <link rel="stylesheet" type="text/css" href="{% static 'web-common/taler-fallback.css' %}" id="taler-presence-stylesheet" /> + <link rel="stylesheet" type="text/css" href="{% static 'bank.css' %}" /> + {% block head %} {% endblock %} + </head> + <body> + <div class="demobar"> + <h1><span class="tt adorn-brackets">Codeless Demo</span></h1> + <h1><span class="it"><a href="">Merchant</a></span></h1> + <p>Codeless is a platform for the merchant where they can manage their inventory and simultaneously create a 'Buy Now' button for the specific product. This code can be directly copy pasted on the seller's frontend and can be used for 'Pay with Taler'.</p> + <li><a href="/home">Home</a> + <li><a href="/order">Order</a></li> + <li><a href="/logout">Logout</a></li> + <p>You can learn more about Taler on our main <a href="https://taler.net">website</a>.</p> + </div> + <div class="content"> + {% block headermsg %} {% endblock %} + {% block content %} {% endblock %} + </div> + </body> +</html> diff --git a/templates/inventory/digital_inventory.html b/templates/inventory/digital_inventory.html index 9eb462d..078233c 100644 --- a/templates/inventory/digital_inventory.html +++ b/templates/inventory/digital_inventory.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,170 +18,14 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Home</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - #contact {width:100%; height:100%; margin 0 auto; background: #DDD; } - - .container {width:960px; height:auto; margin: 0 auto; padding: 50px 0;} - - #contact .container form input, - #contact .container form textarea { - width:97.4%; - height:30px; - padding:5px 10px; - font-size: 12px; - color:#999; - letter-spacing:1px; - background: #FFF; - border:2px solid #FFF; - margin-bottom:25px; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form input:focus, - #contact .container form textarea:focus { - border:2px solid #dd4545; - color:#999;} - - #contact .container form textarea { - height:150px;} - - #contact .container form .submit { - width:100%; - padding:5px 10px; - font-size: 12px; - letter-spacing:1px; - background:#dd4545; - height:40px; - text-transform:uppercase; - letter-spacing:1px; - color:#FFF; - border:2px solid #b43838; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} +{% extends "inventory/base2.html" %} - #contact .container form .submit:hover { - color:#FFF; - border:2px solid #dd4545; - background: #b43838; - cursor:pointer;} - - #contact .container form .required { - color:#b43838;} - </style> - <style> - .tooltip { - position: relative; - display: inline-block; - } - - .tooltip .tooltiptext { - visibility: hidden; - width: 300px; - background-color: #555; - color: #fff; - text-align: center; - border-radius: 6px; - padding: 5px 0; - position: absolute; - z-index: 1; - bottom: 125%; - left: 50%; - margin-left: -60px; - opacity: 0; - transition: opacity 0.3s; - } - - .tooltip .tooltiptext::after { - content: ""; - position: absolute; - top: 100%; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: #555 transparent transparent transparent; - } - - .tooltip:hover .tooltiptext { - visibility: visible; - opacity: 1; - } - </style> -</head> -<body> - -<div class="sidenav"> - <a href="/home">Home</a> - <a href="/logout">Logout</a></li> - <a href="/order">Order</a></li> -</div> +{% block headermsg %} + <center><h1 class="nav">ADD A NEW PRODUCT</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - <center> - <h1>ADD A NEW PRODUCT</h1> - </center> - <section id="contact"> <div class="container"> <form method="post" enctype="multipart/form-data"> @@ -204,7 +48,5 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. </form> </div> </section> - </div> -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/home.html b/templates/inventory/home.html index 68d1b6a..5b5d6b6 100644 --- a/templates/inventory/home.html +++ b/templates/inventory/home.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,163 +18,39 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Home</title> - <!-- https://taler.net/images/logo-2018-dold.svg --> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - - .sidenav a:hover { - color: #f1f1f1; - } - .btn { - background-color: white; - border: 1px solid #cccccc; - color: #696969; - padding: 0.5rem; - text-transform: lowercase; - } - .btnblock { - display: block; - width: 100%; - } - .cards { - display: flex; - flex-wrap: wrap; - list-style: none; - margin: 0; - padding: 0; - } - .cards__item { - /*display: flex;*/ - padding: 1rem; - } - @media (min-width: 40rem) { - .cards__item { - width: 50%; - } - } - @media (min-width: 56rem) { - .cards__item { - width: 33.3333%; - } - } - .card { - background-color: white; - border-radius: 0.25rem; - box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25); - display: flex; - flex-direction: column; - overflow: hidden; - } - .card__content { - display: flex; - flex: 1 1 auto; - flex-direction: column; - padding: 1rem; - } - .card__title { - color: #696969; - font-size: 1.25rem; - font-weight: 300; - letter-spacing: 2px; - text-transform: uppercase; - } - .card__text { - flex: 1 1 auto; - font-size: 0.875rem; - line-height: 1.5; - margin-bottom: 1.25rem; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - </style> -</head> -<body> +{% extends "inventory/base2.html" %} -<div class="sidenav"> - <a href="/home">Home</a> - <a href="/logout">Logout</a></li> - <a href="/order">Order</a></li> -</div> +{% block headermsg %} +{% load staticfiles %} + <link rel="stylesheet" type="text/css" href="{% static 'card.css' %}" /> + <center><h1 class="nav">INVENTORY</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - <center> - <h1>INVENTORY</h1> - </center> - - <ul class="cards"> - {% for item in data %} - <li class="cards__item"> - <div class="card"> - <div class="card__content"> - <div class="card__title"><a href="{{ item.url }}">{{ item.name }}</a></div> - {% if item.digital == 'True' %} - <p class="card__text">Digital Inventory</p> - {% endif %} - <p class="card__text">{{ item.description }}</p><br> - {% if item.digital == 'False' %} - <p class="card__text"><b>Inventory on hand: </b>{{ item.inventory_on_hand }}</p> - {% endif %} - <!-- <button class="btn btnblock card__btn">Button</button> --> - </div> - </div> - </li> - {% endfor %} - </ul> - - <center><a id='add_new_product' href="/new_product">ADD PRODUCT</a></center></br> - <center><a href="/digital_inventory">ADD DIGITAL INVENTORY</a></center> + <ul class="cards"> + {% for item in data %} + <li class="cards__item"> + <div class="card"> + <div class="card__content"> + <div class="card__title"><a href="{{ item.url }}">{{ item.name }}</a></div> + {% if item.digital == 'True' %} + <p class="card__text">Digital Inventory</p> + {% endif %} + <p class="card__text">{{ item.description }}</p><br> + {% if item.digital == 'False' %} + <p class="card__text"><b>Inventory on hand: </b>{{ item.inventory_on_hand }}</p> + {% endif %} + <!-- <button class="btn btnblock card__btn">Button</button> --> + </div> + </div> + </li> + {% endfor %} + </ul> + + <center><a id='add_new_product' href="/new_product">ADD PRODUCT</a></center></br> + <center><a href="/digital_inventory">ADD DIGITAL INVENTORY</a></center> </div> - -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/index.html b/templates/inventory/index.html index c5009d3..d5bf795 100644 --- a/templates/inventory/index.html +++ b/templates/inventory/index.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,78 +18,14 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Sign Up</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } +{% extends "inventory/base1.html" %} - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - </style> -</head> -<body> -<div class="sidenav"> - <a href="/accounts/login">LOGIN</a> - <a href="/signup">REGISTER</a></li> - <a href="/password_reset">FORGET PASSWORD</a></li> -</div> +{% block headermsg %} + <center><h1 class="nav">LOGGED OUT</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - <center> - <h1>LOGGED OUT</h1> - </center> <h4>SUCCESSFULLY LOGGED OUT</h4> - </div> - -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/login.html b/templates/inventory/login.html index e7e6120..0160b15 100644 --- a/templates/inventory/login.html +++ b/templates/inventory/login.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,131 +18,14 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Sign Up</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - #contact {width:100%; height:100%; margin 0 auto; background: #DDD; } - - .container {width:960px; height:auto; margin: 0 auto; padding: 50px 0;} - - #contact .container form input, - #contact .container form textarea { - width:97.4%; - height:30px; - padding:5px 10px; - font-size: 12px; - color:#999; - letter-spacing:1px; - background: #FFF; - border:2px solid #FFF; - margin-bottom:25px; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form input:focus, - #contact .container form textarea:focus { - border:2px solid #dd4545; - color:#999;} - - #contact .container form textarea { - height:150px;} - - #contact .container form .submit { - width:100%; - padding:5px 10px; - font-size: 12px; - letter-spacing:1px; - background:#dd4545; - height:40px; - text-transform:uppercase; - letter-spacing:1px; - color:#FFF; - border:2px solid #b43838; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form .submit:hover { - color:#FFF; - border:2px solid #dd4545; - background: #b43838; - cursor:pointer;} +{% extends "inventory/base1.html" %} - #contact .container form .required { - color:#b43838;} - </style> -</head> -<body> -<div class="sidenav"> - <a href="/accounts/login">LOGIN</a> - <a href="/signup">REGISTER</a></li> - <a href="/password_reset">FORGET PASSWORD</a></li> -</div> +{% block headermsg %} + <center><h1 class="nav">Login</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - - - <center> - <h1>LOGIN</h1> - </center> <section id="contact"> <div class="container"> <form method="post" enctype="multipart/form-data"> @@ -156,51 +39,5 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. </form> </div> </section> - -<!-- <div> - <div> - <div> - <p>Login</p> - </div> - - <form method="post"> - {% csrf_token %} - - <fieldset> - {% for field in form %} - <div> - <p> - {{ field.label_tag }}<br> - {{ field }} - {% if field.help_text %} - <small style="color: grey">{{ field.help_text }}</small> - {% endif %} - </div> - - {% endfor %} - - </fieldset> - <fieldset> - {{error_message}} - <button type="submit">Log in</button> - <div> - <div> - <span>New User?</span> - <a href="/signup">Create Account</a> - </div> - <div> - <span>Forget Password?</span> - <a href="/password_reset">RESET</a> - </div> - - </fieldset> - </form> - - </div> - --> - - - </div> -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/new_product.html b/templates/inventory/new_product.html index a7d4cfb..9875c4a 100644 --- a/templates/inventory/new_product.html +++ b/templates/inventory/new_product.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,169 +18,14 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Home</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - #contact {width:100%; height:100%; margin 0 auto; background: #DDD; } - - .container {width:960px; height:auto; margin: 0 auto; padding: 50px 0;} - - #contact .container form input, - #contact .container form textarea { - width:97.4%; - height:30px; - padding:5px 10px; - font-size: 12px; - color:#999; - letter-spacing:1px; - background: #FFF; - border:2px solid #FFF; - margin-bottom:25px; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form input:focus, - #contact .container form textarea:focus { - border:2px solid #dd4545; - color:#999;} - - #contact .container form textarea { - height:150px;} +{% extends "inventory/base2.html" %} - #contact .container form .submit { - width:100%; - padding:5px 10px; - font-size: 12px; - letter-spacing:1px; - background:#dd4545; - height:40px; - text-transform:uppercase; - letter-spacing:1px; - color:#FFF; - border:2px solid #b43838; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form .submit:hover { - color:#FFF; - border:2px solid #dd4545; - background: #b43838; - cursor:pointer;} - - #contact .container form .required { - color:#b43838;} - </style> - <style> - .tooltip { - position: relative; - display: inline-block; - } - - .tooltip .tooltiptext { - visibility: hidden; - width: 300px; - background-color: #555; - color: #fff; - text-align: center; - border-radius: 6px; - padding: 5px 0; - position: absolute; - z-index: 1; - bottom: 125%; - left: 50%; - margin-left: -60px; - opacity: 0; - transition: opacity 0.3s; - } - - .tooltip .tooltiptext::after { - content: ""; - position: absolute; - top: 100%; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: #555 transparent transparent transparent; - } - - .tooltip:hover .tooltiptext { - visibility: visible; - opacity: 1; - } - </style> -</head> -<body> - -<div class="sidenav"> - <a href="/home">Home</a> - <a href="/logout">Logout</a></li> - <a href="/order">Order</a></li> -</div> +{% block headermsg %} + <center><h1 class="nav">ADD A NEW PRODUCT</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - <center> - <h1>ADD A NEW PRODUCT</h1> - </center> <section id="contact"> <div class="container"> @@ -188,19 +33,19 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. {% csrf_token %} <label for="name" class="tooltip">Name<font size="1"><span class="tooltiptext">Enter the name of the product</span></font></label> - <input type="text" name="name" id="name" placeholder="Name" required> + <input type="text" name="name" id="name" required> <label for="description" class="tooltip">Description<font size="1"><span class="tooltiptext">Describe the product in one or two lines</span></font></label> - <input type="text" name="description" id="description" placeholder="Description" required></input> + <input type="text" name="description" id="description" required></input> <label for="price" class="tooltip">Price<font size="1"><span class="tooltiptext">Enter the price of the product. Remeber to write price in English texts. For Example 100 or 99.95</span></font></label> - <input type="text" name="price" id="price" placeholder="Price" required> + <input type="text" name="price" id="price" required> <label for="starting_inventory" class="tooltip">Starting Inventory<font size="1"><span class="tooltiptext">Enter the number of Inventory initially available for the given product</span></font></label> - <input type="number" name="starting_inventory" id="starting_inventory" placeholder="Starting Inventory" required> + <input type="number" name="starting_inventory" id="starting_inventory" required> <label for="minimum_required" class="tooltip">Minimum Inventory Required<font size="1"><span class="tooltiptext">Enter the minimum number of inventory that is required for the given product(notifications will be send if inventory is below this llimit)</span></font></label> - <input type="number" name="minimum_required" id="minimum_required" placeholder="Minimum Inventory Required" required> + <input type="number" name="minimum_required" id="minimum_required" required> <button name="add_product" type="submit" class="submit">Add Product</button> @@ -208,5 +53,4 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. </div> </section> </div> -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/order.html b/templates/inventory/order.html index 7cf6daf..d4a3424 100644 --- a/templates/inventory/order.html +++ b/templates/inventory/order.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,135 +18,16 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Home</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } +{% extends "inventory/base2.html" %} - .sidenav a:hover { - color: #f1f1f1; - } - .btn { - background-color: white; - border: 1px solid #cccccc; - color: #696969; - padding: 0.5rem; - text-transform: lowercase; - } - .btnblock { - display: block; - width: 100%; - } - .cards { - display: flex; - flex-wrap: wrap; - list-style: none; - margin: 0; - padding: 0; - } - .cards__item { - /*display: flex;*/ - padding: 1rem; - } - @media (min-width: 40rem) { - .cards__item { - width: 50%; - } - } - @media (min-width: 56rem) { - .cards__item { - width: 33.3333%; - } - } - .card { - background-color: white; - border-radius: 0.25rem; - box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25); - display: flex; - flex-direction: column; - overflow: hidden; - } - .card__content { - display: flex; - flex: 1 1 auto; - flex-direction: column; - padding: 1rem; - } - .card__title { - color: #696969; - font-size: 1.25rem; - font-weight: 300; - letter-spacing: 2px; - text-transform: uppercase; - } - .card__text { - flex: 1 1 auto; - font-size: 0.875rem; - line-height: 1.5; - margin-bottom: 1.25rem; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } +{% block headermsg %} +{% load staticfiles %} + <link rel="stylesheet" type="text/css" href="{% static 'card.css' %}" /> + <center><h1 style="text-transform: uppercase;" id="name">ORDERS PLACED</h1></center> +{% endblock headermsg %} - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - </style> -</head> -<body> - -<div class="sidenav"> - <a href="/home">Home</a> - <a href="/logout">Logout</a></li> - <a href="/order">Order</a></li> -</div> +{% block content %} <div class="main"> - <center> - <h1 style="text-transform: uppercase;" id="name">ORDERS PLACED</h1> - </center> <ul class="cards"> {% for item in data %} <li class="cards__item"> @@ -180,5 +61,4 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. {% endfor %} </ul> </div> -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/product.html b/templates/inventory/product.html index 4ac9a20..bd2306b 100644 --- a/templates/inventory/product.html +++ b/templates/inventory/product.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,192 +18,24 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Home</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - </style> - <style type="text/css"> - .table-fill { - background: white; - border-radius:3px; - border-collapse: collapse; - height: 320px; - margin: auto; - max-width: 600px; - padding:5px; - width: 100%; - box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); - animation: float 5s infinite; - } - - th { - color:#D5DDE5;; - background:#1b1e24; - border-bottom:4px solid #9ea7af; - border-right: 1px solid #343a45; - font-size:23px; - font-weight: 100; - padding:24px; - text-align:left; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); - vertical-align:middle; - } - - th:first-child { - border-top-left-radius:3px; - } - - th:last-child { - border-top-right-radius:3px; - border-right:none; - } - - tr { - border-top: 1px solid #C1C3D1; - border-bottom-: 1px solid #C1C3D1; - color:#45485a; - font-size:16px; - font-weight:normal; - text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1); - } - - tr:hover td { - background:#4E5066; - color:#FFFFFF; - border-top: 1px solid #22262e; - } - - tr:first-child { - border-top:none; - } - - tr:last-child { - border-bottom:none; - } - - tr:nth-child(odd) td { - background:#EBEBEB; - } - - tr:nth-child(odd):hover td { - background:#4E5066; - } - - tr:last-child td:first-child { - border-bottom-left-radius:3px; - } - - tr:last-child td:last-child { - border-bottom-right-radius:3px; - } - - td { - background:#FFFFFF; - padding:20px; - text-align:left; - vertical-align:middle; - font-weight:300; - font-size:18px; - text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1); - border-right: 1px solid #C1C3D1; - } - - td:last-child { - border-right: 0px; - } - - th.text-left { - text-align: left; - } - - th.text-center { - text-align: center; - } - - th.text-right { - text-align: right; - } - - td.text-left { - text-align: left; - } - - td.text-center { - text-align: center; - } - - td.text-right { - text-align: right; - } - </style> -</head> -<body> - -<div class="sidenav"> - <a href="/home">Home</a> - <a href="/logout">Logout</a></li> - <a href="/order">Order</a></li> -</div> +{% extends "inventory/base2.html" %} -<div class="main"> - <center> +{% block headermsg %} + {% load staticfiles %} + <link rel="stylesheet" type="text/css" href="{% static 'table.css' %}" /> + <center> <h1 style="text-transform: uppercase;" id="name">{{ name }}</h1> {% if digital == 'True' %} <h5 color="black">Digital Inventory</h5> {% endif %} </center> +{% endblock headermsg %} + +{% block content %} + +<div class="main"> + <h5 color="black">The code for the pay now button is:</h5> <xmp style="font-size: 50% "> @@ -245,6 +77,4 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. <button name="update_stock" type="submit" class="submit">Update</button> </form> </div> - -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file diff --git a/templates/inventory/signup.html b/templates/inventory/signup.html index d39cec9..6e4744e 100644 --- a/templates/inventory/signup.html +++ b/templates/inventory/signup.html @@ -1,4 +1,4 @@ -<!DOCTYPE html> + <!-- This file is part of the Taler Codeless Merchant. (C) 2018 GNUnet e.V. @@ -18,182 +18,20 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. @author Shivam Kohli --> -<html> -<head> - <title>Sign Up</title> - <style type="text/css"> - *, - *::before, - *::after { - box-sizing: border-box; - } - html { - background-color: #f0f0f0; - } - body { - color: #999999; - font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-style: normal; - font-weight: 400; - letter-spacing: 0; - padding: 1rem; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -moz-font-feature-settings: "liga" on; - } - .sidenav { - height: 100%; - width: 160px; - position: fixed; - z-index: 1; - top: 0; - left: 0; - background-color: #111; - overflow-x: hidden; - padding-top: 20px; - } - - .sidenav a { - padding: 6px 8px 6px 16px; - text-decoration: none; - font-size: 25px; - color: #818181; - display: block; - } - - .sidenav a:hover { - color: #f1f1f1; - } - .main { - margin-left: 160px; - font-size: 28px; - padding: 0px 10px; - } - @media screen and (max-height: 450px) { - .sidenav {padding-top: 15px;} - .sidenav a {font-size: 18px;} - } - #contact {width:100%; height:100%; margin 0 auto; background: #DDD; } - - .container {width:960px; height:auto; margin: 0 auto; padding: 50px 0;} - - #contact .container form input, - #contact .container form textarea { - width:97.4%; - height:30px; - padding:5px 10px; - font-size: 12px; - color:#999; - letter-spacing:1px; - background: #FFF; - border:2px solid #FFF; - margin-bottom:25px; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form input:focus, - #contact .container form textarea:focus { - border:2px solid #dd4545; - color:#999;} - - #contact .container form textarea { - height:150px;} - - #contact .container form .submit { - width:100%; - padding:5px 10px; - font-size: 12px; - letter-spacing:1px; - background:#dd4545; - height:40px; - text-transform:uppercase; - letter-spacing:1px; - color:#FFF; - border:2px solid #b43838; - -webkit-transition:all .1s ease-in-out; - -moz-transition:all .1s ease-in-out; - -ms-transition:all .1s ease-in-out; - -o-transition:all .1s ease-in-out; - transition:all .1s ease-in-out;} - - #contact .container form .submit:hover { - color:#FFF; - border:2px solid #dd4545; - background: #b43838; - cursor:pointer;} +{% extends "inventory/base1.html" %} - #contact .container form .required { - color:#b43838;} - - ul { - color:red; - font-size:20px; - list-style-type: none; - margin: 0; - padding: 0;} - </style> - <style> - .tooltip { - position: relative; - display: inline-block; - } - - .tooltip .tooltiptext { - visibility: hidden; - width: 300px; - background-color: #555; - color: #fff; - text-align: center; - border-radius: 6px; - padding: 5px 0; - position: absolute; - z-index: 1; - bottom: 125%; - left: 50%; - margin-left: -60px; - opacity: 0; - transition: opacity 0.3s; - } - - .tooltip .tooltiptext::after { - content: ""; - position: absolute; - top: 100%; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: #555 transparent transparent transparent; - } - - .tooltip:hover .tooltiptext { - visibility: visible; - opacity: 1; - } - </style> -</head> -<body> -<div class="sidenav"> - <a href="/accounts/login">LOGIN</a> - <a href="/signup">REGISTER</a></li> - <a href="/password_reset">FORGET PASSWORD</a></li> -</div> +{% block headermsg %} + <center><h1 class="nav">Register</h1></center> +{% endblock headermsg %} +{% block content %} <div class="main"> - <center> - <h1>SIGNUP</h1> - </center> <section id="contact"> <div class="container"> <form method="post" enctype="multipart/form-data"> <form method="post" enctype="multipart/form-data"> {% csrf_token %} <!-- {{ form.as_p }} --> - {% for field in form %} {% if field.label == 'Directly enter the Plain PaytoURI' %} <br><br><label class="tooltip">{{ field.label }}<font size="1"><span class="tooltiptext">This field is not necessary, if you have choosen the address type.</span></font></label> @@ -203,13 +41,10 @@ with the Taler Codeless Merchant. If not, see <https://www.gnu.org/licenses/>. {{ field }} {% endif %} {% endfor %} - - <button name="add_product" type="submit" class="submit">Sign up</button> </form> </div> </section> </div> </div> -</body> -</html>
\ No newline at end of file +{% endblock content %}
\ No newline at end of file |