Feat UI - added CSS to results page
This commit is contained in:
parent
385d5b922e
commit
8b2b01a17d
57
static/css/results.css
Normal file
57
static/css/results.css
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap");
|
||||||
|
html {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
*,
|
||||||
|
*:before,
|
||||||
|
*:after {
|
||||||
|
box-sizing: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
position: relative;
|
||||||
|
overflow-x: hidden !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
user-select: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
counter-reset: points;
|
||||||
|
background-color: #77aa77;
|
||||||
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 2 1'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%2377aa77'/%3E%3Cstop offset='1' stop-color='%234fd'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23cf8' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23cf8' stop-opacity='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='2' y2='2'%3E%3Cstop offset='0' stop-color='%23cf8' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23cf8' stop-opacity='1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='2' height='1'/%3E%3Cg fill-opacity='0.5'%3E%3Cpolygon fill='url(%23b)' points='0 1 0 0 2 0'/%3E%3Cpolygon fill='url(%23c)' points='2 1 2 0 0 0'/%3E%3C/g%3E%3C/svg%3E");
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-size: cover;
|
||||||
|
font-family: "helvetica", sans-serif !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
section {
|
||||||
|
padding-top: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
-webkit-box-shadow: 0 10px 6px -6px #777;
|
||||||
|
-moz-box-shadow: 0 10px 6px -6px #777;
|
||||||
|
box-shadow: 0 10px 6px -6px #777;
|
||||||
|
color: #000000;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 30px 40px 30px;
|
||||||
|
width: 95%;
|
||||||
|
max-width: 590px;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button.is-fullwidth {
|
||||||
|
display: flex;
|
||||||
|
width: 90%;
|
||||||
|
margin: auto;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
@ -2,13 +2,53 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Document</title>
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" />
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/results.css') }}" />
|
||||||
|
<link rel="shortcut icon" href="https://avatars0.githubusercontent.com/u/65834464?s=200&v=4"
|
||||||
|
type="image/x-icon">
|
||||||
|
<link rel="stylesheet"
|
||||||
|
href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css" />
|
||||||
|
<script src="https://kit.fontawesome.com/22be60108b.js" crossorigin="anonymous"></script>
|
||||||
|
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
|
||||||
|
<title>MLH Quizzet</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<h1> You got {{ correct }}/{{ total }} right !</h1>
|
<style type="text/css">
|
||||||
|
@font-face {
|
||||||
|
font-family: helvetica;
|
||||||
|
src: "{{ url_for('static', filename='fonts/helvetica.ttf')}}"
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<nav class="navbar is-dark is-fixed-top has-text-centered" role="navigation" aria-label="main navigation">
|
||||||
|
<div class="navbar-brand">
|
||||||
|
<img src="https://avatars0.githubusercontent.com/u/65834464?s=200&v=4" height="32" width="64"
|
||||||
|
style="margin: 10px">
|
||||||
|
<a class="navbar-item has-text-centered" href="{{ url_for('index') }}"><strong
|
||||||
|
class="is-size-3 has-text-centered">MLH Quizzet</strong></a>
|
||||||
|
<a class="github-fork-ribbon" href="https://github.com/PragatiVerma18/Fantastic-Falcons-1.0"
|
||||||
|
data-ribbon="Fork me on GitHub" title="Fork me on GitHub">Fork me on GitHub</a>
|
||||||
|
<div class="navbar-burger" data-target="navMenu">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<section class="section-1" id="section-1">
|
||||||
|
<main>
|
||||||
|
<lottie-player src="https://assets3.lottiefiles.com/packages/lf20_0ge4xP.json" background="transparent" speed="1"
|
||||||
|
style="width: 240px; height: 240px; margin: auto !important;" loop autoplay></lottie-player>
|
||||||
|
<h1 class="has-text-centered is-size-3 has-text-weight-bold"> You got {{ correct }}/{{ total }} right!</h1>
|
||||||
|
<a class="button is-dark has-text-centered has-text-weight-bold is-rounded is-fullwidth" href="{{ url_for('index') }}"> Upload another document</a>
|
||||||
|
</main>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="has-text-white has-text-centered" style="margin-top: 40px; background-color: #363636; padding: 10px;">
|
||||||
|
MIT License © Copyright 2020 Fantastic Falcons
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user