summaryrefslogtreecommitdiff
path: root/pages/assets
diff options
context:
space:
mode:
authorelijah <elijah@riseup.net>2014-08-19 01:05:24 -0700
committerelijah <elijah@riseup.net>2014-08-19 01:05:24 -0700
commit8e218361e7f7e337ddbe26872e811d3facbb2d92 (patch)
tree0528ecc74174dc8203c37adafae031849ee6a60b /pages/assets
parent0b3116fead8bd5a1033f2e47e6354d284613a6d8 (diff)
first presentable version
Diffstat (limited to 'pages/assets')
-rw-r--r--pages/assets/content.scss55
-rw-r--r--pages/assets/icons/22/off.pngbin0 -> 542 bytes
-rw-r--r--pages/assets/icons/22/on.pngbin0 -> 519 bytes
-rw-r--r--pages/assets/icons/22/question.pngbin0 -> 562 bytes
-rw-r--r--pages/assets/icons/22/vpn_connected.pngbin0 -> 393 bytes
-rw-r--r--pages/assets/icons/22/vpn_disconnected.pngbin0 -> 534 bytes
-rw-r--r--pages/assets/icons/22/vpn_progress.pngbin0 -> 465 bytes
-rw-r--r--pages/assets/icons/22/wait.pngbin0 -> 596 bytes
-rw-r--r--pages/assets/providers/calyx.net.pngbin0 -> 44874 bytes
-rw-r--r--pages/assets/providers/demo.bitmask.net.pngbin0 -> 49412 bytes
-rw-r--r--pages/assets/providers/oblivia.svg73
-rw-r--r--pages/assets/providers/oblivia.vc.pngbin0 -> 8282 bytes
-rw-r--r--pages/assets/providers/riseup.net.pngbin0 -> 11266 bytes
-rw-r--r--pages/assets/style.scss156
14 files changed, 188 insertions, 96 deletions
diff --git a/pages/assets/content.scss b/pages/assets/content.scss
new file mode 100644
index 0000000..59dd01c
--- /dev/null
+++ b/pages/assets/content.scss
@@ -0,0 +1,55 @@
+//
+// These styles are helpers for better formatting content
+//
+
+//
+// VPN Status Icons
+//
+
+li.status-icon {
+ padding-left: 32px;
+ background-repeat: no-repeat;
+ background-position: 0 -2px;
+ list-style-type: none;
+ margin: 1em;
+ & li {
+ list-style-type: none;
+ }
+ & ul {
+ margin-top: 1em
+ }
+}
+
+li.android-on {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/vpn_connected.png);
+}
+li.android-wait {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/vpn_progress.png);
+}
+li.android-off {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/vpn_disconnected.png);
+}
+
+li.desktop-on {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/on.png);
+}
+li.desktop-wait {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/wait.png);
+}
+li.desktop-off {
+ @extend li.status-icon;
+ background-image: url(/assets/icons/22/off.png);
+}
+
+//
+// GENERAL UTILITY
+//
+
+ul.spaced li {
+ margin-bottom: 15px;
+} \ No newline at end of file
diff --git a/pages/assets/icons/22/off.png b/pages/assets/icons/22/off.png
new file mode 100644
index 0000000..65afeef
--- /dev/null
+++ b/pages/assets/icons/22/off.png
Binary files differ
diff --git a/pages/assets/icons/22/on.png b/pages/assets/icons/22/on.png
new file mode 100644
index 0000000..229140a
--- /dev/null
+++ b/pages/assets/icons/22/on.png
Binary files differ
diff --git a/pages/assets/icons/22/question.png b/pages/assets/icons/22/question.png
new file mode 100644
index 0000000..bb259fa
--- /dev/null
+++ b/pages/assets/icons/22/question.png
Binary files differ
diff --git a/pages/assets/icons/22/vpn_connected.png b/pages/assets/icons/22/vpn_connected.png
new file mode 100644
index 0000000..3428947
--- /dev/null
+++ b/pages/assets/icons/22/vpn_connected.png
Binary files differ
diff --git a/pages/assets/icons/22/vpn_disconnected.png b/pages/assets/icons/22/vpn_disconnected.png
new file mode 100644
index 0000000..c524307
--- /dev/null
+++ b/pages/assets/icons/22/vpn_disconnected.png
Binary files differ
diff --git a/pages/assets/icons/22/vpn_progress.png b/pages/assets/icons/22/vpn_progress.png
new file mode 100644
index 0000000..2a7ad45
--- /dev/null
+++ b/pages/assets/icons/22/vpn_progress.png
Binary files differ
diff --git a/pages/assets/icons/22/wait.png b/pages/assets/icons/22/wait.png
new file mode 100644
index 0000000..c267363
--- /dev/null
+++ b/pages/assets/icons/22/wait.png
Binary files differ
diff --git a/pages/assets/providers/calyx.net.png b/pages/assets/providers/calyx.net.png
new file mode 100644
index 0000000..7d682c4
--- /dev/null
+++ b/pages/assets/providers/calyx.net.png
Binary files differ
diff --git a/pages/assets/providers/demo.bitmask.net.png b/pages/assets/providers/demo.bitmask.net.png
new file mode 100644
index 0000000..580bbac
--- /dev/null
+++ b/pages/assets/providers/demo.bitmask.net.png
Binary files differ
diff --git a/pages/assets/providers/oblivia.svg b/pages/assets/providers/oblivia.svg
new file mode 100644
index 0000000..4190b78
--- /dev/null
+++ b/pages/assets/providers/oblivia.svg
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ id="svg2"
+ version="1.1"
+ inkscape:version="0.48.4 r9939"
+ width="256"
+ height="256"
+ sodipodi:docname="0.png"
+ inkscape:export-filename="/home/elijah/dev/leap/bitmask_help/pages/assets/providers/oblivia.vc.png"
+ inkscape:export-xdpi="90"
+ inkscape:export-ydpi="90">
+ <metadata
+ id="metadata8">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title></dc:title>
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs6" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1374"
+ inkscape:window-height="840"
+ id="namedview4"
+ showgrid="false"
+ inkscape:zoom="1.2040816"
+ inkscape:cx="88.774975"
+ inkscape:cy="199.49038"
+ inkscape:window-x="53"
+ inkscape:window-y="24"
+ inkscape:window-maximized="0"
+ inkscape:current-layer="svg2" />
+ <rect
+ style="fill:#fcfbeb;fill-opacity:1;stroke:none;stroke-width:1.50000000000000000;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
+ id="rect3764"
+ width="256"
+ height="256"
+ x="0"
+ y="1.0338984" />
+ <path
+ style="fill:#2983de;fill-opacity:1"
+ d="m 125.3735,26.556148 c -13.39021,0.009 -26.821483,1.183338 -30.519163,3.525316 -1.334415,0.845175 -3.988643,1.849077 -5.909102,2.249488 -1.920458,0.40041 -3.491742,1.176268 -3.491742,1.712296 0,0.53603 -1.571283,1.613997 -3.491742,2.41736 -7.796469,3.261405 -25.349757,23.675489 -27.262447,31.694277 -0.376378,1.577924 -1.193284,3.486467 -1.779445,4.23038 -0.586151,0.743902 -1.986478,4.611678 -3.122423,8.595057 -1.135933,3.983369 -2.923726,9.119958 -3.290295,11.549608 -4.029513,26.70821 -4.875654,48.10023 0,71.9836 0.491476,2.4075 2.154362,7.56624 3.290295,11.54961 1.152288,4.43987 3.664363,8.38997 5.317122,12.37661 7.455036,15.341 31.314969,38.7415 49.476362,41.0739 16.30012,2.09336 45.97226,0.6112 50.96602,-2.55166 1.33441,-0.84518 3.96233,-1.85805 5.84195,-2.24949 1.87963,-0.39144 3.99633,-1.4011 4.70042,-2.24948 0.7041,-0.84839 1.73566,-1.54443 2.31664,-1.54443 2.91964,0 16.62555,-13.33135 22.09198,-21.48764 4.33586,-6.46939 8.4412,-15.39018 10.03876,-21.89054 0.56341,-2.29245 1.47657,-5.04273 2.04804,-6.11055 5.83485,-10.90243 5.86228,-74.891657 0.0335,-85.78269 -0.58469,-1.092507 -1.51821,-3.851671 -2.08161,-6.144123 -4.75272,-19.33842 -25.19892,-43.755599 -39.61785,-47.306393 -1.62161,-0.399339 -3.9722,-1.351941 -5.20403,-2.148764 -3.6129,-2.337046 -16.9611,-3.500777 -30.35131,-3.491742 z m -1.74587,19.909644 c 4.38002,-0.06957 8.9449,0.420751 13.73195,1.443701 34.51484,7.375521 52.19619,54.037857 42.13593,111.232127 -1.60986,9.15234 -4.8811,19.21739 -6.88276,21.21905 -0.66769,0.66769 -1.20868,1.7674 -1.20868,2.41735 0,0.64995 -2.13982,4.1444 -4.76757,7.7557 -6.76816,9.30145 -18.03938,16.49663 -29.07547,18.60024 -9.70086,1.84909 -7.88846,2.29879 -18.73454,1.14153 -7.06675,-1.70605 -14.17754,-3.41612 -19.070284,-6.54701 -3.654135,0 -16.429495,-15.44005 -21.319771,-25.78517 C 64.370505,148.18757 66.530422,87.970016 82.33107,68.960672 94.743644,54.027431 107.98469,46.714231 123.62763,46.465792 z"
+ id="path2993"
+ inkscape:connector-curvature="0"
+ sodipodi:nodetypes="csssssssssccssssssssssssccsssssssccsss" />
+ <path
+ style="fill:#000000"
+ d="m 113.77558,172.94719 c -2.2321,-1.954 -2.25024,-2.25189 -0.93908,-15.42226 3.31135,-33.26172 3.3518,-32.49989 -2.04876,-38.58062 -13.354563,-15.03653 -4.11591,-36.054456 15.78588,-35.912831 19.30559,0.137381 27.46353,22.551931 13.45978,36.981821 -4.94633,5.09686 -4.8679,2.79208 -1.21405,35.67722 1.35944,12.23501 1.47331,16.18545 0.49477,17.164 -2.35855,2.35854 -22.86517,2.43297 -25.53854,0.0927 z"
+ id="path2987"
+ inkscape:connector-curvature="0" />
+</svg>
diff --git a/pages/assets/providers/oblivia.vc.png b/pages/assets/providers/oblivia.vc.png
new file mode 100644
index 0000000..e9bd97a
--- /dev/null
+++ b/pages/assets/providers/oblivia.vc.png
Binary files differ
diff --git a/pages/assets/providers/riseup.net.png b/pages/assets/providers/riseup.net.png
new file mode 100644
index 0000000..2772a3f
--- /dev/null
+++ b/pages/assets/providers/riseup.net.png
Binary files differ
diff --git a/pages/assets/style.scss b/pages/assets/style.scss
index b1618ae..c4a7091 100644
--- a/pages/assets/style.scss
+++ b/pages/assets/style.scss
@@ -1,52 +1,5 @@
-// note: css paths are always relative to the css file
-
-
-$masthead-large-img: '/assets/images/rainbow-masthead-large.png';
-$masthead-large-height: 200px;
-$masthead-medium-img: '/assets/images/rainbow-masthead-medium.png';
-$masthead-medium-height: 130px;
-$masthead-small-img: '/assets/images/rainbow-masthead-small.png';
-$masthead-small-height: 80px;
-$masthead-background-color: #5e9ee3;
-
-$gutter: 15px;
-$background-color: #333;
-$menu-text-color: #fff;
-$menu-padding: 8px 18px;
-//$menu-shadow-size: 1px;
-//$menu-shadow-blur: 2px;
-//$menu-shadow-color: #000;
-$content-border-color: #000;
-$content-background-color: #fff;
-$content-shadow-color: #000;
-$content-shadow-size: 1px;
-$content-shadow-blur: 8px;
-$title-background-color: #efefef;
-$title-divider-color: #ccc;
-$footer-height: 50px;
-$footer-gutter: 20px;
-$footer-background-color: #666;
-$footer-color: #ddd;
-$footer-border-width: 1px;
-$footer-border-color: darken($background-color, 5%);
-$footer-shadow: true;
-$footer-shadow-color: #333;
-$footer-shadow-size: 1px;
-$footer-shadow-blur: 6px;
-$navigation-item-active-background-color: #999;
-$navigation-item-active-color: #000;
-$navigation-item-background-color: #ccc;
-$navigation-item-color: #666;
-$navigation-border: 1px solid #333;
-$navigation-shadow: 1px 1px 4px #111;
-$link-color: darken($masthead-background-color, 15%);
-$link-visited-color: darken($masthead-background-color, 25%);
-
-$home-light-color: #333;
-$home-light-background-color: #eee;
-
-$home-dark-color: #fff;
-$home-dark-background-color: $background-color;
+@import "variables.scss";
+@import "content.scss";
//
// TYPOGRAPHY
@@ -87,6 +40,10 @@ h2.hidey {
margin: 0;
}
+h4 {
+ margin-top: 20px;
+}
+
//.h3 {
// @extend h3;
// margin: 0;
@@ -171,14 +128,14 @@ body.home #masthead .text {
body.home #masthead .text {
height: $masthead-large-height/2;
&.bottom {
- font-size: 20px;
- line-height: 30px !important;
+ font-size: 18px;
+ line-height: 28px !important;
}
}
// medium masthead
-@media (max-width: 992px) {
+@media (max-width: 767px) {
#masthead {
background: $masthead-background-color url(#{$masthead-medium-img}) 50% 50%;
.masthead-inner {
@@ -193,8 +150,8 @@ body.home #masthead .text {
body.home #masthead .text {
height: $masthead-medium-height/2;
&.bottom {
- font-size: 14px;
- line-height: 24px !important;
+ font-size: 10px;
+ line-height: 19px !important;
}
}
}
@@ -202,29 +159,29 @@ body.home #masthead .text {
// small masthead
-@media (max-width: 767px) {
- #masthead {
- background: $masthead-background-color url(#{$masthead-small-img}) 50% 50%;
- .masthead-inner {
- height: $masthead-small-height;
- .text {
- padding-left: 1px;
- font-size: 30px;
- line-height: $masthead-small-height;
- }
- }
- }
- body.home #masthead .text {
- height: $masthead-small-height/2;
- &.bottom {
- font-size: 9px;
- line-height: 14px !important;
- span {
- padding: 2px;
- }
- }
- }
-}
+// @media (max-width: 767px) {
+// #masthead {
+// background: $masthead-background-color url(#{$masthead-small-img}) 50% 50%;
+// .masthead-inner {
+// height: $masthead-small-height;
+// .text {
+// padding-left: 1px;
+// font-size: 30px;
+// line-height: $masthead-small-height;
+// }
+// }
+// }
+// body.home #masthead .text {
+// height: $masthead-small-height/2;
+// &.bottom {
+// font-size: 9px;
+// line-height: 14px !important;
+// span {
+// padding: 2px;
+// }
+// }
+// }
+// }
#top-menu {
position: absolute;
@@ -239,7 +196,7 @@ body.home #masthead .text {
color: $menu-text-color;
font-size: 14px;
line-height: 20px;
- background-color: rgba(0,0,0,0.25);
+ background-color: $menu-background-color;
}
a.active {
background-color: $background-color;
@@ -250,7 +207,7 @@ body.home #masthead .text {
@media only screen and (max-width: 767px) {
#top-menu a {
- padding: 5px 6px;
+ padding: 2px 6px;
font-size: 12px;
}
}
@@ -396,6 +353,28 @@ html, body {
//
body.home {
+ .content-box {
+ padding: 20px;
+ }
+ .heading {
+ i {
+ padding-right: 10px;
+ }
+ span {
+ color: #003;
+ }
+ margin: 20px 0 15px 0;
+ font-size: 26px;
+ }
+ .thumbnail {
+ word-break: break-all;
+ .b {
+ font-size: 16px;
+ }
+ }
+ p.big {
+ font-size: 16px;
+ }
.download a {
color: white !important;
font-size: 16px;
@@ -405,15 +384,9 @@ body.home {
display: inline-block;
}
}
- .pad {
- margin: 15px 0;
- }
.light, .dark, .lighter, .darker {
padding-top: 15px;
padding-bottom: 15px;
- //ul {
- // padding-left: 15px;
- //}
}
.dark, .darker {
color: $home-dark-color;
@@ -426,20 +399,13 @@ body.home {
}
}
.dark {
- //color: darken($home-dark-color, 20%);
- background-color: lighten($home-dark-background-color, 10%);
+ background-color: lighten($home-dark-background-color, 5%);
}
.light, .lighter {
color: $home-light-color;
background-color: $home-light-background-color;
- .h2 span {
- //background: red;
- //color: white;
- //padding: 4px;
- }
}
.light {
- //color: darken($home-light-color, 20%);
background-color: lighten($home-light-background-color, 20%);
}
.b {
@@ -451,7 +417,5 @@ body.home {
ul.fa-ul {
margin-left: 22px;
}
- ul.spaced li {
- margin-bottom: 15px;
- }
}
+