Skip to content

Commit

Permalink
Fixed styling copy paste mistakes and formatting based on PR #11
Browse files Browse the repository at this point in the history
Added tabzilla
  • Loading branch information
gene1wood committed Nov 18, 2014
1 parent e64d1cc commit 2630f4f
Show file tree
Hide file tree
Showing 4 changed files with 98 additions and 29 deletions.
105 changes: 85 additions & 20 deletions css/screen.css
Expand Up @@ -24,7 +24,7 @@ footer, header, nav, section, audio, video {
display: block;
}

a {color: rgb(175,50,50); text-decoration: none; border-bottom: 1px dotted rgb(175,50,50);}
#wrapper a {color: rgb(175,50,50); text-decoration: none; border-bottom: 1px dotted rgb(175,50,50);}

a img {border: 0;}
p {margin-bottom: 24px;}
Expand All @@ -34,23 +34,82 @@ p {margin-bottom: 24px;}

.pad {padding: 4px;}

/* @Fonts *********/
/* Regular */
@font-face {
font-family: "Open Sans";
src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}

/* Typography presets
------------------ */

@font-face {
font-family: "OpenSans";
src: url(OpenSans-Light.ttf) format("truetype");
}

font-family: "Open Sans";
src: url("//www.mozilla.org/media/fonts/OpenSans-Italic-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-Italic-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-Italic-webfont.ttf") format("truetype");
font-weight: normal;
font-style: italic;
}

@font-face {
font-family: "OpenSans-Reg";
src: url(OpenSans-Regular.ttf) format("truetype");
}
font-family: "Open Sans";
src: url("//www.mozilla.org/media/fonts/OpenSans-Semibold-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-Semibold-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-Semibold-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-Semibold-webfont.ttf") format("truetype");
font-weight: bold;
font-style: normal;
}

@font-face {
font-family: "Open Sans";
src: url("//www.mozilla.org/media/fonts/OpenSans-SemiboldItalic-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-SemiboldItalic-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-SemiboldItalic-webfont.ttf") format("truetype");
font-weight: bold;
font-style: italic;
}

/* Light */
@font-face {
font-family: "Open Sans Light";
src: url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-Light-webfont.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: "Open Sans Light";
src: url("//www.mozilla.org/media/fonts/OpenSans-LightItalic-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-LightItalic-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-LightItalic-webfont.ttf") format("truetype");
font-weight: normal;
font-style: italic;
}

@font-face {
font-family: "Open Sans Light";
src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot");
src: url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"),
url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.woff") format("woff"),
url("//www.mozilla.org/media/fonts/OpenSans-Regular-webfont.ttf") format("truetype");
font-weight: bold;
font-style: normal;
}

body {font: 16px/24px Georgia, serif;}
body {font-family: 'Open Sans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;}

.huge, .large, h1, h2, h3, h4 {font-family: 'OpenSans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-weight: normal; text-shadow: 0px 1px 0px rgba(255,255,255,0.75);}
.huge, .large, h1, h2, h3, h4 {font-family: 'Open Sans Light', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-weight: normal; text-shadow: 0px 1px 0px rgba(255,255,255,0.75);}

.huge {font-size: 108px; letter-spacing: -4px; line-height: 100%;}
.large {font-size: 72px; letter-spacing: -3px; line-height: 100%;}
Expand All @@ -69,7 +128,7 @@ float: left;
display: block;
text-decoration: none;
text-shadow: 0px 1px 0px rgba(0,0,0,0.25);
font: 14px/48px 'OpenSans-Reg', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
font: 14px/48px 'Open Sans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
letter-spacing: -0.25px;
height: 48px;
width: 252px;
Expand Down Expand Up @@ -211,15 +270,21 @@ html {


body {
width: 896px;
margin: 0px auto;
padding: 72px 48px 84px;
background: rgb(245,241,232) url('mozorg-gradient.png') repeat-x top center;
color: rgb(60,60,60);
-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
}

#menu {width: 100%; min-height: 72px; line-height: 72px; text-align: center; margin-bottom: 48px; font-family: 'OpenSans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; background-color: white;
#outer-wrapper {
background: url('../media/bg-gradient-sand.png') repeat-x scroll 0% 0%, url('../media/bg-sand.png') repeat scroll 0% 0%, none repeat scroll 0% 0% #F5F1E8;
}

#wrapper {
width: 896px;
margin: 0px auto;
padding: 72px 48px 84px;
}

#menu {width: 100%; min-height: 72px; line-height: 72px; text-align: center; margin-bottom: 48px; font-family: 'Open Sans Light', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; background-color: white;

-webkit-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
Expand All @@ -229,7 +294,7 @@ box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
.menuItem {display: inline; margin: 0px;}
#menu a {text-decoration: none; margin: 0px 24px; border-bottom: none;}
#menu a:hover {color: rgba(0,0,0,0.8);}
.top {font-family: 'OpenSans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;}
.top {font-family: 'Open Sans Light', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;}


#framework {position: relative;}
Expand Down
Binary file added media/bg-gradient-sand.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added media/bg-sand.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
22 changes: 13 additions & 9 deletions ssl-config-generator/index.html
Expand Up @@ -5,14 +5,15 @@
<meta charset="utf-8" />
<title>Generate Mozilla Security Recommended Web Server Configuration Files</title>
<link rel="stylesheet" type="text/css" media="all" href="../css/screen.css" />
<link href="//mozorg.cdn.mozilla.net/media/css/tabzilla-min.css" rel="stylesheet" />
<style>
div#server-config-text pre {
background-color: #F7F7F7;
border-radius: 3px;
padding: 2em;
}
label, p {
font-family: 'OpenSans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
font-family: 'Open Sans', "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
font-weight: normal;
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.75);
}
Expand All @@ -26,6 +27,7 @@

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.min.js"></script>
<script src="//mozorg.cdn.mozilla.net/tabzilla/tabzilla.js"></script>
<script>
// https://gist.github.com/cowboy/566233
var isSemVer=(function(){var a=/^(<|>|[=!<>]=)?\s*(\d+(?:\.\d+){0,2})([a-z][a-z0-9\-]*)?$/i;function b(e,c){var d=(e+"").match(a);return d?(c?(d[1]||"=="):"")+'"'+(d[2]+".0.0").match(/\d+(?:\.\d+){0,2}/)[0].replace(/(?:^|\.)(\d+)/g,function(g,f){return Array(9-f.length).join(0)+f})+(d[3]||"~")+'"':(c?"==0":1)}return function(e){e=b(e);for(var c,d=1;c=arguments[d++];){if(!(new Function("return "+e+b(c,1)))()){return false}}return true}})();
Expand All @@ -36,8 +38,7 @@
</script>

<script id="nginx-template" type="text/x-handlebars-template">
<h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
<p>Openssl : {{opensslVersion}}</p>
<h2>{{server}} {{serverVersion}} | {{securityProfile}} profile | OpenSSL {{opensslVersion}}</h2>
<p>Oldest compatible clients : {{clientList}}</p>
<pre>
server {
Expand Down Expand Up @@ -65,8 +66,7 @@ <h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
</script>

<script id="apache-template" type="text/x-handlebars-template">
<h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
<p>Openssl : {{opensslVersion}}</p>
<h2>{{server}} {{serverVersion}} | {{securityProfile}} profile | OpenSSL {{opensslVersion}}</h2>
<p>Oldest compatible clients : {{clientList}}</p>
<pre>
&lt;VirtualHost *:443&gt;
Expand All @@ -91,8 +91,7 @@ <h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
</script>

<script id="haproxy-template" type="text/x-handlebars-template">
<h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
<p>Openssl : {{opensslVersion}}</p>
<h2>{{server}} {{serverVersion}} | {{securityProfile}} profile | OpenSSL {{opensslVersion}}</h2>
<p>Oldest compatible clients : {{clientList}}</p>
<span class="message">{{message}}</span>
<pre style="visibility: {{visibility}};">
Expand Down Expand Up @@ -231,7 +230,11 @@ <h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
</head>

<body>
<a href="https://github.com/mozilla/server-side-tls"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
<a href="https://github.com/mozilla/server-side-tls"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://camo.githubusercontent.com/567c3a48d796e2fc06ea80409cc9dd82bf714434/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png"></a>
<a href="https://www.mozilla.org/" id="tabzilla">mozilla</a>
<div id="outer-wrapper">
<div id="wrapper">
<h1>Mozilla SSL Configuration Generator</h1>
<div style="width 100px; float:left; padding:1em;">
<div id="server-list">
<input type="radio" name="server" id="apache" value="apache" checked="true">
Expand Down Expand Up @@ -274,7 +277,8 @@ <h1>Server : {{server}} {{serverVersion}} | {{securityProfile}} profile</h1>
<div>
<p><a href="https://wiki.mozilla.org/Security/Server_Side_TLS">More details on these security profiles</a></p>
</div>

</div>
</div>
</body>

</html>

0 comments on commit 2630f4f

Please sign in to comment.