Dryusdan
/
donation-module
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

finish css

This commit is contained in:
Dryusdan 2018-08-05 13:58:17 +02:00
parent 0efaca0cb9
commit 13779dd745
5 changed files with 131 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
assets/js/donation.js Normal file
View File

@ -0,0 +1,20 @@
document.addEventListener('DOMContentLoaded', function() {
// code here
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", "https://www.drycat.fr/donation.json", false);
rawFile.onreadystatechange = function (){
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
alert(allText);
}
}
}
rawFile.send(null);
}
})

37
assets/sass/screen.scss
View File

@ -4,3 +4,40 @@
* <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
@import "compass/reset";
.donation{
display: inline-block;
width:25%;
border: solid black 1px;
.count_bar{
width:100%;
margin:0;
padding:0;
height:20px;
background-color: #777;
.status_bar{
width:0%;
margin:0;
padding:0;
height:20px;
background-color: green;
}
}
.row {
.col-2{
display:inline-block;
width:49%;
}
}
.title{
margin-top:0.5em;
margin-bottom: 0.5em;
padding-left:1em;
}
.amount, .amount_required, .row .col-2{
text-align:center;
margin-top:1em;
margin-bottom: 0.7em;
}
}

25
config.rb Normal file
View File

@ -0,0 +1,25 @@
require 'compass/import-once/activate'
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "assets/css"
sass_dir = "assets/sass"
images_dir = "assets/img"
javascripts_dir = "assets/js"
# You can select your preferred output style here (can be overridden via the command line):
# output_style = :expanded or :nested or :compact or :compressed
# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass

14
donation.json Normal file
View File

@ -0,0 +1,14 @@
{
"montly": {
"title": "Compteur mensuel",
"amount": "0",
"amount_required": "15",
"donator" : "0"
},
"annualy": {
"title": "Compteur annuel",
"amount": "0",
"amount_required": "180",
"donator" : "0"
}
}

35
index.html Normal file
View File

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<title>Donation module</title>
<meta charset="utf8">
<link rel="stylesheet" href="assets/css/screen.css">
</head>
<body>
<div class="donation montly">
<div class="container">
<div class="title">Compteur mensuel</div>
<div class="amount">
<span id="amount">0</span> € collectés
</div>
</div>
<div class="count_bar">
<div class="status_bar"></div>
</div>
<div class="container">
<div class="amount_required">
sur <span id="amount_required">120</span> € d'objectif
</div>
<div class="row">
<div class="col-2">
<span id="donator">0</span> donateur
</div>
<div class="col-2">
<span id="day_count">20</span> jours restant
</div>
</div>
</div>
</div>
<script src="assets/js/donation.js"></script>
</body>
</html>