From a25552d8e0439cee8ae3a6908feeb393ad9d8c50 Mon Sep 17 00:00:00 2001 From: elijah Date: Fri, 1 Aug 2014 09:59:55 -0700 Subject: merged in bitmask_net files --- pages/assets/images/leap-small.png | Bin 0 -> 10100 bytes pages/assets/rainbow-masthead-large.png | Bin 0 -> 35946 bytes pages/assets/style.scss | 137 +++++++++++++++++++++++--------- pages/en.haml | 18 +++++ pages/en.text | 4 - pages/home/_intro.text | 1 + pages/home/_text.haml | 101 +++++++++++++++++++++++ 7 files changed, 220 insertions(+), 41 deletions(-) create mode 100644 pages/assets/images/leap-small.png create mode 100644 pages/assets/rainbow-masthead-large.png create mode 100644 pages/en.haml delete mode 100644 pages/en.text create mode 100644 pages/home/_intro.text create mode 100644 pages/home/_text.haml (limited to 'pages') diff --git a/pages/assets/images/leap-small.png b/pages/assets/images/leap-small.png new file mode 100644 index 0000000..bc9d4e7 Binary files /dev/null and b/pages/assets/images/leap-small.png differ diff --git a/pages/assets/rainbow-masthead-large.png b/pages/assets/rainbow-masthead-large.png new file mode 100644 index 0000000..2724cec Binary files /dev/null and b/pages/assets/rainbow-masthead-large.png differ diff --git a/pages/assets/style.scss b/pages/assets/style.scss index 0ba7bb4..e03b21b 100644 --- a/pages/assets/style.scss +++ b/pages/assets/style.scss @@ -2,9 +2,12 @@ $masthead-img: '/assets/rainbow-masthead-medium.png'; $masthead-background-color: #5e9ee3; $masthead-height: 128px; +$masthead-large-img: '/assets/rainbow-masthead-large.png'; +$masthead-large-height: 190px; $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; @@ -34,6 +37,12 @@ $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; + // // TYPOGRAPHY // @@ -55,6 +64,22 @@ h2.hidey { z-index: -1000; } +.h1 { + @extend h1; + margin: 0; +} + +.h2 { + @extend h2; + margin: 0; +} + +//.h3 { +// @extend h3; +// margin: 0; +//} + + // // DESIGN ELEMENTS // @@ -86,14 +111,13 @@ h2.hidey { .masthead-inner { height: $masthead-height; .text { - //outline: 1px solid red; color: black; margin-left: 50%; width: 50%; font-size: 40px; font-weight: bold; font-family: Helvetica,Arial,sans-serif; - height: 64px; + height: $masthead-height / 2; &.top { line-height: 100px; } @@ -104,6 +128,31 @@ h2.hidey { } } +#masthead.large { + background: $masthead-background-color url(#{$masthead-large-img}) 50% 50%; + height: $masthead-large-height; + .masthead-inner { + height: $masthead-large-height; + .text { + height: $masthead-large-height / 2; + padding-left: 4px; + &.top { + font-size: 70px; + line-height: 130px; + } + &.bottom { + font-size: 18px; + line-height: 28px; + font-weight: normal; + span { + background: rgba(255,255,255,0.5); + padding: 4px; + } + } + } + } +} + #top-menu { position: absolute; bottom: 0px; @@ -113,11 +162,11 @@ h2.hidey { } a { display: block; - padding: 5px 14px; + padding: $menu-padding; color: $menu-text-color; font-size: 14px; line-height: 20px; - background-color: rgba(0,0,0,0.15); + background-color: rgba(0,0,0,0.25); } a.active { background-color: $background-color; @@ -270,46 +319,60 @@ html, body { } // -// FRONT PAGE +// HOME PAGE // -.logo { - min-height: 87px; - padding-left: 280px; - padding-top: 10px; - background: url(images/riseup-rainbow.png) no-repeat; -} -@media only screen and (max-width: 590px) { - .logo { - padding-left: 94px; - padding-top: 65px; +body.home { + .download a { + color: white !important; + font-size: 16px; + i, span { + line-height: 35px; + vertical-align: middle; + display: inline-block; + } } -} - -.feed { - border: 1px dotted #ccc; - - .item { - border-top: 1px dotted #ccc; - padding: $gutter; - .label { - font-size: 1em; + .pad { + margin: 8px 0; + } + .light, .dark, .lighter, .darker { + padding-top: 15px; + padding-bottom: 15px; + ul { + padding-left: 15px; } - .date { - font-style: italic; - line-height: 2em; + } + .dark, .darker { + color: $home-dark-color; + background-color: $home-dark-background-color; + a { + color: lighten($link-color, 30%); } - .text { - + a:visited { + color: lighten($link-visited-color, 30%); } } - - h2 { + .dark { + //color: darken($home-dark-color, 20%); + background-color: lighten($home-dark-background-color, 10%); + } + .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 { font-weight: bold; - font-size: 1.1em; - line-height: 1.5em; - padding: $gutter; - margin: 0; - background: #f9f9f9; + } + .introtext { + font-size: 1.5em; } } diff --git a/pages/en.haml b/pages/en.haml new file mode 100644 index 0000000..43f22e5 --- /dev/null +++ b/pages/en.haml @@ -0,0 +1,18 @@ +- @toc = false +- @title = 'Home' +- @this.layout = 'home' + +.darker + .container + .row + .col-sm-9 + .introtext + = render 'home/intro' + .col-sm-3 + .download.text-left + %a.btn.btn-large.btn-primary{:href => 'install'} + %i.fa.fa-cloud-download.fa-2x + %span + = t :download_bitmask + += render 'home/text' diff --git a/pages/en.text b/pages/en.text deleted file mode 100644 index ffabf41..0000000 --- a/pages/en.text +++ /dev/null @@ -1,4 +0,0 @@ -@title = 'Home' - -Bitmask help pages to go here. - diff --git a/pages/home/_intro.text b/pages/home/_intro.text new file mode 100644 index 0000000..b1f6379 --- /dev/null +++ b/pages/home/_intro.text @@ -0,0 +1 @@ +*Bitmask* is an open source application to provide easy and secure encrypted communication. You can choose among "several different service providers":#providers or "start your own":https://leap.se/en/doc/platform. Currently, Bitmask supports encrypted internet and encrypted email (with more services in the works). \ No newline at end of file diff --git a/pages/home/_text.haml b/pages/home/_text.haml new file mode 100644 index 0000000..ce27db7 --- /dev/null +++ b/pages/home/_text.haml @@ -0,0 +1,101 @@ +.lighter + .container + .row + .col-sm-12 + %h1#features Features + + %p The Bitmask application is designed to have a friendly interface with automatic configuration. You simply start the application, register with the compatible service provider of your choice, and away you go. + +.lighter + .container + .row + .col-sm-2.text-right + .h2 + %i.fa.fa-shield.fa-3x + .col-sm-10.text-left + .h2 + %span< Encrypted Internet Proxy + %p.pad With Encrypted Internet Proxy (EIP) all your traffic is encrypted and routed through your provider before it is decrypted and sent on to the open internet. + %ul + %li Block Monitoring: EIP is very effective at bypassing most censorship and network surveillance by your ISP or country. + %li Anonymous IP: EIP also hides your IP address, keeping your physical location safe from nefarious websites. + %li Extra Security: We take extra security measures to prevent problems common to VPN, such as DNS leakage and IPv6 leakage. + +.lighter + .container + .row + .col-sm-2.text-right + .h2 + %i.fa.fa-envelope.fa-2x + .col-sm-10.text-left + .h2 + %span Encrypted Email + %p.pad Bitmask Encrypted Email is easy to use while still being backward compatible with the existing OpenPGP protocol for secure email. + %ul + %li Secure Email Storage: All incoming email is automatically encrypted so only you can read it (including meta-data). + %li Automatic Key Management: If possible, outgoing email is automatically encrypted so that only the recipient can read it (if a valid OpenPGP public key can be automatically discovered and validated for the recipient). + +.dark + .container + .row + .col-sm-12 + %h1#security Security + %ul + %li + Client encrypted storage: + All data storage is encrypted, including local data and cloud backups. This encryption always [[takes place on your device => https://leap.se/en/soledad]], so the service provider cannot read your stored data. + %li *Availability*: Your data is always available and [[synchronized to the devices => https://leap.se/en/soledad]] you choose. + %li *Passwords, Improved*: Although you specify a username and password to login, your [[password is never communicated to the provider => https://en.wikipedia.org/wiki/Secure_Remote_Password_protocol]]. + %li *Up to date*: The Bitmask application is always kept up to date with the latest security patches (coming soon). + %li *Don't trust the provider*: If you download the Bitmask application from [[dl.bitmask.net => https://dl.bitmask.net]], your service provider cannot add a backdoor to compromise your security. + %p As with any security system, Bitmask has [[known limitations => https://leap.se/en/limitations]]. For technical details, see our [[design documentation' => 'https://leap.se/en/design]]. + +.light + .container + .row + .col-sm-12 + %h1#providers Supported providers + + %p The following service providers are compatible with the Bitmask application: + + %ul + %li= link 'demo.bitmask.net' => 'https://demo.bitmask.net' + %li + = link 'calyx.net' => 'https://calyx.net' + %li + = link 'oblivia.vc' => 'https://oblivia.vc' + (coming soon) + %li + = link 'riseup.net' => 'https://riseup.net' + + + %p Start your own compatible service provider with the free software #{link 'LEAP platform' => 'https://leap.se/en/platform'}. + +.darker + .container + .row + .col-sm-6 + %h1#code Fork our code + + %p Hey, you! We could use a hand here. You want communication free of surveillance, based on open protocols, and that gives users control over their own data? Well, grab a keyboard and #{link 'pitch in' => 'https://leap.se/en/get-involved'}—the code is not going to write itself. + + %p In particular, if you have finely honed skill in Python, Android Java, Ruby, C, CouchDB, Windows, Mac, Puppet, Qt, or you really love crypto, we could sure use your help. + + %ol + %li #{link 'Fork our code' => 'https://leap.se/en/source'}. + %li Create a new branch from develop called feature/x or bugfix/x. + %li Hack away. + %li Issue a pull request on github from your feature or bugfix branch to the upstream develop branch. + %li Discuss and wait for request to be merged. + %li Repeat. + + %p Currently, we release a new version of the Bitmask application every two weeks, and other components as necessary. + + .col-sm-6 + %h1#about-us About us + + %img{src:'/assets/images/leap-small.png', align:'right'} + + %p The Bitmask application is lovingly hand-crafted by a team of paid and volunteer programmers from seven different countries. Development is principally sponsored by the #{link 'LEAP Encryption Access Project' => 'https://leap.se'}, an non-profit organization dedicated to defending democracy by protecting the right to whisper. + + %p The service provider bitmask.net is operated by LEAP in order to demonstrate usage of the Bitmask application. However, we actively encourage other organizations to start their own compatible service providers by using our free software #{link 'platform for server automation' => 'https://leap.se/en/platform'}. -- cgit v1.2.3