diff --git a/web/account.py b/web/account.py new file mode 100644 index 0000000..8245a58 --- /dev/null +++ b/web/account.py @@ -0,0 +1,99 @@ +import os +import flask +import requests + +from dotenv import load_dotenv +from requests_oauthlib import OAuth2Session + +load_dotenv() + +os.environ['OAUTHLIB_INSECURE_TRANSPORT'] = '0' # change this to '1' if you're running this on localhost! + +API_URL = 'https://discordapp.com/api' +CLIENT_ID = str(os.environ['DISCORD_CLIENT_ID']) +CLIENT_SECRET = os.environ['DISCORD_CLIENT_SECRET'] +# REDIRECT_URI = 'https://nova-oss.com/callback/discord' +REDIRECT_URI = 'http://localhost:2211/callback/discord' +SCOPES = ['identify'] + +def get_user(discord_id: int) -> dict: + return requests.get( + url=f'http://localhost:2333/users?discord_id={discord_id}', + timeout=3, + headers={ + 'Content-Type': 'application/json', + 'Authorization': os.getenv('CORE_API_KEY') + } + ).json() + +def register(app): + @app.route('/logout') + def logout(): + flask.session = {} + return flask.redirect('/') + + @app.route('/account') + def account_view(): + discord_id = flask.session.get('discord_id') + + if not discord_id: + return flask.redirect('/login') + + discord_account = OAuth2Session(CLIENT_ID, token=flask.session['discord_token']) + profile = discord_account.get(f'{API_URL}/users/@me').json() + + db_user = get_user(discord_id) + + user = { + 'name': profile['username'], + 'avatar': profile['avatar'], + 'role': db_user['role'], + 'credits': db_user['credits'], + 'api_key': db_user['api_key'] + } + + return flask.render_template('account.html', user=user) + + @app.route('/login') + def login_view(): + return flask.render_template('login.html') + + @app.route('/auth/discord', methods=['POST', 'GET']) + def auth_view(): + """Redirect to Discord's OAuth2 authorization page.""" + + oauth = OAuth2Session(CLIENT_ID, redirect_uri=REDIRECT_URI, scope=SCOPES) + login_url, state = oauth.authorization_url(f'{API_URL}/oauth2/authorize') + flask.session['state'] = state + + return flask.redirect(login_url) + + @app.route('/callback/discord') + def callback(): + """Handle the OAuth2 callback and log the user in.""" + if flask.request.args.get('code'): # OAUTH CALLBACK/REDIRECT + discord_account = OAuth2Session(CLIENT_ID, redirect_uri=REDIRECT_URI, state=flask.session.get('state'), scope=SCOPES) + token = discord_account.fetch_token( + f'{API_URL}/oauth2/token', + client_secret=CLIENT_SECRET, + authorization_response=flask.request.url, + ) + flask.session['discord_token'] = token + + print('Token:', token) + + return flask.redirect('/account') + + if flask.session.get('discord_token'): # ALREADY LOGGED IN + print('Already logged in.') + discord_account = OAuth2Session(CLIENT_ID, token=flask.session['discord_token']) + + try: + profile = discord_account.get(f'{API_URL}/users/@me').json() + except Exception as e: + return f'Your token has expired. Please try logging in again.' + + flask.session.permanent = True + flask.session['discord_id'] = profile['id'] + + return flask.redirect('/') # DONE diff --git a/web/app.py b/web/app.py index 786c553..797c67a 100644 --- a/web/app.py +++ b/web/app.py @@ -1,7 +1,5 @@ import os -import json import flask -import random import secrets import logging @@ -16,9 +14,18 @@ log.disabled = True def create_app() -> flask.Flask: app = flask.Flask(__name__) app.wsgi_app = ProxyFix(app.wsgi_app, x_for=1, x_proto=1, x_host=1, x_prefix=1) + app.secret_key = secrets.token_hex(16) + app.jinja_env.trim_blocks = True + app.jinja_env.lstrip_blocks = True import tos + import account + tos.register(app) + account.register(app) + + # max 100 MB + app.config['MAX_CONTENT_LENGTH'] = 100 * 1024 * 1024 @app.context_processor def inject_variables(): @@ -30,9 +37,9 @@ def create_app() -> flask.Flask: def index(): return flask.render_template('index.html') - @app.route('/go') + @app.route('/get-started') def go(): - return flask.render_template('panel.html') + return flask.render_template('get-started.html') @app.route('/novacord') def novacord_page(): diff --git a/web/static/css/_vars.sass b/web/static/css/_vars.sass index 688e691..d821551 100644 --- a/web/static/css/_vars.sass +++ b/web/static/css/_vars.sass @@ -3,6 +3,7 @@ $background: #03060d $secondary: #252a38 $secondary-dark: #0e0e0e $border: #161d2bb0 +$soft: #fcf7f824 $primary: #b53d61 $primary-light: #f45a88 diff --git a/web/static/css/base.css.map b/web/static/css/base.css.map index 6e1df9a..f62a07c 100644 --- a/web/static/css/base.css.map +++ b/web/static/css/base.css.map @@ -1 +1 @@ -{"version":3,"sources":["base.sass","base.css","_vars.sass"],"names":[],"mappings":"AAEA;EACI,uBAAA;ACDJ;;ADGA;EACI,yBELS;ADKb;;ADEA;EACI,gBESS;EFRT,cAAA;ACCJ;;ADCA;EACI,sBAAA;EACA,YAAA;EACA,cEfG;EFgBH,gCAAA;ACEJ;;ADAA;EACI,qBAAA;ACGJ;;ADAI;EACI,gBAAA;EACA,iBAAA;EACA,+BAAA;ACGR;;ADAI;EACI,mBAAA;ACGR;;ADAI;EACI,mBAAA;ACGR;;ADDA;EACI,0BAAA;EACA,8BE/BM;EFgCN,0BAAA;EACA,8BAAA;EAEA,gBAAA;ACGJ;ADDI;EACI,4BAAA;EACA,4CErCO;ADwCf;;ADDA;EACI,YAAA;ACIJ;;ADFA;EACI,cAAA;EACA,eAAA;ACKJ;;ADHA;EACI,cEvDG;EFwDH,mBElDM;EFmDN,gBAAA;EACA,kBAAA;ACMJ;;ADJA;EACI,8CAAA;EACA,gBAAA;EACA,mBE7DQ;EF8DR,kBEhDG;EFiDH,sBAAA;EACA,gCAAA;ACOJ;;ADLA;EACI,cAAA;EACA,kBAAA;EACA,8BAAA;EACA,YAAA;EACA,mBEvEQ;EFwER,WAAA;EACA,kBE3DG;ADmEP;ADNI;EACI,0BElEA;AD0ER;ADPI;EACI,0BEnED;AD4EP;ADRI;EACI,0BEpEE;AD8EV;;ADRA;EACI,8CAAA;EACA,gBAAA;EACA,mBErFQ;EFsFR,kBExEG;EFyEH,sBAAA;ACWJ;;ADRI;EACI,mBAAA;ACWR;;ADTA;EACI,iBAAA;ACYJ;;ADVA;EACI,YAAA;EACA,mBAAA;ACaJ;;ADXA;EAEI,aAAA;ACaJ;;ADXA;EACI,gFAAA;EACA,6BAAA;EACA,oCAAA;ACcJ;;ADZA;EACI;IACI,cAAA;IACA,gBAAA;ECeN;AACF","file":"base.css","sourcesContent":["@import '_vars'\n\nhtml\n scroll-behavior: smooth\n\nbody\n background-color: $background\n\nnav, main, footer\n max-width: $main-width\n margin: 0 auto\n\n*, *::before, *::after\n box-sizing: border-box\n border: none\n color: $text\n font-family: 'Inter', sans-serif\n\na\n text-decoration: none\n\nh1, h2, h3\n &, *\n font-weight: 700\n line-height: 3rem\n font-family: 'Syne', sans-serif\n\nh2\n &, *\n line-height: 2.2rem\n\nh3\n &, *\n line-height: 1.5rem\n\nmain a\n text-decoration: underline\n text-decoration-color: $primary\n text-underline-offset: 2px\n text-decoration-thickness: 5px\n\n transition: 0.2s\n\n &:hover\n text-decoration-thickness: 0\n background: $primary-glow\n\nmain p\n opacity: 0.9\n\nimg\n display: block\n max-width: 100%\n\nmark\n color: $text\n background: $primary\n padding: 5px 7px\n border-radius: 5px\n\nkbd\n font-family: 'Courier New', Courier, monospace\n font-weight: 600\n background: $secondary\n border-radius: $edge\n padding: 0.2rem 0.4rem\n border-bottom: 3px solid $secondary-dark\n\nblockquote\n margin-left: 0\n padding: 1rem 1rem\n border-left: 5px solid $accent\n opacity: 0.8\n background: $secondary\n width: 100%\n border-radius: $edge\n\n &.error\n border-left-color: $error\n &.warning\n border-left-color: $warn\n &.success\n border-left-color: $success\n\ncode\n font-family: 'Courier New', Courier, monospace\n font-weight: 600\n background: $secondary\n border-radius: $edge\n padding: 0.2rem 0.4rem\n\npre code\n *, &\n font-weight: normal\n\np, p *, ol, ul, li\n line-height: 32px\n\nh6\n opacity: 0.7\n font-weight: normal\n\n:focus:not(:focus-visible)\n\n outline: none\n\n.special-gradient\n background: linear-gradient(83deg, rgba(244,90,136,1) 7%, rgba(40,170,240,1) 100%)\n -webkit-background-clip: text\n -webkit-text-fill-color: transparent\n\n@media (max-width: 900px)\n body\n margin: 0 2rem\n margin-top: 2rem\n","html {\n scroll-behavior: smooth;\n}\n\nbody {\n background-color: #03060d;\n}\n\nnav, main, footer {\n max-width: 800px;\n margin: 0 auto;\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n border: none;\n color: #f3f3f3;\n font-family: \"Inter\", sans-serif;\n}\n\na {\n text-decoration: none;\n}\n\nh1, h1 *, h2, h2 *, h3, h3 * {\n font-weight: 700;\n line-height: 3rem;\n font-family: \"Syne\", sans-serif;\n}\n\nh2, h2 * {\n line-height: 2.2rem;\n}\n\nh3, h3 * {\n line-height: 1.5rem;\n}\n\nmain a {\n text-decoration: underline;\n text-decoration-color: #b53d61;\n text-underline-offset: 2px;\n text-decoration-thickness: 5px;\n transition: 0.2s;\n}\nmain a:hover {\n text-decoration-thickness: 0;\n background: rgba(244, 90, 136, 0.3803921569);\n}\n\nmain p {\n opacity: 0.9;\n}\n\nimg {\n display: block;\n max-width: 100%;\n}\n\nmark {\n color: #f3f3f3;\n background: #b53d61;\n padding: 5px 7px;\n border-radius: 5px;\n}\n\nkbd {\n font-family: \"Courier New\", Courier, monospace;\n font-weight: 600;\n background: #252a38;\n border-radius: 5px;\n padding: 0.2rem 0.4rem;\n border-bottom: 3px solid #0e0e0e;\n}\n\nblockquote {\n margin-left: 0;\n padding: 1rem 1rem;\n border-left: 5px solid #28aaf0;\n opacity: 0.8;\n background: #252a38;\n width: 100%;\n border-radius: 5px;\n}\nblockquote.error {\n border-left-color: #ef3628;\n}\nblockquote.warning {\n border-left-color: #f09928;\n}\nblockquote.success {\n border-left-color: #28ef6b;\n}\n\ncode {\n font-family: \"Courier New\", Courier, monospace;\n font-weight: 600;\n background: #252a38;\n border-radius: 5px;\n padding: 0.2rem 0.4rem;\n}\n\npre code *, pre code {\n font-weight: normal;\n}\n\np, p *, ol, ul, li {\n line-height: 32px;\n}\n\nh6 {\n opacity: 0.7;\n font-weight: normal;\n}\n\n:focus:not(:focus-visible) {\n outline: none;\n}\n\n.special-gradient {\n background: linear-gradient(83deg, rgb(244, 90, 136) 7%, rgb(40, 170, 240) 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n@media (max-width: 900px) {\n body {\n margin: 0 2rem;\n margin-top: 2rem;\n }\n}","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file +{"version":3,"sources":["base.sass","base.css","_vars.sass"],"names":[],"mappings":"AAEA;EACI,uBAAA;ACDJ;;ADGA;EACI,yBELS;ADKb;;ADEA;EACI,gBEUS;EFTT,cAAA;ACCJ;;ADCA;EACI,sBAAA;EACA,YAAA;EACA,cEfG;EFgBH,gCAAA;ACEJ;;ADAA;EACI,qBAAA;ACGJ;;ADAI;EACI,gBAAA;EACA,iBAAA;EACA,+BAAA;ACGR;;ADAI;EACI,mBAAA;ACGR;;ADAI;EACI,mBAAA;ACGR;;ADDA;EACI,0BAAA;EACA,8BE9BM;EF+BN,0BAAA;EACA,8BAAA;EAEA,gBAAA;ACGJ;ADDI;EACI,4BAAA;EACA,4CEpCO;ADuCf;;ADDA;EACI,YAAA;ACIJ;;ADFA;EACI,cAAA;EACA,eAAA;ACKJ;;ADHA;EACI,cEvDG;EFwDH,mBEjDM;EFkDN,gBAAA;EACA,kBAAA;ACMJ;;ADJA;EACI,8CAAA;EACA,gBAAA;EACA,mBE7DQ;EF8DR,kBE/CG;EFgDH,sBAAA;EACA,gCAAA;ACOJ;;ADLA;EACI,cAAA;EACA,kBAAA;EACA,8BAAA;EACA,YAAA;EACA,mBEvEQ;EFwER,WAAA;EACA,kBE1DG;ADkEP;ADNI;EACI,0BEjEA;ADyER;ADPI;EACI,0BElED;AD2EP;ADRI;EACI,0BEnEE;AD6EV;;ADRA;EACI,8CAAA;EACA,gBAAA;EACA,mBErFQ;EFsFR,kBEvEG;EFwEH,sBAAA;ACWJ;;ADRI;EACI,mBAAA;ACWR;;ADTA;EACI,iBAAA;ACYJ;;ADVA;EACI,YAAA;EACA,mBAAA;ACaJ;;ADXA;EAEI,aAAA;ACaJ;;ADXA;EACI,gFAAA;EACA,6BAAA;EACA,oCAAA;ACcJ;;ADZA;EACI;IACI,cAAA;IACA,gBAAA;ECeN;AACF","file":"base.css","sourcesContent":["@import '_vars'\n\nhtml\n scroll-behavior: smooth\n\nbody\n background-color: $background\n\nnav, main, footer\n max-width: $main-width\n margin: 0 auto\n\n*, *::before, *::after\n box-sizing: border-box\n border: none\n color: $text\n font-family: 'Inter', sans-serif\n\na\n text-decoration: none\n\nh1, h2, h3\n &, *\n font-weight: 700\n line-height: 3rem\n font-family: 'Syne', sans-serif\n\nh2\n &, *\n line-height: 2.2rem\n\nh3\n &, *\n line-height: 1.5rem\n\nmain a\n text-decoration: underline\n text-decoration-color: $primary\n text-underline-offset: 2px\n text-decoration-thickness: 5px\n\n transition: 0.2s\n\n &:hover\n text-decoration-thickness: 0\n background: $primary-glow\n\nmain p\n opacity: 0.9\n\nimg\n display: block\n max-width: 100%\n\nmark\n color: $text\n background: $primary\n padding: 5px 7px\n border-radius: 5px\n\nkbd\n font-family: 'Courier New', Courier, monospace\n font-weight: 600\n background: $secondary\n border-radius: $edge\n padding: 0.2rem 0.4rem\n border-bottom: 3px solid $secondary-dark\n\nblockquote\n margin-left: 0\n padding: 1rem 1rem\n border-left: 5px solid $accent\n opacity: 0.8\n background: $secondary\n width: 100%\n border-radius: $edge\n\n &.error\n border-left-color: $error\n &.warning\n border-left-color: $warn\n &.success\n border-left-color: $success\n\ncode\n font-family: 'Courier New', Courier, monospace\n font-weight: 600\n background: $secondary\n border-radius: $edge\n padding: 0.2rem 0.4rem\n\npre code\n *, &\n font-weight: normal\n\np, p *, ol, ul, li\n line-height: 32px\n\nh6\n opacity: 0.7\n font-weight: normal\n\n:focus:not(:focus-visible)\n\n outline: none\n\n.special-gradient\n background: linear-gradient(83deg, rgba(244,90,136,1) 7%, rgba(40,170,240,1) 100%)\n -webkit-background-clip: text\n -webkit-text-fill-color: transparent\n\n@media (max-width: 900px)\n body\n margin: 0 2rem\n margin-top: 2rem\n","html {\n scroll-behavior: smooth;\n}\n\nbody {\n background-color: #03060d;\n}\n\nnav, main, footer {\n max-width: 800px;\n margin: 0 auto;\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n border: none;\n color: #f3f3f3;\n font-family: \"Inter\", sans-serif;\n}\n\na {\n text-decoration: none;\n}\n\nh1, h1 *, h2, h2 *, h3, h3 * {\n font-weight: 700;\n line-height: 3rem;\n font-family: \"Syne\", sans-serif;\n}\n\nh2, h2 * {\n line-height: 2.2rem;\n}\n\nh3, h3 * {\n line-height: 1.5rem;\n}\n\nmain a {\n text-decoration: underline;\n text-decoration-color: #b53d61;\n text-underline-offset: 2px;\n text-decoration-thickness: 5px;\n transition: 0.2s;\n}\nmain a:hover {\n text-decoration-thickness: 0;\n background: rgba(244, 90, 136, 0.3803921569);\n}\n\nmain p {\n opacity: 0.9;\n}\n\nimg {\n display: block;\n max-width: 100%;\n}\n\nmark {\n color: #f3f3f3;\n background: #b53d61;\n padding: 5px 7px;\n border-radius: 5px;\n}\n\nkbd {\n font-family: \"Courier New\", Courier, monospace;\n font-weight: 600;\n background: #252a38;\n border-radius: 5px;\n padding: 0.2rem 0.4rem;\n border-bottom: 3px solid #0e0e0e;\n}\n\nblockquote {\n margin-left: 0;\n padding: 1rem 1rem;\n border-left: 5px solid #28aaf0;\n opacity: 0.8;\n background: #252a38;\n width: 100%;\n border-radius: 5px;\n}\nblockquote.error {\n border-left-color: #ef3628;\n}\nblockquote.warning {\n border-left-color: #f09928;\n}\nblockquote.success {\n border-left-color: #28ef6b;\n}\n\ncode {\n font-family: \"Courier New\", Courier, monospace;\n font-weight: 600;\n background: #252a38;\n border-radius: 5px;\n padding: 0.2rem 0.4rem;\n}\n\npre code *, pre code {\n font-weight: normal;\n}\n\np, p *, ol, ul, li {\n line-height: 32px;\n}\n\nh6 {\n opacity: 0.7;\n font-weight: normal;\n}\n\n:focus:not(:focus-visible) {\n outline: none;\n}\n\n.special-gradient {\n background: linear-gradient(83deg, rgb(244, 90, 136) 7%, rgb(40, 170, 240) 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n@media (max-width: 900px) {\n body {\n margin: 0 2rem;\n margin-top: 2rem;\n }\n}","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n$soft: #fcf7f824\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file diff --git a/web/static/css/footer.css.map b/web/static/css/footer.css.map index 69c2f1b..d0969fa 100644 --- a/web/static/css/footer.css.map +++ b/web/static/css/footer.css.map @@ -1 +1 @@ -{"version":3,"sources":["footer.sass","_vars.sass","footer.css"],"names":[],"mappings":"AAEA;EACI,iBAAA;EACA,iBAAA;EACA,gBCaS;ACdb;AFGI;EACI,iBCWK;ACZb;AFGI;EACI,aAAA;EACA,sBAAA;EAEA,mBAAA;AEFR;AFIQ;EACI,oBAAA;EACA,qBAAA;AEFZ;AFIY;EACI,eAAA;EACA,gBAAA;AEFhB;AFIY;EACI,UAAA;EACA,eAAA;EACA,gBAAA;EACA,cAAA;EACA,mBAAA;AEFhB;AFIY;EACI,uBAAA;EAAA,kBAAA;EACA,eAAA;EACA,YAAA;EACA,cAAA;EACA,qBAAA;EACA,mBAAA;AEFhB;AFIgB;EACI,YAAA;AEFpB;AFII;EACI,YAAA;AEFR;;AFIA;EAEQ;IACI,mBAAA;IACA,qCAAA;EEFV;EFIU;IACI,mBAAA;EEFd;AACF;AFGA;EAEQ;IACI,0BAAA;EEFV;AACF","file":"footer.css","sourcesContent":["@import '_vars'\n\nfooter\n padding-top: 4rem\n margin: 4rem auto\n max-width: $main-width\n\n &.wide\n max-width: $more-width\n\n div.rows\n display: grid\n grid-auto-flow: column\n // justify-content: space-between\n margin-bottom: 2rem\n\n div.row\n margin-right: 1.5rem\n margin-bottom: 0.5rem\n\n &:last-child\n margin-right: 0\n margin-bottom: 0\n\n h2\n opacity: 1\n font-size: 1rem\n font-weight: 500\n margin: 1rem 0\n line-height: normal\n\n a\n width: fit-content\n font-size: 14px\n opacity: 0.6\n display: block\n text-decoration: none\n margin-bottom: 1rem\n\n &:hover\n opacity: 0.8\n\n p\n opacity: 0.7\n\n@media (max-width: 1000px)\n footer\n div.rows\n grid-auto-flow: row\n grid-template-columns: repeat(2, 1fr)\n\n div.row\n margin-bottom: 1rem\n\n@media (max-width: 600px)\n footer\n div.rows\n grid-template-columns: 1fr\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n","footer {\n padding-top: 4rem;\n margin: 4rem auto;\n max-width: 800px;\n}\nfooter.wide {\n max-width: 1000px;\n}\nfooter div.rows {\n display: grid;\n grid-auto-flow: column;\n margin-bottom: 2rem;\n}\nfooter div.rows div.row {\n margin-right: 1.5rem;\n margin-bottom: 0.5rem;\n}\nfooter div.rows div.row:last-child {\n margin-right: 0;\n margin-bottom: 0;\n}\nfooter div.rows div.row h2 {\n opacity: 1;\n font-size: 1rem;\n font-weight: 500;\n margin: 1rem 0;\n line-height: normal;\n}\nfooter div.rows div.row a {\n width: fit-content;\n font-size: 14px;\n opacity: 0.6;\n display: block;\n text-decoration: none;\n margin-bottom: 1rem;\n}\nfooter div.rows div.row a:hover {\n opacity: 0.8;\n}\nfooter p {\n opacity: 0.7;\n}\n\n@media (max-width: 1000px) {\n footer div.rows {\n grid-auto-flow: row;\n grid-template-columns: repeat(2, 1fr);\n }\n footer div.rows div.row {\n margin-bottom: 1rem;\n }\n}\n@media (max-width: 600px) {\n footer div.rows {\n grid-template-columns: 1fr;\n }\n}"]} \ No newline at end of file +{"version":3,"sources":["footer.sass","_vars.sass","footer.css"],"names":[],"mappings":"AAEA;EACI,iBAAA;EACA,iBAAA;EACA,gBCcS;ACfb;AFGI;EACI,iBCYK;ACbb;AFGI;EACI,aAAA;EACA,sBAAA;EAEA,mBAAA;AEFR;AFIQ;EACI,oBAAA;EACA,qBAAA;AEFZ;AFIY;EACI,eAAA;EACA,gBAAA;AEFhB;AFIY;EACI,UAAA;EACA,eAAA;EACA,gBAAA;EACA,cAAA;EACA,mBAAA;AEFhB;AFIY;EACI,uBAAA;EAAA,kBAAA;EACA,eAAA;EACA,YAAA;EACA,cAAA;EACA,qBAAA;EACA,mBAAA;AEFhB;AFIgB;EACI,YAAA;AEFpB;AFII;EACI,YAAA;AEFR;;AFIA;EAEQ;IACI,mBAAA;IACA,qCAAA;EEFV;EFIU;IACI,mBAAA;EEFd;AACF;AFGA;EAEQ;IACI,0BAAA;EEFV;AACF","file":"footer.css","sourcesContent":["@import '_vars'\n\nfooter\n padding-top: 4rem\n margin: 4rem auto\n max-width: $main-width\n\n &.wide\n max-width: $more-width\n\n div.rows\n display: grid\n grid-auto-flow: column\n // justify-content: space-between\n margin-bottom: 2rem\n\n div.row\n margin-right: 1.5rem\n margin-bottom: 0.5rem\n\n &:last-child\n margin-right: 0\n margin-bottom: 0\n\n h2\n opacity: 1\n font-size: 1rem\n font-weight: 500\n margin: 1rem 0\n line-height: normal\n\n a\n width: fit-content\n font-size: 14px\n opacity: 0.6\n display: block\n text-decoration: none\n margin-bottom: 1rem\n\n &:hover\n opacity: 0.8\n\n p\n opacity: 0.7\n\n@media (max-width: 1000px)\n footer\n div.rows\n grid-auto-flow: row\n grid-template-columns: repeat(2, 1fr)\n\n div.row\n margin-bottom: 1rem\n\n@media (max-width: 600px)\n footer\n div.rows\n grid-template-columns: 1fr\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n$soft: #fcf7f824\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n","footer {\n padding-top: 4rem;\n margin: 4rem auto;\n max-width: 800px;\n}\nfooter.wide {\n max-width: 1000px;\n}\nfooter div.rows {\n display: grid;\n grid-auto-flow: column;\n margin-bottom: 2rem;\n}\nfooter div.rows div.row {\n margin-right: 1.5rem;\n margin-bottom: 0.5rem;\n}\nfooter div.rows div.row:last-child {\n margin-right: 0;\n margin-bottom: 0;\n}\nfooter div.rows div.row h2 {\n opacity: 1;\n font-size: 1rem;\n font-weight: 500;\n margin: 1rem 0;\n line-height: normal;\n}\nfooter div.rows div.row a {\n width: fit-content;\n font-size: 14px;\n opacity: 0.6;\n display: block;\n text-decoration: none;\n margin-bottom: 1rem;\n}\nfooter div.rows div.row a:hover {\n opacity: 0.8;\n}\nfooter p {\n opacity: 0.7;\n}\n\n@media (max-width: 1000px) {\n footer div.rows {\n grid-auto-flow: row;\n grid-template-columns: repeat(2, 1fr);\n }\n footer div.rows div.row {\n margin-bottom: 1rem;\n }\n}\n@media (max-width: 600px) {\n footer div.rows {\n grid-template-columns: 1fr;\n }\n}"]} \ No newline at end of file diff --git a/web/static/css/home.css.map b/web/static/css/home.css.map index e1d53a0..2ae1ae7 100644 --- a/web/static/css/home.css.map +++ b/web/static/css/home.css.map @@ -1 +1 @@ -{"version":3,"sources":["home.css","home.sass","_vars.sass"],"names":[],"mappings":"AAAA,gBAAgB;ACEhB;EACI,gBCeS;EDdT,cAAA;EACA,eAAA;EACA,oBAAA;ADAJ;ACEI;EACI,iBAAA;ADAR;;ACEA;EACI,6CCHW;EDIX,kDAAA;EACA,kBCEG;EDDH,aAAA;EACA,kBAAA;EACA,aAAA;EACA,sBAAA;EACA,qBAAA;ADCJ;ACCI;EACI,YAAA;EACA,qCAAA;EACA,qDAAA;ADCR;ACCI;EACI,YAAA;EACA,oBAAA;KAAA,iBAAA;ADCR;ACCI;EACI,sBAAA;EACA,kBAAA;EACA,iBAAA;EACA,iBAAA;ADCR;ACCQ;EACI,cC9BI;AF+BhB;;ACMI;EACI,kBAAA;EACA,oBAAA;EACA,mBAAA;EACA,6CCvCO;EDwCP,kDAAA;EACA,kBClCD;EDmCC,kBAAA;EACA,qBAAA;EACA,gCAAA;EACA,iBAAA;ADHR;ACKQ;EACI,YAAA;EACA,qCAAA;EACA,qDAAA;ADHZ;ACKQ;EACI,4CAAA;EACA,YAAA;EACA,gBAAA;EACA,wCCxDG;EDyDH,kBAAA;EACA,aAAA;EACA,UAAA;EAGA,yBAAA;ADLZ;ACOQ;EACI,eAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,kDAAA;EACA,kBAAA;EACA,SAAA;EACA,WAAA;EACA,yBAAA;KAAA,sBAAA;ADLZ;ACOQ;EACI,eAAA;EACA,gBAAA;EACA,cCjFF;AF4EV;ACOQ;EACI,eAAA;EACA,iBAAA;EACA,mBAAA;ADLZ;;ACOA;EACI;IACI,eAAA;EDJN;ECMM;IACI,iBAAA;EDJV;ECMM;IACI,eAAA;EDJV;AACF","file":"home.css","sourcesContent":["@charset \"UTF-8\";\nheader {\n max-width: 800px;\n margin: 0 auto;\n font-size: 40px;\n margin-bottom: 15rem;\n}\nheader h1 {\n line-height: 4rem;\n}\n\ndiv.featured-box {\n background: rgba(247, 154, 182, 0.1411764706);\n border: 2px solid rgba(244, 90, 136, 0.3803921569);\n border-radius: 5px;\n padding: 2rem;\n margin-block: 2rem;\n display: flex;\n vertical-align: middle;\n transition: all 200ms;\n}\ndiv.featured-box:hover {\n scale: 1.025;\n filter: brightness(1.1) saturate(1.1);\n box-shadow: 0 0 30px rgba(244, 90, 136, 0.3803921569);\n}\ndiv.featured-box img {\n height: 50px;\n object-fit: cover;\n}\ndiv.featured-box h2 {\n vertical-align: middle;\n margin-block: auto;\n margin-left: 1rem;\n font-size: 1.5rem;\n}\ndiv.featured-box h2 span {\n color: #f45a88;\n}\n\ndiv.user-quotes div.user-quote__field {\n margin-block: 2rem;\n padding-inline: 2rem;\n padding-block: 2rem;\n background: rgba(247, 154, 182, 0.1411764706);\n border: 2px solid rgba(244, 90, 136, 0.3803921569);\n border-radius: 5px;\n position: relative;\n transition: all 200ms;\n box-shadow: 0 0 30px transparent;\n min-height: 200px;\n}\ndiv.user-quotes div.user-quote__field:hover {\n scale: 1.025;\n filter: brightness(1.1) saturate(1.1);\n box-shadow: 0 0 30px rgba(244, 90, 136, 0.3803921569);\n}\ndiv.user-quotes div.user-quote__field::before {\n font-family: \"Times New Roman\", Times, serif;\n content: \"“\";\n font-size: 150px;\n color: rgba(247, 154, 182, 0.1411764706);\n position: absolute;\n bottom: -1rem;\n left: 1rem;\n transform: rotate(180deg);\n}\ndiv.user-quotes div.user-quote__field img {\n cursor: pointer;\n width: 100px;\n height: 100px;\n border-radius: 50%;\n border: 3px solid rgba(244, 90, 136, 0.3803921569);\n position: absolute;\n top: 1rem;\n right: 1rem;\n object-fit: scale-down;\n}\ndiv.user-quotes div.user-quote__field span.user-quote__username {\n font-size: 1rem;\n font-weight: 600;\n color: #b53d61;\n}\ndiv.user-quotes div.user-quote__field p {\n margin-block: 0;\n font-size: 1.5rem;\n padding-right: 7rem;\n}\n\n@media (max-width: 800px) {\n header {\n font-size: 26px;\n }\n header h1 {\n line-height: 3rem;\n }\n header h3 {\n font-size: 28px;\n }\n}","@import '_vars'\n\nheader\n max-width: $main-width\n margin: 0 auto\n font-size: 40px\n margin-bottom: 15rem\n\n h1\n line-height: 4rem\n\ndiv.featured-box\n background: $primary-soft\n border: 2px solid $primary-glow\n border-radius: $edge\n padding: 2rem\n margin-block: 2rem\n display: flex\n vertical-align: middle\n transition: all 200ms\n\n &:hover\n scale: 1.025\n filter: brightness(1.1) saturate(1.1)\n box-shadow: 0 0 30px $primary-glow\n\n img\n height: 50px\n object-fit: cover\n\n h2\n vertical-align: middle\n margin-block: auto\n margin-left: 1rem\n font-size: 1.5rem\n\n span\n color: $primary-light\n\ndiv.user-quotes\n // display: grid\n // grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))\n // grid-gap: 2rem\n\n div.user-quote__field\n margin-block: 2rem\n padding-inline: 2rem\n padding-block: 2rem\n background: $primary-soft\n border: 2px solid $primary-glow\n border-radius: $edge\n position: relative\n transition: all 200ms\n box-shadow: 0 0 30px transparent\n min-height: 200px\n\n &:hover\n scale: 1.025\n filter: brightness(1.1) saturate(1.1)\n box-shadow: 0 0 30px $primary-glow\n\n &::before\n font-family: 'Times New Roman', Times, serif\n content: '\\201c'\n font-size: 150px\n color: $primary-soft\n position: absolute\n bottom: -1rem\n left: 1rem\n \n // show at the bottom left\n transform: rotate(180deg)\n\n img\n cursor: pointer\n width: 100px\n height: 100px\n border-radius: 50%\n border: 3px solid $primary-glow\n position: absolute\n top: 1rem\n right: 1rem\n object-fit: scale-down\n\n span.user-quote__username\n font-size: 1rem\n font-weight: 600\n color: $primary\n\n p\n margin-block: 0\n font-size: 1.5rem\n padding-right: 7rem\n\n@media (max-width: 800px)\n header\n font-size: 26px\n \n h1\n line-height: 3rem\n\n h3\n font-size: 28px\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file +{"version":3,"sources":["home.css","home.sass","_vars.sass"],"names":[],"mappings":"AAAA,gBAAgB;ACEhB;EACI,gBCgBS;EDfT,cAAA;EACA,eAAA;EACA,oBAAA;ADAJ;ACEI;EACI,iBAAA;ADAR;;ACEA;EACI,6CCFW;EDGX,kDAAA;EACA,kBCGG;EDFH,aAAA;EACA,kBAAA;EACA,aAAA;EACA,sBAAA;EACA,qBAAA;ADCJ;ACCI;EACI,YAAA;EACA,qCAAA;EACA,qDAAA;ADCR;ACCI;EACI,YAAA;EACA,oBAAA;KAAA,iBAAA;ADCR;ACCI;EACI,sBAAA;EACA,kBAAA;EACA,iBAAA;EACA,iBAAA;ADCR;ACCQ;EACI,cC7BI;AF8BhB;;ACMI;EACI,kBAAA;EACA,oBAAA;EACA,mBAAA;EACA,6CCtCO;EDuCP,kDAAA;EACA,kBCjCD;EDkCC,kBAAA;EACA,qBAAA;EACA,gCAAA;EACA,iBAAA;ADHR;ACKQ;EACI,YAAA;EACA,qCAAA;EACA,qDAAA;ADHZ;ACKQ;EACI,4CAAA;EACA,YAAA;EACA,gBAAA;EACA,wCCvDG;EDwDH,kBAAA;EACA,aAAA;EACA,UAAA;EAGA,yBAAA;ADLZ;ACOQ;EACI,eAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,kDAAA;EACA,kBAAA;EACA,SAAA;EACA,WAAA;EACA,yBAAA;KAAA,sBAAA;ADLZ;ACOQ;EACI,eAAA;EACA,gBAAA;EACA,cChFF;AF2EV;ACOQ;EACI,eAAA;EACA,iBAAA;EACA,mBAAA;ADLZ;;ACOA;EACI;IACI,eAAA;EDJN;ECMM;IACI,iBAAA;EDJV;ECMM;IACI,eAAA;EDJV;AACF","file":"home.css","sourcesContent":["@charset \"UTF-8\";\nheader {\n max-width: 800px;\n margin: 0 auto;\n font-size: 40px;\n margin-bottom: 15rem;\n}\nheader h1 {\n line-height: 4rem;\n}\n\ndiv.featured-box {\n background: rgba(247, 154, 182, 0.1411764706);\n border: 2px solid rgba(244, 90, 136, 0.3803921569);\n border-radius: 5px;\n padding: 2rem;\n margin-block: 2rem;\n display: flex;\n vertical-align: middle;\n transition: all 200ms;\n}\ndiv.featured-box:hover {\n scale: 1.025;\n filter: brightness(1.1) saturate(1.1);\n box-shadow: 0 0 30px rgba(244, 90, 136, 0.3803921569);\n}\ndiv.featured-box img {\n height: 50px;\n object-fit: cover;\n}\ndiv.featured-box h2 {\n vertical-align: middle;\n margin-block: auto;\n margin-left: 1rem;\n font-size: 1.5rem;\n}\ndiv.featured-box h2 span {\n color: #f45a88;\n}\n\ndiv.user-quotes div.user-quote__field {\n margin-block: 2rem;\n padding-inline: 2rem;\n padding-block: 2rem;\n background: rgba(247, 154, 182, 0.1411764706);\n border: 2px solid rgba(244, 90, 136, 0.3803921569);\n border-radius: 5px;\n position: relative;\n transition: all 200ms;\n box-shadow: 0 0 30px transparent;\n min-height: 200px;\n}\ndiv.user-quotes div.user-quote__field:hover {\n scale: 1.025;\n filter: brightness(1.1) saturate(1.1);\n box-shadow: 0 0 30px rgba(244, 90, 136, 0.3803921569);\n}\ndiv.user-quotes div.user-quote__field::before {\n font-family: \"Times New Roman\", Times, serif;\n content: \"“\";\n font-size: 150px;\n color: rgba(247, 154, 182, 0.1411764706);\n position: absolute;\n bottom: -1rem;\n left: 1rem;\n transform: rotate(180deg);\n}\ndiv.user-quotes div.user-quote__field img {\n cursor: pointer;\n width: 100px;\n height: 100px;\n border-radius: 50%;\n border: 3px solid rgba(244, 90, 136, 0.3803921569);\n position: absolute;\n top: 1rem;\n right: 1rem;\n object-fit: scale-down;\n}\ndiv.user-quotes div.user-quote__field span.user-quote__username {\n font-size: 1rem;\n font-weight: 600;\n color: #b53d61;\n}\ndiv.user-quotes div.user-quote__field p {\n margin-block: 0;\n font-size: 1.5rem;\n padding-right: 7rem;\n}\n\n@media (max-width: 800px) {\n header {\n font-size: 26px;\n }\n header h1 {\n line-height: 3rem;\n }\n header h3 {\n font-size: 28px;\n }\n}","@import '_vars'\n\nheader\n max-width: $main-width\n margin: 0 auto\n font-size: 40px\n margin-bottom: 15rem\n\n h1\n line-height: 4rem\n\ndiv.featured-box\n background: $primary-soft\n border: 2px solid $primary-glow\n border-radius: $edge\n padding: 2rem\n margin-block: 2rem\n display: flex\n vertical-align: middle\n transition: all 200ms\n\n &:hover\n scale: 1.025\n filter: brightness(1.1) saturate(1.1)\n box-shadow: 0 0 30px $primary-glow\n\n img\n height: 50px\n object-fit: cover\n\n h2\n vertical-align: middle\n margin-block: auto\n margin-left: 1rem\n font-size: 1.5rem\n\n span\n color: $primary-light\n\ndiv.user-quotes\n // display: grid\n // grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))\n // grid-gap: 2rem\n\n div.user-quote__field\n margin-block: 2rem\n padding-inline: 2rem\n padding-block: 2rem\n background: $primary-soft\n border: 2px solid $primary-glow\n border-radius: $edge\n position: relative\n transition: all 200ms\n box-shadow: 0 0 30px transparent\n min-height: 200px\n\n &:hover\n scale: 1.025\n filter: brightness(1.1) saturate(1.1)\n box-shadow: 0 0 30px $primary-glow\n\n &::before\n font-family: 'Times New Roman', Times, serif\n content: '\\201c'\n font-size: 150px\n color: $primary-soft\n position: absolute\n bottom: -1rem\n left: 1rem\n \n // show at the bottom left\n transform: rotate(180deg)\n\n img\n cursor: pointer\n width: 100px\n height: 100px\n border-radius: 50%\n border: 3px solid $primary-glow\n position: absolute\n top: 1rem\n right: 1rem\n object-fit: scale-down\n\n span.user-quote__username\n font-size: 1rem\n font-weight: 600\n color: $primary\n\n p\n margin-block: 0\n font-size: 1.5rem\n padding-right: 7rem\n\n@media (max-width: 800px)\n header\n font-size: 26px\n \n h1\n line-height: 3rem\n\n h3\n font-size: 28px\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n$soft: #fcf7f824\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file diff --git a/web/static/css/input.css b/web/static/css/input.css index a274cac..20eefc9 100644 --- a/web/static/css/input.css +++ b/web/static/css/input.css @@ -30,6 +30,9 @@ button svg, button img { vertical-align: middle; filter: invert(180); } +button mark { + background: rgba(252, 247, 248, 0.1411764706); +} input:not([type=checkbox]):not([type=radio]) { width: 100%; diff --git a/web/static/css/input.css.map b/web/static/css/input.css.map index 54df162..7edecd8 100644 --- a/web/static/css/input.css.map +++ b/web/static/css/input.css.map @@ -1 +1 @@ -{"version":3,"sources":["input.sass","_vars.sass","input.css"],"names":[],"mappings":"AAEA;EACI,cAAA;EACA,eAAA;EACA,eAAA;EACA,kBCUG;EDTH,sBAAA;EACA,gBAAA;EACA,mBAAA;EAEA,cCXG;EDYH,mBCNM;EDQN,2BAAA;AEHJ;AFKI;EACI,uBAAA;AEHR;AFKI;EACI,qDAAA;AEHR;AFKQ;EACI,4BAAA;AEHZ;AFKI;EACI,cC1BD;ED2BC,mBCzBI;ED0BJ,gDAAA;AEHR;AFKI;EACI,YAAA;EACA,qBAAA;EACA,sBAAA;EACA,mBAAA;AEHR;;AFKA;EACI,WAAA;EACA,eAAA;EACA,kBCvBG;EDwBH,oBAAA;EAEA,cC1CG;ED2CH,mBCzCQ;ED0CR,yBAAA;AEHJ;AFKI;EACI,aAAA;AEHR;;AFKA;EACI,yBAAA;AEFJ","file":"input.css","sourcesContent":["@import '_vars'\n\nbutton\n line-height: 2\n cursor: pointer\n font-size: 16px\n border-radius: $edge\n padding: 0.7rem 1.5rem\n font-weight: 600\n margin-bottom: 1rem\n\n color: $text\n background: $primary\n\n transition: box-shadow 0.2s\n\n &:hover\n filter: brightness(1.2)\n\n &.special\n box-shadow: 0 0 20px $primary-glow\n\n &:hover\n box-shadow: 0 0 20px $primary\n\n &.secondary\n color: $text\n background: $secondary\n border: 1px solid $border\n\n svg, img\n height: 24px\n display: inline-block\n vertical-align: middle\n filter: invert(180)\n\ninput:not([type=\"checkbox\"]):not([type=\"radio\"])\n width: 100%\n font-size: 18px\n border-radius: $edge\n padding: 0.5rem 1rem\n\n color: $text\n background: $secondary\n border: 1px solid $primary\n\n &:focus\n outline: none\n\ninput[type=\"radio\"]\n filter: hue-rotate(50deg)\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n","button {\n line-height: 2;\n cursor: pointer;\n font-size: 16px;\n border-radius: 5px;\n padding: 0.7rem 1.5rem;\n font-weight: 600;\n margin-bottom: 1rem;\n color: #f3f3f3;\n background: #b53d61;\n transition: box-shadow 0.2s;\n}\nbutton:hover {\n filter: brightness(1.2);\n}\nbutton.special {\n box-shadow: 0 0 20px rgba(244, 90, 136, 0.3803921569);\n}\nbutton.special:hover {\n box-shadow: 0 0 20px #b53d61;\n}\nbutton.secondary {\n color: #f3f3f3;\n background: #252a38;\n border: 1px solid rgba(22, 29, 43, 0.6901960784);\n}\nbutton svg, button img {\n height: 24px;\n display: inline-block;\n vertical-align: middle;\n filter: invert(180);\n}\n\ninput:not([type=checkbox]):not([type=radio]) {\n width: 100%;\n font-size: 18px;\n border-radius: 5px;\n padding: 0.5rem 1rem;\n color: #f3f3f3;\n background: #252a38;\n border: 1px solid #b53d61;\n}\ninput:not([type=checkbox]):not([type=radio]):focus {\n outline: none;\n}\n\ninput[type=radio] {\n filter: hue-rotate(50deg);\n}"]} \ No newline at end of file +{"version":3,"sources":["input.sass","_vars.sass","input.css"],"names":[],"mappings":"AAEA;EACI,cAAA;EACA,eAAA;EACA,eAAA;EACA,kBCWG;EDVH,sBAAA;EACA,gBAAA;EACA,mBAAA;EAEA,cCXG;EDYH,mBCLM;EDON,2BAAA;AEHJ;AFKI;EACI,uBAAA;AEHR;AFKI;EACI,qDAAA;AEHR;AFKQ;EACI,4BAAA;AEHZ;AFKI;EACI,cC1BD;ED2BC,mBCzBI;ED0BJ,gDAAA;AEHR;AFKI;EACI,YAAA;EACA,qBAAA;EACA,sBAAA;EACA,mBAAA;AEHR;AFKI;EACI,6CChCD;AC6BP;;AFKA;EACI,WAAA;EACA,eAAA;EACA,kBCzBG;ED0BH,oBAAA;EAEA,cC7CG;ED8CH,mBC5CQ;ED6CR,yBAAA;AEHJ;AFKI;EACI,aAAA;AEHR;;AFKA;EACI,yBAAA;AEFJ","file":"input.css","sourcesContent":["@import '_vars'\n\nbutton\n line-height: 2\n cursor: pointer\n font-size: 16px\n border-radius: $edge\n padding: 0.7rem 1.5rem\n font-weight: 600\n margin-bottom: 1rem\n\n color: $text\n background: $primary\n\n transition: box-shadow 0.2s\n\n &:hover\n filter: brightness(1.2)\n\n &.special\n box-shadow: 0 0 20px $primary-glow\n\n &:hover\n box-shadow: 0 0 20px $primary\n\n &.secondary\n color: $text\n background: $secondary\n border: 1px solid $border\n\n svg, img\n height: 24px\n display: inline-block\n vertical-align: middle\n filter: invert(180)\n\n mark\n background: $soft\n\ninput:not([type=\"checkbox\"]):not([type=\"radio\"])\n width: 100%\n font-size: 18px\n border-radius: $edge\n padding: 0.5rem 1rem\n\n color: $text\n background: $secondary\n border: 1px solid $primary\n\n &:focus\n outline: none\n\ninput[type=\"radio\"]\n filter: hue-rotate(50deg)\n","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n$soft: #fcf7f824\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n","button {\n line-height: 2;\n cursor: pointer;\n font-size: 16px;\n border-radius: 5px;\n padding: 0.7rem 1.5rem;\n font-weight: 600;\n margin-bottom: 1rem;\n color: #f3f3f3;\n background: #b53d61;\n transition: box-shadow 0.2s;\n}\nbutton:hover {\n filter: brightness(1.2);\n}\nbutton.special {\n box-shadow: 0 0 20px rgba(244, 90, 136, 0.3803921569);\n}\nbutton.special:hover {\n box-shadow: 0 0 20px #b53d61;\n}\nbutton.secondary {\n color: #f3f3f3;\n background: #252a38;\n border: 1px solid rgba(22, 29, 43, 0.6901960784);\n}\nbutton svg, button img {\n height: 24px;\n display: inline-block;\n vertical-align: middle;\n filter: invert(180);\n}\nbutton mark {\n background: rgba(252, 247, 248, 0.1411764706);\n}\n\ninput:not([type=checkbox]):not([type=radio]) {\n width: 100%;\n font-size: 18px;\n border-radius: 5px;\n padding: 0.5rem 1rem;\n color: #f3f3f3;\n background: #252a38;\n border: 1px solid #b53d61;\n}\ninput:not([type=checkbox]):not([type=radio]):focus {\n outline: none;\n}\n\ninput[type=radio] {\n filter: hue-rotate(50deg);\n}"]} \ No newline at end of file diff --git a/web/static/css/input.sass b/web/static/css/input.sass index d63d170..4565fed 100644 --- a/web/static/css/input.sass +++ b/web/static/css/input.sass @@ -34,6 +34,9 @@ button vertical-align: middle filter: invert(180) + mark + background: $soft + input:not([type="checkbox"]):not([type="radio"]) width: 100% font-size: 18px diff --git a/web/static/css/navbar.css.map b/web/static/css/navbar.css.map index 3b48a1e..ab5414f 100644 --- a/web/static/css/navbar.css.map +++ b/web/static/css/navbar.css.map @@ -1 +1 @@ -{"version":3,"sources":["navbar.sass","navbar.css","_vars.sass"],"names":[],"mappings":"AAEA;EACI,aAAA;EACA,mBAAA;EACA,kBAAA;ACDJ;ADGI;EACI,qBAAA;EACA,eEFQ;EFGR,gBAAA;EACA,eAAA;EACA,YAAA;EACA,WAAA;EAEA,iBAAA;EACA,uBAAA;ACFR;ADII;EACI,gBAAA;EACA,eAAA;EACA,yBAAA;KAAA,sBAAA;UAAA,iBAAA;ACFR;ADIQ;EACI,eAAA;EACA,kBAAA;EACA,SAAA;ACFZ;ADKI;EACI,YAAA;ACHR;ADMI;EACI,aAAA;EACA,eAAA;ACJR;;ADOI;EACI,eAAA;EACA,gBAAA;EACA,iBAAA;EACA,qBAAA;EACA,sBAAA;ACJR;ADMQ;EACI,cEvCI;ADmChB;;ADMA;EACI;IACI,sCAAA;IACA,UAAA;IAEA,YAAA;IACA,YAAA;IACA,kBAAA;IACA,SAAA;IACA,WAAA;IACA,mBExDI;IFyDJ,eAAA;IACA,kBE5CD;IF6CC,kCAAA;YAAA,0BAAA;IACA,gDAAA;IAEA,wCAAA;ECLN;EDOM;IACI,UAAA;IACA,kBAAA;ECLV;EDOM;IACI,eAAA;IACA,cAAA;IACA,iBAAA;ECLV;EDQM;IACI,eEtEI;EDgEd;EDQM;IACI,cAAA;IACA,gBAAA;IACA,eAAA;IACA,YAAA;IACA,WAAA;IACA,eAAA;IACA,gBAAA;ECNV;EDQU;IACI,wBAAA;ECNd;AACF;ADOA;EAEQ;IACI,aAAA;ECNV;AACF","file":"navbar.css","sourcesContent":["@import '_vars'\n\nnav\n display: flex\n align-items: center\n position: relative\n\n >.logo\n display: inline-block\n stroke: $primary-light\n min-height: 40px\n min-width: 40px\n height: 40px\n width: 40px\n\n margin-right: 8px\n transition: stroke 0.2s\n\n >h1\n font-weight: 500\n font-size: 20px\n user-select: none\n\n mark\n font-size: 1rem\n position: relative\n top: -3px\n\n\n >span\n flex-grow: 1\n\n\n #menu\n display: none\n cursor: pointer\n\n.link-menu\n >a\n font-size: 14px\n font-weight: 600\n margin-left: 2rem\n text-decoration: none\n transition: color 0.1s\n\n &:hover\n color: $primary-light\n\n@media (max-width: 800px)\n .link-menu\n transform: scale(0.8) translateX(1rem)\n opacity: 0\n\n z-index: 100\n width: 200px\n position: absolute\n top: 5rem\n right: 2rem\n background: $secondary\n padding: 1rem 0\n border-radius: $edge\n backdrop-filter: blur(4px)\n border: 1px solid $border\n\n transition: transform 0.2s, opacity 0.2s\n\n &.open\n opacity: 1\n transform: inherit\n\n a\n font-size: 20px\n display: block\n line-height: 3rem\n\n nav\n .logo\n stroke: $primary-light\n\n #menu\n display: block\n min-height: 32px\n min-width: 32px\n height: 32px\n width: 32px\n cursor: pointer\n transition: 0.5s\n\n &.active\n transform: rotate(90deg)\n\n@media (max-width: 400px)\n nav\n h1\n display: none","nav {\n display: flex;\n align-items: center;\n position: relative;\n}\nnav > .logo {\n display: inline-block;\n stroke: #f45a88;\n min-height: 40px;\n min-width: 40px;\n height: 40px;\n width: 40px;\n margin-right: 8px;\n transition: stroke 0.2s;\n}\nnav > h1 {\n font-weight: 500;\n font-size: 20px;\n user-select: none;\n}\nnav > h1 mark {\n font-size: 1rem;\n position: relative;\n top: -3px;\n}\nnav > span {\n flex-grow: 1;\n}\nnav #menu {\n display: none;\n cursor: pointer;\n}\n\n.link-menu > a {\n font-size: 14px;\n font-weight: 600;\n margin-left: 2rem;\n text-decoration: none;\n transition: color 0.1s;\n}\n.link-menu > a:hover {\n color: #f45a88;\n}\n\n@media (max-width: 800px) {\n .link-menu {\n transform: scale(0.8) translateX(1rem);\n opacity: 0;\n z-index: 100;\n width: 200px;\n position: absolute;\n top: 5rem;\n right: 2rem;\n background: #252a38;\n padding: 1rem 0;\n border-radius: 5px;\n backdrop-filter: blur(4px);\n border: 1px solid rgba(22, 29, 43, 0.6901960784);\n transition: transform 0.2s, opacity 0.2s;\n }\n .link-menu.open {\n opacity: 1;\n transform: inherit;\n }\n .link-menu a {\n font-size: 20px;\n display: block;\n line-height: 3rem;\n }\n nav .logo {\n stroke: #f45a88;\n }\n nav #menu {\n display: block;\n min-height: 32px;\n min-width: 32px;\n height: 32px;\n width: 32px;\n cursor: pointer;\n transition: 0.5s;\n }\n nav #menu.active {\n transform: rotate(90deg);\n }\n}\n@media (max-width: 400px) {\n nav h1 {\n display: none;\n }\n}","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file +{"version":3,"sources":["navbar.sass","navbar.css","_vars.sass"],"names":[],"mappings":"AAEA;EACI,aAAA;EACA,mBAAA;EACA,kBAAA;ACDJ;ADGI;EACI,qBAAA;EACA,eEDQ;EFER,gBAAA;EACA,eAAA;EACA,YAAA;EACA,WAAA;EAEA,iBAAA;EACA,uBAAA;ACFR;ADII;EACI,gBAAA;EACA,eAAA;EACA,yBAAA;KAAA,sBAAA;UAAA,iBAAA;ACFR;ADIQ;EACI,eAAA;EACA,kBAAA;EACA,SAAA;ACFZ;ADKI;EACI,YAAA;ACHR;ADMI;EACI,aAAA;EACA,eAAA;ACJR;;ADOI;EACI,eAAA;EACA,gBAAA;EACA,iBAAA;EACA,qBAAA;EACA,sBAAA;ACJR;ADMQ;EACI,cEtCI;ADkChB;;ADMA;EACI;IACI,sCAAA;IACA,UAAA;IAEA,YAAA;IACA,YAAA;IACA,kBAAA;IACA,SAAA;IACA,WAAA;IACA,mBExDI;IFyDJ,eAAA;IACA,kBE3CD;IF4CC,kCAAA;YAAA,0BAAA;IACA,gDAAA;IAEA,wCAAA;ECLN;EDOM;IACI,UAAA;IACA,kBAAA;ECLV;EDOM;IACI,eAAA;IACA,cAAA;IACA,iBAAA;ECLV;EDQM;IACI,eErEI;ED+Dd;EDQM;IACI,cAAA;IACA,gBAAA;IACA,eAAA;IACA,YAAA;IACA,WAAA;IACA,eAAA;IACA,gBAAA;ECNV;EDQU;IACI,wBAAA;ECNd;AACF;ADOA;EAEQ;IACI,aAAA;ECNV;AACF","file":"navbar.css","sourcesContent":["@import '_vars'\n\nnav\n display: flex\n align-items: center\n position: relative\n\n >.logo\n display: inline-block\n stroke: $primary-light\n min-height: 40px\n min-width: 40px\n height: 40px\n width: 40px\n\n margin-right: 8px\n transition: stroke 0.2s\n\n >h1\n font-weight: 500\n font-size: 20px\n user-select: none\n\n mark\n font-size: 1rem\n position: relative\n top: -3px\n\n\n >span\n flex-grow: 1\n\n\n #menu\n display: none\n cursor: pointer\n\n.link-menu\n >a\n font-size: 14px\n font-weight: 600\n margin-left: 2rem\n text-decoration: none\n transition: color 0.1s\n\n &:hover\n color: $primary-light\n\n@media (max-width: 800px)\n .link-menu\n transform: scale(0.8) translateX(1rem)\n opacity: 0\n\n z-index: 100\n width: 200px\n position: absolute\n top: 5rem\n right: 2rem\n background: $secondary\n padding: 1rem 0\n border-radius: $edge\n backdrop-filter: blur(4px)\n border: 1px solid $border\n\n transition: transform 0.2s, opacity 0.2s\n\n &.open\n opacity: 1\n transform: inherit\n\n a\n font-size: 20px\n display: block\n line-height: 3rem\n\n nav\n .logo\n stroke: $primary-light\n\n #menu\n display: block\n min-height: 32px\n min-width: 32px\n height: 32px\n width: 32px\n cursor: pointer\n transition: 0.5s\n\n &.active\n transform: rotate(90deg)\n\n@media (max-width: 400px)\n nav\n h1\n display: none","nav {\n display: flex;\n align-items: center;\n position: relative;\n}\nnav > .logo {\n display: inline-block;\n stroke: #f45a88;\n min-height: 40px;\n min-width: 40px;\n height: 40px;\n width: 40px;\n margin-right: 8px;\n transition: stroke 0.2s;\n}\nnav > h1 {\n font-weight: 500;\n font-size: 20px;\n user-select: none;\n}\nnav > h1 mark {\n font-size: 1rem;\n position: relative;\n top: -3px;\n}\nnav > span {\n flex-grow: 1;\n}\nnav #menu {\n display: none;\n cursor: pointer;\n}\n\n.link-menu > a {\n font-size: 14px;\n font-weight: 600;\n margin-left: 2rem;\n text-decoration: none;\n transition: color 0.1s;\n}\n.link-menu > a:hover {\n color: #f45a88;\n}\n\n@media (max-width: 800px) {\n .link-menu {\n transform: scale(0.8) translateX(1rem);\n opacity: 0;\n z-index: 100;\n width: 200px;\n position: absolute;\n top: 5rem;\n right: 2rem;\n background: #252a38;\n padding: 1rem 0;\n border-radius: 5px;\n backdrop-filter: blur(4px);\n border: 1px solid rgba(22, 29, 43, 0.6901960784);\n transition: transform 0.2s, opacity 0.2s;\n }\n .link-menu.open {\n opacity: 1;\n transform: inherit;\n }\n .link-menu a {\n font-size: 20px;\n display: block;\n line-height: 3rem;\n }\n nav .logo {\n stroke: #f45a88;\n }\n nav #menu {\n display: block;\n min-height: 32px;\n min-width: 32px;\n height: 32px;\n width: 32px;\n cursor: pointer;\n transition: 0.5s;\n }\n nav #menu.active {\n transform: rotate(90deg);\n }\n}\n@media (max-width: 400px) {\n nav h1 {\n display: none;\n }\n}","$text: #f3f3f3\n$background: #03060d\n$secondary: #252a38\n$secondary-dark: #0e0e0e\n$border: #161d2bb0\n$soft: #fcf7f824\n\n$primary: #b53d61\n$primary-light: #f45a88\n$primary-glow: #f45a8861\n$primary-soft: #f79ab624\n$accent: #28aaf0\n\n$error: #ef3628\n$warn: #f09928\n$success: #28ef6b\n\n$edge: 5px\n\n$main-width: 800px\n$more-width: 1000px\n"]} \ No newline at end of file diff --git a/web/templates/account.html b/web/templates/account.html new file mode 100644 index 0000000..7131b1c --- /dev/null +++ b/web/templates/account.html @@ -0,0 +1,8 @@ +{% include 'common/begin.html' %} + +
+

Welcome back, {{ user.username }}

+ +
+ +{% include 'common/end.html' %} \ No newline at end of file diff --git a/web/templates/common/footer.html b/web/templates/common/footer.html index 67b0525..99fa0ff 100644 --- a/web/templates/common/footer.html +++ b/web/templates/common/footer.html @@ -2,7 +2,8 @@

Get started

- Start using the API + How to use the API + Open the dashboard How to use NovaCord Secure your API keys when using Replit diff --git a/web/templates/panel.html b/web/templates/get-started.html similarity index 98% rename from web/templates/panel.html rename to web/templates/get-started.html index 278cf7c..b57ba77 100644 --- a/web/templates/panel.html +++ b/web/templates/get-started.html @@ -2,7 +2,7 @@
-

API Panel

+

Get started

Python

Endpoint

diff --git a/web/templates/index.html b/web/templates/index.html index 21dd239..c8dd21f 100644 --- a/web/templates/index.html +++ b/web/templates/index.html @@ -7,23 +7,26 @@ - + - - - +
+

Welcome

+

+ Nova is a free, open source, easy to use, and powerful API for accessing all sorts of AI models. +
+ + Get started + +

+

About Nova