commit ad3fb42d35538762b7bef40a57a259b1dd175095 Author: hiro hiro@torproject.org Date: Tue Nov 6 19:49:13 2018 +0100
Add possibility to close banner --- css/layout.css | 30 +++++++++++++ css/layout.min.css | 30 +++++++++++++ en/banner2.wmi | 4 +- en/index.wml | 42 +++++++++++++++++- include/head-index.wmi | 116 +++++++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 220 insertions(+), 2 deletions(-)
diff --git a/css/layout.css b/css/layout.css index 3d6453c2..4b18d223 100644 --- a/css/layout.css +++ b/css/layout.css @@ -1533,3 +1533,33 @@ mark { font-size-adjust: 0.7; line-height: 1.5em; } + +/* Checkbox Hack */ + +input[type=checkbox] { + position: absolute; + top: -9999px; + left: -9999px; +} + +label { + -webkit-appearance: push-button; + -moz-appearance: button; + display: inline-block; + cursor: pointer; + color: white; + float: right; + font-weight: bold; + padding-right: 5px; + padding-top: 5px; +} + +#eoy-banner { + visibility: visible; +} + +/* Toggled State */ +input[type=checkbox]:checked ~ div#eoy-banner { + visibility: hidden; + display: none; +} diff --git a/css/layout.min.css b/css/layout.min.css index 17969bb5..130283a0 100644 --- a/css/layout.min.css +++ b/css/layout.min.css @@ -132,3 +132,33 @@ mark { font-size-adjust: 0.7; line-height: 1.5em; } + +/* Checkbox Hack */ + +input[type=checkbox] { + position: absolute; + top: -9999px; + left: -9999px; +} + +label { + -webkit-appearance: push-button; + -moz-appearance: button; + display: inline-block; + cursor: pointer; + color: white; + float: right; + font-weight: bold; + padding-right: 5px; + padding-top: 5px; +} + +#eoy-banner { + visibility: visible; +} + +/* Toggled State */ +input[type=checkbox]:checked ~ div#eoy-banner { + visibility: hidden; + display: none; +} diff --git a/en/banner2.wmi b/en/banner2.wmi index 3504994b..d21cc17d 100644 --- a/en/banner2.wmi +++ b/en/banner2.wmi @@ -1,4 +1,6 @@ -<div class="eoy-background-2 align-center"> +<label for="toggle-1">x</label> +<input type="checkbox" id="toggle-1"> +<div id="eoy-banner" class="eoy-background-2 align-center"> <div class="eoy-wrap align-center"> <div class="eoy-message-2 align-center"> <div class="tor-strength-in-num green align-center"> diff --git a/en/index.wml b/en/index.wml index f99eeed5..73d1e6e0 100644 --- a/en/index.wml +++ b/en/index.wml @@ -1,8 +1,48 @@ ## translation metadata # Revision: $Revision$ # Translation-Priority: 1-high +<define-tag viewport whitespace=delete> +<meta name="viewport" content="width\=device-width, initial-scale=1"> +</define-tag> +<!DOCTYPE html> + <html> + <head> + + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <viewport> + <meta name="author" content="The Tor Project, Inc."> + <meta name="description" content="The Tor Project's free software protects your privacy online. Site blocked? Email [mailto:gettor@torproject.org] for help downloading Tor Browser."> + <meta name="keywords" content="tor, tor project, tor browser, avoid censorship, traffic analysis, anonymous communications, privacy, avoid surveillance, online security, anonymous online, private browsing, anonymity online, online privacy, protect privacy, private mac browser, private windows browser, private android browser, linux browser, anonymity network, tor network, onion router, onion browser"> + <meta property="og:image" content="https://www.torproject.org/images/tor-logo.jpg"> +{#meta#} + + <title>$(TITLE)</title> + + <link rel="icon" href="$(IMGROOT)/favicon.ico"> + <ifneq "$(REDIRECT)" "" "<meta http-equiv="refresh" content="0;url=$(DOCROOT)/$(REDIRECT)">"> + <ifneq "$(REDIRECT_GLOBAL)" "" "<meta http-equiv="refresh" content="0;url=$(REDIRECT_GLOBAL)">"> + + # begin WML to generate css/js paths + <ifneq "$(STYLESHEET)" "" "<link href="$(DOCROOT)/$(STYLESHEET)" rel="stylesheet">"> + <ifeq "$(STYLESHEET)" "" "<link href="$(DOCROOT)/css/master.min.css" rel="stylesheet">"> + + #<link href="css/master.min.css" rel="stylesheet"> + <!--[if lte IE 8]> + <link href="$(DOCROOT)/css/ie8-and-down.min.css" rel="stylesheet"> + <![endif]--> + <!--[if lte IE 7]> + <link href="$(DOCROOT)/css/ie7-and-down.min.css" rel="stylesheet"> + <![endif]--> + <!--[if IE 6]> + <link href="$(DOCROOT)/css/ie6.min.css" rel="stylesheet"> + <![endif]--> + # <script language="javascript" type="text/javascript" src="$(DOCROOT)/global.js"></script> + # end WML to generate css/js paths +</head> +<body> #include "banner2.wmi" -#include "head.wmi" TITLE="Tor Project | Privacy Online" CHARSET="UTF-8" +#include "head-index.wmi" TITLE="Tor Project | Privacy Online" CHARSET="UTF-8" <div id="home"> <div id="content" class="clearfix"> <div id="maincol"> diff --git a/include/head-index.wmi b/include/head-index.wmi new file mode 100644 index 00000000..e491a844 --- /dev/null +++ b/include/head-index.wmi @@ -0,0 +1,116 @@ +#! /usr/bin/wml +<: use strict; :> +<: use warnings; :> +#use "perl-globals.wmi" +#use "links.wmi" +#use "versions.wmi" +#use "navigation.wmi" + + +<div id="wrap"> + <div id="header"> + <h1 id="logo"><a href="<page index>">Tor</a></h1> + # navigation menu generation + <div id="nav"> + <ul> + <:{ + # create a hash and maintain order of keys + my %navigation; + my @keys; + while (@navigation) { + my $key = shift @navigation; + my $val = shift @navigation; + push @keys, $key; + $navigation{$key} = $val; + } + + my $page = $WML_SRC_BASENAME; + my $lang = "$(LANG)"; + + for my $key (@keys) { + my ($dir, $base) = $key =~ m,^(?:(.*)/)?(.*?)$,; + + # in directory of active link, set class active. This rule should be improved with proper structuring of the links. + my $class; + if ((index($page, 'contact') ne -1) and (index($base, 'overview') ne -1)) { + $class = ''; + } elsif ((defined $dir) and ($WML_SRC_DIRNAME =~/$dir/) and (index($key, 'contact') eq -1) or ($WML_SRC_BASENAME eq $base)) { + $class = 'class="active '.$base.' '.$page.'"'; + } else { + $class = ''; + } + + $dir = '.' unless defined $dir; + + # translated version + if (-e "$(DOCROOT)/$dir/$lang/$base.wml") { + printf '<li><a '.$class.' href="%s">%s</a></li>'."\n", + stripDotSlashs("$(DOCROOT)/$dir/$base.html.$(LANG)"),$navigation{$key}; + } + # english version + elsif (-e "$(DOCROOT)/$dir/en/$base.wml") { + printf '<li><a '.$class.' href="%s">%s</a></li>'."\n", + stripDotSlashs("$(DOCROOT)/$dir/$base.html"), $navigation{$key}; + } + # full url + elsif ($key =~/^http/) { + printf '<li><a href="%s">%s</a></li>'."\n", $key, $navigation{$key}; + } else { + warn "$WML_SRC_FILENAME has a [page $key] (parses to +docdir: $(DOCROOT)/; dir: $dir; base: $base -> $(DOCROOT)/$dir/$lang/$base.wml), but that doesn't exist."; + } + } + }:> + </ul> + </div> + <!-- END NAV --> + # end navigation generation + <div id="calltoaction"> + <ul> + <:{ + my %calltoaction; + my @keys; + while (@calltoaction) { + my $key = shift @calltoaction; + my $val = shift @calltoaction; + push @keys, $key; + $calltoaction{$key} = $val; + } + + my $page = $WML_SRC_BASENAME; + my $lang = "$(LANG)"; + for my $key (@keys) { + my ($dir, $base) = $key =~ m,^(?:(.*)/)?(.*?)$,; + + # in directory, set active + my $class; + if ((defined $dir) and ($WML_SRC_DIRNAME =~/$dir/) or ($WML_SRC_BASENAME eq $base)) { + #if ($WML_SRC_BASENAME eq $base) { + $class = 'class="active"'; + } else { + $class = ''; + } + + $dir = '.' unless defined $dir; + # try to use a translated version + if (-e "$(DOCROOT)/$dir/$lang/$base.wml") { + printf '<li class="donate"><a '.$class.' href="%s">%s</a></li>'."\n", + stripDotSlashs("$(DOCROOT)/$dir/$base.html.$(LANG)"),$calltoaction{$key}; + } + # default to english version + elsif (-e "$(DOCROOT)/$dir/en/$base.wml") { + printf '<li class="donate"><a '.$class.' href="%s">%s</a></li>'."\n", + stripDotSlashs("$(DOCROOT)/$dir/$base.html"), $calltoaction{$key}; + } else { + warn "$WML_SRC_FILENAME has a [page $key] (parses to docdir: $(DOCROOT)/; dir: $dir; base: $base -> $(DOCROOT)/$dir/$lang/$base.wml), but that doesn't exist."; + } + } + }:> + </ul> + </div> + <!-- END CALLTOACTION --> + </div> + <!-- END HEADER --> + +#<ifneq "$(REDIRECT)" "" "Redirecting to <a href="$(DOCROOT)/$(REDIRECT)">$(DOCROOT)/$(REDIRECT)</a>."> +#<ifneq "$(REDIRECT_GLOBAL)" "" "Redirecting to <a href="$(REDIRECT_GLOBAL)">$(REDIRECT_GLOBAL)</a>.">