1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
|
# Copyright (c) 2013, 2014 Michele Bini
# This program is free software: you can redistribute it and/or modify
# it under the terms of the version 3 of the GNU General Public License
# as published by the Free Software Foundation.
# 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
# General Public License for more details.
# You should have received a copy of the GNU General Public License
# along with this program. If not, see <http://www.gnu.org/licenses/>.
{ htmlcup } = require 'htmlcup'
title = "Vaquitas need you!"
fs = require 'fs'
icon = "vaquita.ico"
icon = "data:image/x-icon;base64," + (new Buffer(fs.readFileSync(icon))).toString("base64")
htmlcup.html5Page ->
@head ->
@meta charset:"utf-8"
@link rel:"shortcut icon", href:icon
@title title
@style type: "text/css",
''''
body {
/* background:pink; */
/* background: #69B2FF; */
/* background: #21AFF8; */
/* background: #0286E8; */
background: #1096EE;
text-align: center;
font-size: 22px;
font-family: Helvetica;
}
.banner {
border: 5px solid white;
border: 5px solid white rgba(255,255,255,0.9);
box-shadow: 0 2px 4px blue;
margin: 1em;
}
p {
color:white;
color:rgba(255,255,255,0.9);
width:20em;
margin-top:0.418em;
margin-bottom:0.418em;
margin-left:auto;
margin-right:auto;
max-width:20em;
text-shadow: 0 1px 1px blue;
}
a {
/*
color:rgb(200,255,255);
color:rgba(200,255,255,0.9);
*/
color:white;
color:rgba(255,255,255,0.9);
text-decoration:none;
display: inline-block;
border: 1px solid white;
padding: 0 0.2em;
border-radius: 0.2em;
-moz-border-radius: 0.2em;
-webkit-border-radius: 0.2em;
-ie-border-radius: 0.2em;
}
a:hover {
background-color:rgba(20,70,180,1.0);
}
.petition {
margin:0.418em;
padding:0.618em;
}
.petition a {
font-size:127.2%;
box-shadow: 0 2px 4px blue;
margin:0.3em;
}
.centering {
display: table;
padding: 0;
width: 100%;
height: 100%;
}
.centered {
display: table-cell;
vertical-align: middle;
text-align: center;
}
@body ->
@div class:"centering", ->
@section class:"centered", ->
@div style:"display:inline-block", ->
@link rel:"shortcut icon", href:icon
@img class:"banner", src:"vaquita1.jpg", title:"This vaquita was set free by a mysterious artist who prefers to stay anonymous ☺"
@section style:"display:inline-block", ->
@p "Please don't kill this baby!"
@p "Vaquitas are the smallest and rarest marine cetacean; they are mammalians like us."
@p ->
@span "Their population has decreased from an estimated 576 in 1997 to 97 individuals in 2014, which means that could be extinct as early as 2017"
@p "A really protected marine sactuary is Vaquitas' only chance of survival; each year literally tens of them die in fishing nets and cages; according to recent research, this is because of the illegal fishing of Totoaba"
@p "Vaquitas only live in a small stretch in the Gulf of California and share their habitat with the Totoaba"
@p class:"petition", ->
@span 'Petition you can sign: '
@a href: 'http://www.thepetitionsite.com/569/482/287/extend-protections-for-critically-endangered-vaquita-porpoises/', "Extend Protections for Critically Endangered Vaquita Porpoises"
@p ->
@a href: 'http://www.youtube.com/watch?v=27pJ2S5RT8g', "Commemorative video of a baby Vaquita"
|
