forked from ulovliglogning/ulovliglogning.dk
Merge branch 'feature/donation-counter01'
This commit is contained in:
commit
99dc7f7e2b
|
@ -21,7 +21,7 @@ description: >- # this means to ignore newlines until "baseurl:"
|
|||
baseurl: "" # the subpath of your site, e.g. /blog
|
||||
url: "https://ulovliglogning.dk" # the base hostname & protocol for your site, e.g. http://example.com
|
||||
donationCounter:
|
||||
donated: 110000
|
||||
donated: 175000
|
||||
goal: 250000
|
||||
|
||||
# multilanguage support
|
||||
|
|
|
@ -12,5 +12,8 @@ global:
|
|||
langs:
|
||||
da: Dansk
|
||||
en: Engelsk
|
||||
mobilepayLink: https://mobilepay.dk/da-dk/pages/betal.aspx?phone=004540456&comment=Til%20kampen%20imod%20den%20Ulovlige%20Logning!&t=d
|
||||
|
||||
donation:
|
||||
text: doneret af
|
||||
currency: ",-"
|
||||
sub: Donationer opdateres pt. manuelt
|
||||
mobilepayLink: https://mobilepay.dk/da-dk/pages/betal.aspx?phone=004540456&comment=Til%20kampen%20imod%20den%20Ulovlige%20Logning!&t=d
|
|
@ -11,4 +11,8 @@ global:
|
|||
Write us an email at [info@ulovliglogning.dk](mailto:info@ulovliglogning.dk)
|
||||
langs:
|
||||
da: Danish
|
||||
en: English
|
||||
en: English
|
||||
donation:
|
||||
text: donated of
|
||||
currency: " DKK"
|
||||
sub: Donations are updated manually
|
|
@ -5,6 +5,12 @@ layout: default
|
|||
{% for section in page.sections %}
|
||||
<section id="{{ section.id }}" class="{% cycle 'odd', 'even' %}">
|
||||
{% if forloop.first %}
|
||||
<div class="donationCounter">
|
||||
<span>
|
||||
{{ site.donationCounter.donated | intcomma: '.' }}{{ global.donation.currency }} {{ global.donation.text }} {{ site.donationCounter.goal | intcomma: '.' }}{{ global.donation.currency }}
|
||||
<sub>{{ global.donation.sub }}</sub>
|
||||
</span>
|
||||
</div>
|
||||
<nav id="navElm">
|
||||
<div class="langSwitcher left">
|
||||
{% for tongue in site.languages %}
|
||||
|
|
257
_plugins/humanize.rb
Normal file
257
_plugins/humanize.rb
Normal file
|
@ -0,0 +1,257 @@
|
|||
module Jekyll
|
||||
|
||||
module Humanize
|
||||
##
|
||||
# This is a port of the Django app `humanize` which adds a "human touch"
|
||||
# to data. Given that Jekyll produces static sites, some of the original
|
||||
# methods do not make logical sense (e.g. naturaltime).
|
||||
#
|
||||
# Source code can be viewed here:
|
||||
# https://github.com/django/django
|
||||
#
|
||||
# Copyright (c) Django Software Foundation and individual contributors.
|
||||
# All rights reserved.
|
||||
|
||||
####################
|
||||
# PUBLIC METHODS #
|
||||
####################
|
||||
|
||||
def ordinal(value, flag=nil)
|
||||
##
|
||||
# Converts an integer to its ordinal as a string. 1 is '1st', 2 is '2nd',
|
||||
# 3 is '3rd', etc. Works for any integer.
|
||||
#
|
||||
# Usage:
|
||||
# {{ somenum }} >>> 3
|
||||
# {{ somenum | ordinal }} >>> '3rd'
|
||||
# {{ somenum | ordinal: "super" }} >>> '3<sup>rd</sup>'
|
||||
|
||||
begin
|
||||
value = value.to_i
|
||||
flag.to_s.downcase!
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return value
|
||||
end
|
||||
|
||||
suffix = ""
|
||||
suffixes = ["th", "st", "nd", "rd", "th", "th", "th", "th", "th", "th"]
|
||||
unless [11, 12, 13].include? value % 100 then
|
||||
suffix = suffixes[value % 10]
|
||||
else
|
||||
suffix = suffixes[0]
|
||||
end
|
||||
|
||||
unless flag and flag == "super"
|
||||
return "#{value}%s" % suffix
|
||||
else
|
||||
return "#{value}<sup>%s</sup>" % suffix
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
def intcomma(value, delimiter=",")
|
||||
##
|
||||
# Converts an integer to a string containing commas every three digits.
|
||||
# For example, 3000 becomes '3,000' and 45000 becomes '45,000'.
|
||||
# Optionally supports a delimiter override for commas.
|
||||
#
|
||||
# Usage:
|
||||
# {{ post.content | number_of_words }} >>> 12345
|
||||
# {{ post.content | number_of_words | intcomma }} >>> '12,345'
|
||||
# {{ post.content | number_of_words | intcomma: '.' }} >>> '12.345'
|
||||
|
||||
begin
|
||||
orig = value.to_s
|
||||
delimiter = delimiter.to_s
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return value
|
||||
end
|
||||
|
||||
copy = orig.strip
|
||||
copy = orig.gsub(/^(-?\d+)(\d{3})/, "\\1#{delimiter}\\2")
|
||||
orig == copy ? copy : intcomma(copy, delimiter)
|
||||
end
|
||||
|
||||
INTWORD_HELPERS = [
|
||||
[6, "million"],
|
||||
[9, "billion"],
|
||||
[12, "trillion"],
|
||||
[15, "quadrillion"],
|
||||
[18, "quintillion"],
|
||||
[21, "sextillion"],
|
||||
[24, "septillion"],
|
||||
[27, "octillion"],
|
||||
[30, "nonillion"],
|
||||
[33, "decillion"],
|
||||
[100, "googol"],
|
||||
]
|
||||
|
||||
def intword(value)
|
||||
##
|
||||
# Converts a large integer to a friendly text representation. Works best
|
||||
# for numbers over 1 million. For example, 1000000 becomes '1.0 million',
|
||||
# 1200000 becomes '1.2 million' and 1200000000 becomes '1.2 billion'.
|
||||
#
|
||||
# Usage:
|
||||
# {{ largenum }} >>> 1200000
|
||||
# {{ largenum | intword }} >>> '1.2 million'
|
||||
|
||||
begin
|
||||
value = value.to_i
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return value
|
||||
end
|
||||
|
||||
if value < 1000000
|
||||
return value
|
||||
end
|
||||
|
||||
for exponent, text in INTWORD_HELPERS
|
||||
large_number = 10 ** exponent
|
||||
|
||||
if value < large_number * 1000
|
||||
return "%#{value}.1f #{text}" % (value / large_number.to_f)
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
return value
|
||||
end
|
||||
|
||||
def apnumber(value)
|
||||
##
|
||||
# For numbers 0-9, returns the number spelled out. Otherwise, returns the
|
||||
# number. This follows Associated Press style.
|
||||
#
|
||||
# Usage:
|
||||
# {{ num }} >>> 6
|
||||
# {{ num | apnumber }} >>> six
|
||||
|
||||
begin
|
||||
value = value.to_i
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return value
|
||||
end
|
||||
|
||||
unless value >= 0 and value < 10 then
|
||||
return value
|
||||
else
|
||||
return ["zero", "one", "two", "three", "four", "five", "six",
|
||||
"seven", "eight", "nine"][value]
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
def naturalday(date)
|
||||
##
|
||||
# For date values that are within a 9 day stretch from present day, this
|
||||
# will attempt to return the string representation in the format of today,
|
||||
# tomorrow, yesterday, "in # days" or "# days ago". Otherwise, returns a
|
||||
# string formatted according to the "date_format" setting in your
|
||||
# _config.yml file using strftime format (if not defined, it will default
|
||||
# to "%m/%d/%Y").
|
||||
#
|
||||
# Usage:
|
||||
# TODAY == 01/26/2014
|
||||
# {{ post.updated }} >>> 01/25/2014
|
||||
# {{ post.updated | naturalday }} >>> 'yesterday'
|
||||
# {{ post.date }} >>> 01/19/2014
|
||||
# {{ post.date | naturalday }} >>> 'seven days ago'
|
||||
|
||||
begin
|
||||
site = @context.registers[:site]
|
||||
date_format = site.config['humanize']['date_format']
|
||||
date = time(date).to_date
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return date
|
||||
end
|
||||
|
||||
unless date_format then
|
||||
date_format = "%m/%d/%Y"
|
||||
end
|
||||
|
||||
today = time(Time.now).to_date
|
||||
delta = (date - today).to_i
|
||||
|
||||
case delta
|
||||
when 0
|
||||
return "today"
|
||||
when 1
|
||||
return "tomorrow"
|
||||
when 2..9
|
||||
delta = apnumber(delta)
|
||||
return "in #{delta} days"
|
||||
when -1
|
||||
return "yesterday"
|
||||
when -9..-2
|
||||
delta = apnumber(delta * -1)
|
||||
return "#{delta} days ago"
|
||||
else
|
||||
return date.strftime("#{date_format}")
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
def filesize(value)
|
||||
##
|
||||
# For filesize values in bytes, returns the number rounded to 3
|
||||
# decimal places with the correct suffix.
|
||||
#
|
||||
# Usage:
|
||||
# {{ bytes }} >>> 123456789
|
||||
# {{ bytes | filesize }} >>> 117.738 MB
|
||||
filesize_tb = 1099511627776.0
|
||||
filesize_gb = 1073741824.0
|
||||
filesize_mb = 1048576.0
|
||||
filesize_kb = 1024.0
|
||||
|
||||
begin
|
||||
value = value.to_f
|
||||
rescue Exception => e
|
||||
puts "#{e.class} #{e}"
|
||||
return value
|
||||
end
|
||||
|
||||
if value >= filesize_tb
|
||||
return "%s TB" % (value / filesize_tb).to_f.round(3)
|
||||
elsif value >= filesize_gb
|
||||
return "%s GB" % (value / filesize_gb).to_f.round(3)
|
||||
elsif value >= filesize_mb
|
||||
return "%s MB" % (value / filesize_mb).to_f.round(3)
|
||||
elsif value >= filesize_kb
|
||||
return "%s KB" % (value / filesize_kb).to_f.round(0)
|
||||
elsif value == 1
|
||||
return "1 byte"
|
||||
else
|
||||
return "%s bytes" % value.to_f.round(0)
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
#####################
|
||||
# PRIVATE METHODS #
|
||||
#####################
|
||||
|
||||
private
|
||||
def time(input)
|
||||
case input
|
||||
when Time
|
||||
input
|
||||
when String
|
||||
Time.parse(input)
|
||||
else
|
||||
Jekyll.logger.error "Invalid Date:", "'#{input}' not valid datetime."
|
||||
exit(1)
|
||||
end
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
Liquid::Template.register_filter(Jekyll::Humanize)
|
65
_scss/module/_donationCounter.scss
Normal file
65
_scss/module/_donationCounter.scss
Normal file
|
@ -0,0 +1,65 @@
|
|||
$donationCounter_percentFromGoal: 100 - ($donationCounter_donated / $donationCounter_goal * 100);
|
||||
|
||||
.donationCounter {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
font-size: 1.3rem;
|
||||
background: linear-gradient(to right, #49a540 50%, #407b3b 50%);
|
||||
position: absolute;
|
||||
background-size: 200%;
|
||||
background-position: 100%;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
animation: donationCounterSlideIn .5s cubic-bezier(0.175, 0.885, 0.32, 1.275) .5s forwards;
|
||||
|
||||
sub {
|
||||
display: block;
|
||||
font-size: .8rem;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
&:before, &:after {
|
||||
content: "";
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
&:before {
|
||||
background: linear-gradient(to left bottom, #2A2A2A 49%, transparent 50%);
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
background: linear-gradient(to left bottom, transparent 49%, #ff5802 50%);
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes donationCounterSlideIn {
|
||||
from {
|
||||
background-position: 100%;
|
||||
}
|
||||
|
||||
to {
|
||||
background-position: $donationCounter_percentFromGoal + unquote("%");
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(sm) {
|
||||
#intro {
|
||||
padding-bottom: 6rem;
|
||||
}
|
||||
.donationCounter {
|
||||
height: 80px;
|
||||
&:before, &:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,9 +1,23 @@
|
|||
.cta{display:none;}
|
||||
@media screen and (min-width: 1200px) and (orientation:landscape){
|
||||
#intro{position:relative;}
|
||||
.cta{display:inline;position:absolute;left:5%;bottom:15%;
|
||||
height:auto;width:200px;box-shadow:none;}
|
||||
.ctaTxt{display:none;}
|
||||
.cta {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1200px) and (orientation:landscape) {
|
||||
#intro {
|
||||
position: relative;
|
||||
}
|
||||
.cta {
|
||||
display: inline;
|
||||
position: absolute;
|
||||
left: 5%;
|
||||
bottom: 15%;
|
||||
height: auto;
|
||||
width: 200px;
|
||||
box-shadow: none;
|
||||
}
|
||||
.ctaTxt {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
|
@ -39,21 +53,25 @@ nav {
|
|||
}
|
||||
}
|
||||
}
|
||||
a, label:before, label:after {
|
||||
a,
|
||||
label:before,
|
||||
label:after {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
box-shadow: none;
|
||||
font-weight: normal;
|
||||
}
|
||||
.left, .right {
|
||||
.left,
|
||||
.right {
|
||||
flex: 1;
|
||||
}
|
||||
.right {
|
||||
text-align: right;
|
||||
input[type=checkbox]{
|
||||
input[type=checkbox] {
|
||||
display: none;
|
||||
}
|
||||
label:before, label:after {
|
||||
label:before,
|
||||
label:after {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -74,7 +92,7 @@ nav {
|
|||
padding: 3px;
|
||||
font-size: 30px;
|
||||
}
|
||||
input[type=checkbox]:checked ~ label {
|
||||
input[type=checkbox]:checked~label {
|
||||
&:before {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
@ -96,7 +114,7 @@ nav {
|
|||
border-top: 1px solid #424242;
|
||||
}
|
||||
}
|
||||
input[type=checkbox]:checked ~ ul {
|
||||
input[type=checkbox]:checked~ul {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
@ -140,13 +158,14 @@ nav {
|
|||
input[type="submit"] {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
color: #FFF;
|
||||
background: darken($background-alternative, 20);
|
||||
border-bottom: 2px solid darken($background-alternative, 25);
|
||||
}
|
||||
&:before, &:after {
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -173,4 +192,4 @@ section {
|
|||
//margin: 8rem 0 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,5 +1,9 @@
|
|||
---
|
||||
---
|
||||
//import Jekyll variables
|
||||
$donationCounter_donated: {{ site.donationCounter.donated }};
|
||||
$donationCounter_goal: {{ site.donationCounter.goal }};
|
||||
|
||||
// Import base styles
|
||||
@import "base/reset.scss";
|
||||
@import "base/variables";
|
||||
|
@ -13,4 +17,5 @@
|
|||
@import "module/flags.scss";
|
||||
@import "module/qa.scss";
|
||||
@import "module/sections.scss";
|
||||
@import "module/donationCounter.scss";
|
||||
@import "module/indexpage.scss";
|
||||
|
|
Loading…
Reference in a new issue