Updated style

This commit is contained in:
luca0N! 2021-06-02 18:08:25 -03:00
parent fd377ba8c0
commit e253939fb0
Signed by: luca0N
GPG Key ID: 2E7B4655CF16D7D6
4 changed files with 105 additions and 67 deletions

View File

@ -55,6 +55,7 @@
</script> </script>
</head> </head>
<body> <body>
<div class="content">
<h1>Privacy Rating</h1><hr/> <h1>Privacy Rating</h1><hr/>
<p class="warning" id="javascript-warning">It looks like your browser is configured to block JavaScript. We're sorry, but this page requires JavaScript in order to function.</p> <p class="warning" id="javascript-warning">It looks like your browser is configured to block JavaScript. We're sorry, but this page requires JavaScript in order to function.</p>
<p>Privacy Rating displays a form containing a few questions which are used to show a privacy grade based on your technology tasks, ranging from excellent (<span class="badge-small grade-s">Grade S</span>) to very bad (<span class="badge-small grade-f">Grade F</span>).</p> <p>Privacy Rating displays a form containing a few questions which are used to show a privacy grade based on your technology tasks, ranging from excellent (<span class="badge-small grade-s">Grade S</span>) to very bad (<span class="badge-small grade-f">Grade F</span>).</p>
@ -64,5 +65,6 @@
<button onclick="document.location = 'session.html'">Start!</button> <button onclick="document.location = 'session.html'">Start!</button>
<hr/> <hr/>
<p><a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">Released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p> <p><a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">Released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p>
</div>
</body> </body>
</html> </html>

View File

@ -27,6 +27,16 @@ html {
body { body {
margin-left: 15%; margin-left: 15%;
margin-right: 15%; margin-right: 15%;
margin-top: 0;
margin-bottom: 0;
background-color: #bfc0cd;
}
.content {
background-color: #fff;
padding: 24px;
box-shadow: 0 0 32px #0004;
} }
#results { #results {
@ -104,7 +114,12 @@ body {
margin-top: 32px; margin-top: 32px;
margin-bottom: 32px; margin-bottom: 32px;
padding: 15px; padding: 15px;
border-style: dashed; background-color: #feffea;
box-shadow: 0 0 12px #0004;
}
.section-question:hover {
box-shadow: 0 0 24px #0008;
} }
#warning { #warning {
@ -127,7 +142,24 @@ body {
.section-report { .section-report {
margin-top: 12px; margin-top: 12px;
padding: 15px; padding: 15px;
border: solid; box-shadow: 0 0 12px #0004;
}
.section-report-good {
background-color: #aaffaa;
}
.section-report-warning {
background-color: #ffa;
}
.section-report-bad {
background-color: #ffd79f;
}
.section-report-critical {
background-color: #fcc;
}
.advisory {
font-weight: bold;
} }
.report-title { .report-title {
@ -144,8 +176,9 @@ body {
} }
.report-warning { .report-warning {
background-color: yellow; background-color: yellow;
}
.report-bad { .report-bad {
color: white;
background-color: orange; background-color: orange;
} }
.report-critical { .report-critical {

View File

@ -160,7 +160,7 @@ function setUpStrings(){
let report = quiz.reports[choices[x][y]]; let report = quiz.reports[choices[x][y]];
let reportEl = document.createElement('div'); let reportEl = document.createElement('div');
reportEl.className = 'section-report'; reportEl.className = 'section-report section-report-' + report.type;
let title = document.createElement('p'); let title = document.createElement('p');
title.className = 'report-title'; title.className = 'report-title';
@ -194,6 +194,7 @@ function setUpStrings(){
if (report.advisory != null && report.advisory != undefined){ if (report.advisory != null && report.advisory != undefined){
let p = document.createElement('p'); let p = document.createElement('p');
p.innerText = report.advisory; p.innerText = report.advisory;
p.className = 'advisory';
reportEl.appendChild(p); reportEl.appendChild(p);
} }

View File

@ -36,6 +36,7 @@
<script lang="javascript" type="text/javascript" src="res/js/js.js"></script> <script lang="javascript" type="text/javascript" src="res/js/js.js"></script>
</head> </head>
<body> <body>
<div class="content">
<h1>Privacy Rating</h1><hr/> <h1>Privacy Rating</h1><hr/>
<p class="warning" id="javascript-warning">It looks like your browser is configured to block JavaScript. We're sorry, but this page requires JavaScript in order to function.</p> <p class="warning" id="javascript-warning">It looks like your browser is configured to block JavaScript. We're sorry, but this page requires JavaScript in order to function.</p>
<p class="warning" id="warning">Loading quiz...</p> <p class="warning" id="warning">Loading quiz...</p>
@ -94,5 +95,6 @@
</div>--> </div>-->
<hr/> <hr/>
<p><a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">Released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p> <p><a href="https://labs.luca0n.com/projects/stairway-js" target="_blank">Released</a> under the <a href="https://git.luca0n.com/Stairway-js.git/tree/LICENSE" target="_blank">GNU General Public License version 3 or later</a>, by <a href="https://www.luca0n.com" target="_blank">luca0N!</a></p>
</div>
</body> </body>
</html> </html>