mCaptcha/survey
2
0
Fork 0
Code Issues 4 Pull requests 10 Projects Releases Packages Wiki Activity

mobile styling

Browse source
This commit is contained in:
Aravinth Manivannan 2021-10-27 11:39:37 +05:30
parent eccb87fd99
commit 0524208a39
Signed by: realaravinth
GPG key ID: AD9F0F08E855ED88
13 changed files with 145 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
package.json
View file

@ -4,8 +4,8 @@
"version": "1.0.0",
"scripts": {
"build": "webpack --mode production",
"lint": "eslint templates",
"sass": "dart-sass -s compressed templates/main.scss ./static/cache/bundle/css/main.css",
"lint": "eslint templates",
"sass": "dart-sass -s compressed templates/main.scss ./static/cache/bundle/css/main.css && dart-sass -s compressed templates/mobile.scss ./static/cache/bundle/css/mobile.css",
"start": "webpack-dev-server --mode development --progress --color",
"test": "jest"
},

18
src/api/v1/admin/auth.rs
View file

@ -36,14 +36,18 @@ pub mod routes {
impl GetLoginRoute for Auth {
fn get_login_route(&self, src: Option<&str>) -> String {
if let Some(redirect_to) = src {
let mut url = Url::parse("http://x/").unwrap();
url.set_path(self.login);
url.query_pairs_mut()
.append_pair("redirect_to", redirect_to);
let path = format!("{}/?{}", url.path(), url.query().unwrap());
path
// uri::Builder::new().path_and_query(
format!(
"{}?redirect_to={}",
self.register,
urlencoding::encode(redirect_to)
)
// let mut url: Uri = self.register.parse().unwrap();
// url.qu
// url.query_pairs_mut()
// .append_pair("redirect_to", redirect_to);
} else {
self.login.to_string()
self.register.to_string()
}
}
}

4
src/main.rs
View file

@ -52,6 +52,10 @@ lazy_static! {
pub static ref CSS: &'static str =
FILES.get("./static/cache/bundle/css/main.css").unwrap();
pub static ref MOBILE_CSS: &'static str =
FILES.get("./static/cache/bundle/css/mobile.css").unwrap();
pub static ref JS: &'static str =
FILES.get("./static/cache/bundle/bundle.js").unwrap();

1
src/static_assets/static_files.rs
View file

@ -132,6 +132,7 @@ mod tests {
assets::HEADSETS.path,
*crate::JS,
*crate::CSS,
*crate::MOBILE_CSS,
*crate::GLUE,
]
.iter()

57
templates/bench/index.html
View file

@ -1,7 +1,7 @@
<. include!("../components/base/top.html"); .>
<body class="survey__body">
<main class="survey__container">
<. include!("../components/error/index.html"); .>
<. include!("../components/error/index.html"); .>
<div id="pre-bench">
<h1>Click to Start Benchmark</h1>
<form class="new-campaign__form" accept-charset="utf-8">
@ -17,9 +17,7 @@
</label>
<!-- <button id="start" type="submit">Start</button> -->
<button id="start" class="form__submit" type="submit">
Start
</button>
<button id="start" class="form__submit" type="submit">Start</button>
</form>
</div>
@ -27,7 +25,7 @@
<b>
This is a WASM benchmark, please enable JavScript to run it. We don't
collect any data and
<a href="https://github.com/mCaptcha/benches"
<a href="https://github.com/mCaptcha/survey"
>source code is available here</a
>
</b>
@ -35,13 +33,22 @@
<div id="bench">
<h1 id="status" class="name">Running benchmark</h1>
<div id="submission-proof"></div>
<div id="device-info"></div>
<div id="counter"></div>
<button class="btn" id="advance">Show Advanced Log</button>
<table>
<div id="winner-instructions">
<h2>Winner Announcement</h2>
<p>
The winners will be announed on the organisation website on December
1, 2021. The winning submission IDs will be published and the winners
expected to provide the submission proof to claim their rewards.
</p>
</div>
<div id="submission-proof"></div>
<div class="advance-log" id="device-info"></div>
<table class="advance-log">
<thead>
<tr>
<th>Difficulty factor</th>
@ -59,7 +66,7 @@
width: 100%;
display: flex;
flex-direction: column;
padding: 40px 0;
padding: 0;
display: hidden;
align-items: center;
}
@ -77,6 +84,11 @@
display: none;
}
.survey__container {
flex: 2;
margin: 0 auto;
}
#status {
max-width: 80%;
margin: auto;
@ -101,7 +113,28 @@
#device-info {
margin: auto;
font-size: 1.3rem;
font-size: 0.8rem;
}
.advance-log > b,
div {
font-size: 0.8rem;
}
.advance-log {
display: none;
}
#winner-instructions {
display: none;
}
#submission-proof {
margin: 15px auto;
}
#submission-proof > div,
b {
font-size: 1.2rem;
font-family: monospace, monospace;
}
</style>
<script src="<.= &*crate::GLUE .>"></script>

26
templates/bench/index.ts
View file

@ -21,6 +21,25 @@ import isBlankString from "../utils/isBlankString";
import createError from "../components/error/";
export const index = () => {
const ADV = <HTMLButtonElement>document.getElementById("advance");
const toggleAdv = (e: Event) => {
e.preventDefault();
if (ADV.innerText.includes("Show")) {
ADV.innerText = "Hide Advance Log";
document
.querySelectorAll(".advance-log")
.forEach((e: HTMLElement) => (e.style.display = "block"));
} else {
ADV.innerText = "Show Advance Log";
document
.querySelectorAll(".advance-log")
.forEach((e: HTMLElement) => (e.style.display = "none"));
}
};
ADV.addEventListener("click", (e) => toggleAdv(e));
const initSession = async () => {
fetch(ROUTES.register);
};
@ -64,7 +83,7 @@ export const index = () => {
const data: SubmissionProof = await resp.json();
const element = document.createElement("div");
const token = document.createElement("b");
token.innerText = "User Agent: ";
token.innerText = "Submissinon ID: ";
const tokenText = document.createTextNode(`${data.token}`);
const proof = document.createElement("b");
@ -77,6 +96,7 @@ export const index = () => {
element.appendChild(proof);
element.appendChild(proofText);
document.getElementById("submission-proof").appendChild(element);
document.getElementById("winner-instructions").style.display = "block";
}
};
@ -90,11 +110,11 @@ export const index = () => {
console.log(INFO);
const element = document.createElement("div");
const ua = document.createElement("b");
const ua = document.createElement("span");
ua.innerText = "User Agent: ";
const os = document.createTextNode(`${INFO.oscup}`);
const threads = document.createElement("b");
const threads = document.createElement("span");
threads.innerText = "Hardware concurrency: ";
const threadsText = document.createTextNode(`${INFO.threads}`);

1
templates/components/_button.scss
View file

@ -15,7 +15,6 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
@mixin button {
border: none;

6
templates/components/base/top.html
View file

@ -5,4 +5,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><.= PAGE .> | <.= crate::pages::NAME .></title>
<link rel="stylesheet" href="<.= &*crate::CSS .>" />
<link
rel="stylesheet"
media="screen and (max-width: 1250px)"
type="text/css"
href="<.= &*crate::MOBILE_CSS .>"
/>
</head>

20
templates/components/footer/main.scss
View file

@ -16,21 +16,21 @@
*/
.footer {
font-size: 0.8rem;
padding: 0px 20px;
font-size: 0.8rem;
padding: 0px 20px;
position: relative;
bottom: 10px;
width: 100%;
position: relative;
bottom: 10px;
width: 100%;
}
.footer__section {
display: inline;
float: right;
display: inline;
float: right;
}
.footer__item {
display: inline;
list-style: none;
padding: 10px;
display: inline;
list-style: none;
padding: 10px;
}

9
templates/index.html
View file

@ -75,6 +75,15 @@
<b>No Personally identifying information is collected</b>
</section>
<section>
<h2>Winner Announcement</h2>
<p>
The winners will be announed on the organisation website on December 1,
2021. The winning submission IDs will be published and the winners
expected to provide the submission proof to claim their rewards.
</p>
</section>
<a
class="link__btn"
href="<.= crate::PAGES.panel.campaigns.get_bench_route(uuid) .>"

1
templates/main.scss
View file

@ -49,6 +49,7 @@ body {
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.survey__body {

29
templates/mobile.scss Normal file
View file

@ -0,0 +1,29 @@
/*
* Copyright (C) 2021 Aravinth Manivannan <realaravinth@batsense.net>
*
* This program 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.
*
* This program 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 this program. If not, see <https://www.gnu.org/licenses/>.
*/
.survey__container {
width: 90%;
}
.footer {
margin: auto;
width: auto;
}
.survey__container h2 {
font-weight: 550;
}

4
templates/panel/main.scss
View file

@ -38,6 +38,10 @@
padding-bottom: 0.2rem;
}
.btn {
@include button;
}
table {
border-collapse: collapse;
caption-side: bottom;