-
Notifications
You must be signed in to change notification settings - Fork 143
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
initial github pages commit of ssl-config-generator
- Loading branch information
0 parents
commit b201a11
Showing
2 changed files
with
570 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,316 @@ | ||
| /* Less Framework 4 | ||
| http://lessframework.com | ||
| by Joni Korpi | ||
| License: http://opensource.org/licenses/mit-license.php */ | ||
|
|
||
|
|
||
| /* Resets | ||
| ------ */ | ||
|
|
||
| html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, | ||
| p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, | ||
| img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, | ||
| dl, dt, dd, ol, ul, li, fieldset, form, label, legend, | ||
| table, caption, tbody, tfoot, thead, tr, th, td, | ||
| article, aside, canvas, details, figure, figcaption, hgroup, | ||
| menu, footer, header, nav, section, summary, time, mark, audio, video { | ||
| margin: 0; | ||
| padding: 0; | ||
| border: 0; | ||
| } | ||
|
|
||
| article, aside, canvas, figure, figure img, figcaption, hgroup, | ||
| 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);} | ||
|
|
||
| a img {border: 0;} | ||
| p {margin-bottom: 24px;} | ||
| .mozilla-red {color: rgb(175,50,50);} | ||
| .img-left {float: left;} | ||
| .bg {background: rgb(245,241,232) url('background-gradient.png') repeat-x top center;} | ||
|
|
||
| .pad {padding: 4px;} | ||
|
|
||
|
|
||
| /* Typography presets | ||
| ------------------ */ | ||
|
|
||
| @font-face { | ||
| font-family: "OpenSans"; | ||
| src: url(OpenSans-Light.ttf) format("truetype"); | ||
| } | ||
|
|
||
| @font-face { | ||
| font-family: "OpenSans-Reg"; | ||
| src: url(OpenSans-Regular.ttf) format("truetype"); | ||
| } | ||
|
|
||
| body {font: 16px/24px Georgia, 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 {font-size: 108px; letter-spacing: -4px; line-height: 100%;} | ||
| .large {font-size: 72px; letter-spacing: -3px; line-height: 100%;} | ||
| h1 {font-size: 48px; letter-spacing: -2px; line-height: 100%;} | ||
| h2 {font-size: 32px; letter-spacing: -1px; line-height: 100%;} | ||
| h3 {font-size: 28px; letter-spacing: -0.5px; line-height: 100%;} | ||
| h4 {font-size: 24px; letter-spacing: -0.25px; line-height: 100%;} | ||
| .small, small { font-size: 12px; line-height: 100%;} | ||
|
|
||
| /* Oh yes, your Gumdrop Buttons | ||
| ------------------ */ | ||
|
|
||
| .button { | ||
|
|
||
| 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; | ||
| letter-spacing: -0.25px; | ||
| height: 48px; | ||
| width: 252px; | ||
| background-color: #81BC2E; | ||
| text-align: center; | ||
| color: white; | ||
| border-bottom: none; | ||
|
|
||
|
|
||
|
|
||
| -webkit-border-radius: 0.25em; | ||
| -moz-border-radius: 0.25em; | ||
| border-radius: 0.25em; | ||
|
|
||
| -webkit-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.1); | ||
| -moz-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.1); | ||
| box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.1); | ||
|
|
||
| /* IE10 */ | ||
| background-image: -ms-linear-gradient(top, #81BC2E 0%, #659C28 100%); | ||
|
|
||
| /* Mozilla Firefox */ | ||
| background-image: -moz-linear-gradient(top, #81BC2E 0%, #659C28 100%); | ||
|
|
||
| /* Opera */ | ||
| background-image: -o-linear-gradient(top, #81BC2E 0%, #659C28 100%); | ||
|
|
||
| /* Webkit (Safari/Chrome 10) */ | ||
| background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #81BC2E), color-stop(1, #659C28)); | ||
|
|
||
| /* Webkit (Chrome 11+) */ | ||
| background-image: -webkit-linear-gradient(top, #81BC2E 0%, #659C28 100%); | ||
|
|
||
| /* Proposed W3C Markup */ | ||
| background-image: linear-gradient(top, #81BC2E 0%, #659C28 100%); | ||
|
|
||
| -webkit-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -webkit-transition-duration: 0.25s; | ||
| -webkit-transition-delay: 0s; | ||
|
|
||
| -moz-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -moz-transition-duration: 0.25s; | ||
| -moz-transition-delay: 0s; | ||
|
|
||
| transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| transition-duration: 0.25s; | ||
| transition-delay: 0s; | ||
|
|
||
| } | ||
|
|
||
| .button:hover { | ||
|
|
||
| -webkit-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12 px 24px 2px rgba(124,211,30,1); | ||
| -moz-box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12px 24px 2px rgba(124,211,30,1); | ||
| box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1), inset 0px -2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12px 24px 2px rgba(124,211,30,1); | ||
|
|
||
| -webkit-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -webkit-transition-duration: 0.25s; | ||
| -webkit-transition-delay: 0s; | ||
|
|
||
| -moz-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -moz-transition-duration: 0.25s; | ||
| -moz-transition-delay: 0s; | ||
|
|
||
| transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| transition-duration: 0.25s; | ||
| transition-delay: 0s; | ||
|
|
||
| } | ||
|
|
||
| .button:active { | ||
|
|
||
| -webkit-box-shadow: inset 0px 2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12px 24px 6px rgba(0,0,0,0.2), inset 0px 0px 2px 2px rgba(0,0,0,0.2); | ||
| -moz-box-shadow: inset 0px 2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12px 24px 6px rgba(0,0,0,0.2), inset 0px 0px 2px 2px rgba(0,0,0,0.2); | ||
| box-shadow: inset 0px 2px 0px 0px rgba(0, 0, 0, 0.2), inset 0px 12px 24px 6px rgba(0,0,0,0.2), inset 0px 0px 2px 2px rgba(0,0,0,0.2); | ||
|
|
||
| -webkit-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -webkit-transition-duration: 0.25s; | ||
| -webkit-transition-delay: 0s; | ||
|
|
||
| -moz-transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| -moz-transition-duration: 0.25s; | ||
| -moz-transition-delay: 0s; | ||
|
|
||
| transition-property: -moz-box-shadow, -webkit-box-shadow, box-shadow; | ||
| transition-duration: 0.25s; | ||
| transition-delay: 0s; | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
| /* Column + Row presets | ||
| ------------------ */ | ||
|
|
||
| .one-col {width: 68px;} | ||
| .two-col {width: 160px;} | ||
| .three-col {width: 252px;} | ||
| .four-col {width: 344px;} | ||
| .five-col {width: 436px;} | ||
| .six-col {width: 528px;} | ||
| .seven-col {width: 620px;} | ||
| .eight-col {width: 712px;} | ||
| .nine-col {width: 804px;} | ||
| .auto {max-width: 100%;} | ||
| .full {width: 100%;} | ||
|
|
||
| .one-col, .two-col, .three-col, .four-col, .five-col, .six-col, .seven-col, .eight-col, .nine-col, .auto, .full img {max-width: 100%;} | ||
|
|
||
| .row {clear: both; border-bottom: 1px dotted rgba(175,50,50,0.4); overflow: auto; margin-bottom: 48px; padding-top: 24px;} | ||
|
|
||
| .gutter-bottom-24 {margin-bottom: 24px;} | ||
| .gutter-bottom-48 {margin-bottom: 48px;} | ||
|
|
||
| .gutter-top-24 {margin-top: 24px;} | ||
| .gutter-left-24 {margin-left: 24px;} | ||
| .gutter-right-24 {margin-right: 24px;} | ||
|
|
||
|
|
||
| /* Selection colours (easy to forget) */ | ||
|
|
||
| ::selection {background: rgb(255,255,158);} | ||
| ::-moz-selection {background: rgb(255,255,158);} | ||
| img::selection {background: transparent;} | ||
| img::-moz-selection {background: transparent;} | ||
| body {-webkit-tap-highlight-color: rgb(255,255,158);} | ||
|
|
||
| /* Default Layout: 992px. | ||
| Gutters: 24px. | ||
| Outer margins: 48px. | ||
| Leftover space for scrollbars @1024px: 32px. | ||
| ------------------------------------------------------------------------------- | ||
| cols 1 2 3 4 5 6 7 8 9 10 | ||
| px 68 160 252 344 436 528 620 712 804 896 */ | ||
|
|
||
| html { | ||
| border-top: 2px solid white; | ||
| } | ||
|
|
||
|
|
||
| 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; | ||
|
|
||
| -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); | ||
| 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;} | ||
|
|
||
|
|
||
| #framework {position: relative;} | ||
| #faux-tabzilla {position: absolute; top: -72px; right: 0px;} | ||
| .style-example {margin-left: 252px; margin-bottom: 48px; min-width: 252px;} | ||
| .style-example img {max-width: 100%;} | ||
| .style-example li {list-style-type: square;} | ||
| .style-example-text {float: left; margin-bottom: 48px; min-width: 252px; min-height: 436px; margin-right: 24px;} | ||
| .style-example-text p {width: 252px;} | ||
| .style-example-text h2 a {border-bottom: none;} | ||
| .css-code {float: left; margin-bottom: 48px; max-width: 160px; margin-right: 24px; line-height: 125%; min-height: 436px;} | ||
|
|
||
|
|
||
| /* Tablet Layout: 768px. | ||
| Gutters: 24px. | ||
| Outer margins: 28px. | ||
| Inherits styles from: Default Layout. | ||
| ----------------------------------------------------------------- | ||
| cols 1 2 3 4 5 6 7 8 | ||
| px 68 160 252 344 436 528 620 712 */ | ||
|
|
||
| @media only screen and (min-width: 768px) and (max-width: 991px) { | ||
|
|
||
| body { | ||
| width: 712px; | ||
| padding: 48px 28px 60px; | ||
| } | ||
|
|
||
| #faux-tabzilla {top: -48px;} | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
| /* Mobile Layout: 320px. | ||
| Gutters: 24px. | ||
| Outer margins: 34px. | ||
| Inherits styles from: Default Layout. | ||
| --------------------------------------------- | ||
| cols 1 2 3 | ||
| px 68 160 252 */ | ||
|
|
||
| @media only screen and (max-width: 767px) { | ||
|
|
||
| body { | ||
| width: 252px; | ||
| padding: 48px 34px 60px; | ||
| } | ||
|
|
||
| .huge {font-size: 64px;} | ||
| .large {font-size: 58px;} | ||
|
|
||
| #faux-tabzilla {top: -48px;} | ||
|
|
||
| #menu {line-height: 48px;} | ||
| #menu .menuItem {width: 252px; margin: 0px 24px; padding: 0px;} | ||
|
|
||
| .style-example {float: left; margin-bottom: 48px; width: 252px; margin-left: 0px;} | ||
| .style-example li {border-bottom: 1px dotted rgba(0,0,0,0.2); padding: 12px 0px;} | ||
| .style-example-text {float: left; margin-bottom: 48px; width: 252px;} | ||
| .css-code {float: none; max-width: 252px; margin: 0px; margin-bottom: 48px; line-height: 125%; min-height: 0px;} | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
| /* Wide Mobile Layout: 480px. | ||
| Gutters: 24px. | ||
| Outer margins: 22px. | ||
| Inherits styles from: Default Layout, Mobile Layout. | ||
| ------------------------------------------------------------ | ||
| cols 1 2 3 4 5 | ||
| px 68 160 252 344 436 */ | ||
|
|
||
| @media only screen and (min-width: 480px) and (max-width: 767px) { | ||
|
|
||
| body { | ||
| width: 436px; | ||
| padding: 36px 22px 48px; | ||
| } | ||
|
|
||
| #faux-tabzilla {top: -36px;} | ||
|
|
||
| } |
Oops, something went wrong.