From 26894a8d4728044538effbd25dc33423af0b71ba Mon Sep 17 00:00:00 2001 From: Dmitry Mozzherin Date: Tue, 12 Nov 2024 11:15:48 +0000 Subject: [PATCH] improve web-GUI --- CHANGELOG.md | 1 + io/web/static/images/github-mark.svg | 1 + io/web/static/styles/screen.css | 1900 +++++++++++++++++++++----- io/web/templates/layout.html | 177 ++- 4 files changed, 1701 insertions(+), 378 deletions(-) create mode 100644 io/web/static/images/github-mark.svg diff --git a/CHANGELOG.md b/CHANGELOG.md index 37505ae..1e5c5f0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ ## [v1.11.1] - 2024-11-11 Mon +- Add: minor improvements in web-interface. - Add: make web-interface remember nomenclatural code picked in the previous GET query. diff --git a/io/web/static/images/github-mark.svg b/io/web/static/images/github-mark.svg new file mode 100644 index 0000000..df035b1 --- /dev/null +++ b/io/web/static/images/github-mark.svg @@ -0,0 +1 @@ + diff --git a/io/web/static/styles/screen.css b/io/web/static/styles/screen.css index ecdcaf2..395723e 100644 --- a/io/web/static/styles/screen.css +++ b/io/web/static/styles/screen.css @@ -1,498 +1,1784 @@ @charset "UTF-8"; /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ -html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } +html { + font-family: sans-serif; + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100%; +} -body { margin: 0; } +body { + margin: 0; +} .form-elements { margin-bottom: 1em; } -article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +menu, +nav, +section, +summary { + display: block; +} -audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } +audio, +canvas, +progress, +video { + display: inline-block; + vertical-align: baseline; +} -audio:not([controls]) { display: none; height: 0; } +audio:not([controls]) { + display: none; + height: 0; +} -[hidden], template { display: none; } +[hidden], +template { + display: none; +} -a { background-color: transparent; } +a { + background-color: transparent; +} -a:active, a:hover { outline: 0; } +a:active, +a:hover { + outline: 0; +} -abbr[title] { border-bottom: 1px dotted; } +abbr[title] { + border-bottom: 1px dotted; +} -b, strong { font-weight: 700; } +b, +strong { + font-weight: 700; +} -dfn { font-style: italic; } +dfn { + font-style: italic; +} -h1 { font-size: 2em; margin: .67em 0; } +h1 { + font-size: 2em; + margin: 0.67em 0; +} -mark { background: #ff0; color: #000; } +mark { + background: #ff0; + color: #000; +} -small { font-size: 80%; } +small { + font-size: 80%; +} -sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} -sup { top: -.5em; } +img { + border: 0; +} -sub { bottom: -.25em; } +svg:not(:root) { + overflow: hidden; +} -img { border: 0; } +figure { + margin: 1em 40px; +} -svg:not(:root) { overflow: hidden; } +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; +} -figure { margin: 1em 40px; } +pre { + overflow: auto; +} -hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} -pre { overflow: auto; } +button, +input, +optgroup, +select, +textarea { + color: inherit; + font: inherit; + margin: 0; +} -code, kbd, pre, samp { font-family: monospace,monospace; font-size: 1em; } +button { + overflow: visible; +} -button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } +select { + margin-right: 1em; +} -button { overflow: visible; } +button, +select { + text-transform: none; +} -select { margin-right: 1em; } +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; + cursor: pointer; +} -button, select { text-transform: none; } +button[disabled], +html input[disabled] { + cursor: default; +} -button, html input[type=button], input[type=reset], input[type=submit] { -webkit-appearance: button; cursor: pointer; } +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} -button[disabled], html input[disabled] { cursor: default; } +input { + line-height: normal; +} -button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; + margin-right: 1em; + padding: 1em; +} -input { line-height: normal; } +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} -input[type=checkbox], input[type=radio] { box-sizing: border-box; margin-right: 1em; padding: 1em; } +input[type="search"] { + -webkit-appearance: textfield; + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; + box-sizing: content-box; +} -input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto; } +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} -input[type=search] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } +fieldset { + border: 1px solid silver; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} -input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; } +legend { + border: 0; + padding: 0; +} -fieldset { border: 1px solid silver; margin: 0 2px; padding: .35em .625em .75em; } +textarea { + overflow: auto; +} -legend { border: 0; padding: 0; } +optgroup { + font-weight: 700; +} -textarea { overflow: auto; } +table { + border-collapse: collapse; + border-spacing: 0; +} -optgroup { font-weight: 700; } +td, +th { + padding: 0; +} -table { border-collapse: collapse; border-spacing: 0; } +#version img { + vertical-align: middle; + height: 25px; + margin-right: 7px; +} -td, th { padding: 0; } +#version a { + align-items: center; + justify-content: center; +} /* Gridism A simple, responsive, and handy CSS grid by @cobyism https://github.com/cobyism/gridism */ /* Preserve some sanity */ -.grid, .unit { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } +.grid, +.unit { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} /* Set up some rules to govern the grid */ -.grid { display: block; clear: both; } +.grid { + display: block; + clear: both; +} -.grid .unit { float: left; width: 100%; padding: 10px; } +.grid .unit { + float: left; + width: 100%; + padding: 10px; +} /* This ensures the outer gutters are equal to the (doubled) inner gutters. */ -.grid .unit:first-child { padding-left: 20px; } +.grid .unit:first-child { + padding-left: 20px; +} -.grid .unit:last-child { padding-right: 20px; } +.grid .unit:last-child { + padding-right: 20px; +} /* Nested grids already have padding though, so let’s nuke it */ -.unit .unit:first-child { padding-left: 0; } +.unit .unit:first-child { + padding-left: 0; +} -.unit .unit:last-child { padding-right: 0; } +.unit .unit:last-child { + padding-right: 0; +} -.unit .grid:first-child > .unit { padding-top: 0; } +.unit .grid:first-child > .unit { + padding-top: 0; +} -.unit .grid:last-child > .unit { padding-bottom: 0; } +.unit .grid:last-child > .unit { + padding-bottom: 0; +} /* Let people nuke the gutters/padding completely in a couple of ways */ -.no-gutters .unit, .unit.no-gutters { padding: 0 !important; } +.no-gutters .unit, +.unit.no-gutters { + padding: 0 !important; +} /* Wrapping at a maximum width is optional */ -.wrap .grid, .grid.wrap { max-width: 978px; margin: 0 auto; } +.wrap .grid, +.grid.wrap { + max-width: 978px; + margin: 0 auto; +} /* Width classes also have shorthand versions numbered as fractions For example: for a grid unit 1/3 (one third) of the parent width, simply apply class="w-1-3" to the element. */ -.grid .whole, .grid .w-1-1 { width: 100%; } +.grid .whole, +.grid .w-1-1 { + width: 100%; +} -.grid .half, .grid .w-1-2 { width: 50%; } +.grid .half, +.grid .w-1-2 { + width: 50%; +} -.grid .one-third, .grid .w-1-3 { width: 33.3332%; } +.grid .one-third, +.grid .w-1-3 { + width: 33.3332%; +} -.grid .two-thirds, .grid .w-2-3 { width: 66.6665%; } +.grid .two-thirds, +.grid .w-2-3 { + width: 66.6665%; +} -.grid .one-quarter, .grid .one-fourth, .grid .w-1-4 { width: 25%; } +.grid .one-quarter, +.grid .one-fourth, +.grid .w-1-4 { + width: 25%; +} -.grid .three-quarters, .grid .three-fourths, .grid .w-3-4 { width: 75%; } +.grid .three-quarters, +.grid .three-fourths, +.grid .w-3-4 { + width: 75%; +} -.grid .one-fifth, .grid .w-1-5 { width: 20%; } +.grid .one-fifth, +.grid .w-1-5 { + width: 20%; +} -.grid .two-fifths, .grid .w-2-5 { width: 40%; } +.grid .two-fifths, +.grid .w-2-5 { + width: 40%; +} -.grid .three-fifths, .grid .w-3-5 { width: 60%; } +.grid .three-fifths, +.grid .w-3-5 { + width: 60%; +} -.grid .four-fifths, .grid .w-4-5 { width: 80%; } +.grid .four-fifths, +.grid .w-4-5 { + width: 80%; +} -.grid .golden-small, .grid .w-g-s { width: 38.2716%; } +.grid .golden-small, +.grid .w-g-s { + width: 38.2716%; +} /* Golden section: smaller piece */ -.grid .golden-large, .grid .w-g-l { width: 61.7283%; } +.grid .golden-large, +.grid .w-g-l { + width: 61.7283%; +} /* Golden section: larger piece */ /* Clearfix after every .grid */ -.grid { *zoom: 1; } +.grid { + *zoom: 1; +} -.grid:before, .grid:after { display: table; content: ""; line-height: 0; } +.grid:before, +.grid:after { + display: table; + content: ""; + line-height: 0; +} -.grid:after { clear: both; } +.grid:after { + clear: both; +} /* Utility classes */ -.align-center { text-align: center; } +.align-center { + text-align: center; +} -.align-left { text-align: left; } +.align-left { + text-align: left; +} -.align-right { text-align: right; } +.align-right { + text-align: right; +} -.pull-left { float: left; } +.pull-left { + float: left; +} -.pull-right { float: right; } +.pull-right { + float: right; +} /* A property for a better rendering of images in units: in this way bigger pictures are just resized if the unit becomes smaller */ -.unit img { max-width: 100%; } +.unit img { + max-width: 100%; +} /* Responsive Stuff */ -@media screen and (max-width: 568px) { /* Stack anything that isn’t full-width on smaller screens and doesn't provide the no-stacking-on-mobiles class */ - .grid:not(.no-stacking-on-mobiles) > .unit { width: 100% !important; padding-left: 20px; padding-right: 20px; } - .unit .grid .unit { padding-left: 0px; padding-right: 0px; } +@media screen and (max-width: 568px) { + /* Stack anything that isn’t full-width on smaller screens and doesn't provide the no-stacking-on-mobiles class */ + .grid:not(.no-stacking-on-mobiles) > .unit { + width: 100% !important; + padding-left: 20px; + padding-right: 20px; + } + .unit .grid .unit { + padding-left: 0px; + padding-right: 0px; + } /* Sometimes, you just want to be different on small screens */ - .center-on-mobiles { text-align: center !important; } - .hide-on-mobiles { display: none !important; } } + .center-on-mobiles { + text-align: center !important; + } + .hide-on-mobiles { + display: none !important; + } +} /* Expand the wrap a bit further on larger screens */ -@media screen and (min-width: 1180px) { .wider .grid, .grid.wider { max-width: 1180px; margin: 0 auto; } } -.highlight { /* Comment */ /* Error */ /* Generic */ /* Keyword */ /* Literal */ /* Name */ /* Operator */ /* Other */ /* Punctuation */ /* Comment.Multiline */ /* Comment.Preproc */ /* Comment.Single */ /* Comment.Special */ /* Generic.Deleted */ /* Generic.Emph */ /* Generic.Error */ /* Generic.Heading */ /* Generic.Inserted */ /* Generic.Output, qualified with span to prevent applying this style to the Go language, see #1153. */ /* Generic.Prompt */ /* Generic.Strong */ /* Generic.Subheading */ /* Generic.Traceback */ /* Keyword.Constant */ /* Keyword.Declaration */ /* Keyword.Namespace */ /* Keyword.Pseudo */ /* Keyword.Reserved */ /* Keyword.Type */ /* Literal.Date */ /* Literal.Number */ /* Literal.String */ /* Name.Attribute */ /* Name.Builtin */ /* Name.Class */ /* Name.Constant */ /* Name.Decorator */ /* Name.Entity */ /* Name.Exception */ /* Name.Function */ /* Name.Label */ /* Name.Namespace */ /* Name.Other */ /* Name.Property */ /* Name.Tag */ /* Name.Variable */ /* Operator.Word */ /* Text.Whitespace */ /* Literal.Number.Float */ /* Literal.Number.Hex */ /* Literal.Number.Integer */ /* Literal.Number.Oct */ /* Literal.String.Backtick */ /* Literal.String.Char */ /* Literal.String.Doc */ /* Literal.String.Double */ /* Literal.String.Escape */ /* Literal.String.Heredoc */ /* Literal.String.Interpol */ /* Literal.String.Other */ /* Literal.String.Regex */ /* Literal.String.Single */ /* Literal.String.Symbol */ /* Name.Builtin.Pseudo */ /* Name.Variable.Class */ /* Name.Variable.Global */ /* Name.Variable.Instance */ /* Literal.Number.Integer.Long */ } -.highlight .hll { background-color: #ffffcc; } -.highlight .c { color: #87ceeb; } -.highlight .err { color: #ffffff; } -.highlight .g { color: #ffffff; } -.highlight .k { color: #f0e68c; } -.highlight .l { color: #ffffff; } -.highlight .n { color: #ffffff; } -.highlight .o { color: #ffffff; } -.highlight .x { color: #ffffff; } -.highlight .p { color: #ffffff; } -.highlight .cm { color: #87ceeb; } -.highlight .cp { color: #cd5c5c; } -.highlight .c1 { color: #87ceeb; } -.highlight .cs { color: #87ceeb; } -.highlight .gd { color: #0000c0; font-weight: bold; background-color: #008080; } -.highlight .ge { color: #c000c0; text-decoration: underline; } -.highlight .gr { color: #c0c0c0; font-weight: bold; background-color: #c00000; } -.highlight .gh { color: #cd5c5c; } -.highlight .gi { color: #ffffff; background-color: #0000c0; } -.highlight span.go { color: #add8e6; font-weight: bold; background-color: #4d4d4d; } -.highlight .gp { color: #ffffff; } -.highlight .gs { color: #ffffff; } -.highlight .gu { color: #cd5c5c; } -.highlight .gt { color: #c0c0c0; font-weight: bold; background-color: #c00000; } -.highlight .kc { color: #f0e68c; } -.highlight .kd { color: #f0e68c; } -.highlight .kn { color: #f0e68c; } -.highlight .kp { color: #f0e68c; } -.highlight .kr { color: #f0e68c; } -.highlight .kt { color: #bdb76b; } -.highlight .ld { color: #ffffff; } -.highlight .m { color: #ffffff; } -.highlight .s { color: #ffffff; } -.highlight .na { color: #ffffff; } -.highlight .nb { color: #ffffff; } -.highlight .nc { color: #ffffff; } -.highlight .no { color: #ffa0a0; } -.highlight .nd { color: #ffffff; } -.highlight .ni { color: #ffdead; } -.highlight .ne { color: #ffffff; } -.highlight .nf { color: #ffffff; } -.highlight .nl { color: #ffffff; } -.highlight .nn { color: #ffffff; } -.highlight .nx { color: #ffffff; } -.highlight .py { color: #ffffff; } -.highlight .nt { color: #f0e68c; } -.highlight .nv { color: #98fb98; } -.highlight .ow { color: #ffffff; } -.highlight .w { color: #ffffff; } -.highlight .mf { color: #ffffff; } -.highlight .mh { color: #ffffff; } -.highlight .mi { color: #ffffff; } -.highlight .mo { color: #ffffff; } -.highlight .sb { color: #ffffff; } -.highlight .sc { color: #ffffff; } -.highlight .sd { color: #ffffff; } -.highlight .s2 { color: #ffffff; } -.highlight .se { color: #ffffff; } -.highlight .sh { color: #ffffff; } -.highlight .si { color: #ffffff; } -.highlight .sx { color: #ffffff; } -.highlight .sr { color: #ffffff; } -.highlight .s1 { color: #ffffff; } -.highlight .ss { color: #ffffff; } -.highlight .bp { color: #ffffff; } -.highlight .vc { color: #98fb98; } -.highlight .vg { color: #98fb98; } -.highlight .vi { color: #98fb98; } -.highlight .il { color: #ffffff; } -.highlight .bash .nv { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } +@media screen and (min-width: 1180px) { + .wider .grid, + .grid.wider { + max-width: 1180px; + margin: 0 auto; + } +} +.highlight { + /* Comment */ /* Error */ /* Generic */ /* Keyword */ /* Literal */ /* Name */ /* Operator */ /* Other */ /* Punctuation */ /* Comment.Multiline */ /* Comment.Preproc */ /* Comment.Single */ /* Comment.Special */ /* Generic.Deleted */ /* Generic.Emph */ /* Generic.Error */ /* Generic.Heading */ /* Generic.Inserted */ /* Generic.Output, qualified with span to prevent applying this style to the Go language, see #1153. */ /* Generic.Prompt */ /* Generic.Strong */ /* Generic.Subheading */ /* Generic.Traceback */ /* Keyword.Constant */ /* Keyword.Declaration */ /* Keyword.Namespace */ /* Keyword.Pseudo */ /* Keyword.Reserved */ /* Keyword.Type */ /* Literal.Date */ /* Literal.Number */ /* Literal.String */ /* Name.Attribute */ /* Name.Builtin */ /* Name.Class */ /* Name.Constant */ /* Name.Decorator */ /* Name.Entity */ /* Name.Exception */ /* Name.Function */ /* Name.Label */ /* Name.Namespace */ /* Name.Other */ /* Name.Property */ /* Name.Tag */ /* Name.Variable */ /* Operator.Word */ /* Text.Whitespace */ /* Literal.Number.Float */ /* Literal.Number.Hex */ /* Literal.Number.Integer */ /* Literal.Number.Oct */ /* Literal.String.Backtick */ /* Literal.String.Char */ /* Literal.String.Doc */ /* Literal.String.Double */ /* Literal.String.Escape */ /* Literal.String.Heredoc */ /* Literal.String.Interpol */ /* Literal.String.Other */ /* Literal.String.Regex */ /* Literal.String.Single */ /* Literal.String.Symbol */ /* Name.Builtin.Pseudo */ /* Name.Variable.Class */ /* Name.Variable.Global */ /* Name.Variable.Instance */ /* Literal.Number.Integer.Long */ +} +.highlight .hll { + background-color: #ffffcc; +} +.highlight .c { + color: #87ceeb; +} +.highlight .err { + color: #ffffff; +} +.highlight .g { + color: #ffffff; +} +.highlight .k { + color: #f0e68c; +} +.highlight .l { + color: #ffffff; +} +.highlight .n { + color: #ffffff; +} +.highlight .o { + color: #ffffff; +} +.highlight .x { + color: #ffffff; +} +.highlight .p { + color: #ffffff; +} +.highlight .cm { + color: #87ceeb; +} +.highlight .cp { + color: #cd5c5c; +} +.highlight .c1 { + color: #87ceeb; +} +.highlight .cs { + color: #87ceeb; +} +.highlight .gd { + color: #0000c0; + font-weight: bold; + background-color: #008080; +} +.highlight .ge { + color: #c000c0; + text-decoration: underline; +} +.highlight .gr { + color: #c0c0c0; + font-weight: bold; + background-color: #c00000; +} +.highlight .gh { + color: #cd5c5c; +} +.highlight .gi { + color: #ffffff; + background-color: #0000c0; +} +.highlight span.go { + color: #add8e6; + font-weight: bold; + background-color: #4d4d4d; +} +.highlight .gp { + color: #ffffff; +} +.highlight .gs { + color: #ffffff; +} +.highlight .gu { + color: #cd5c5c; +} +.highlight .gt { + color: #c0c0c0; + font-weight: bold; + background-color: #c00000; +} +.highlight .kc { + color: #f0e68c; +} +.highlight .kd { + color: #f0e68c; +} +.highlight .kn { + color: #f0e68c; +} +.highlight .kp { + color: #f0e68c; +} +.highlight .kr { + color: #f0e68c; +} +.highlight .kt { + color: #bdb76b; +} +.highlight .ld { + color: #ffffff; +} +.highlight .m { + color: #ffffff; +} +.highlight .s { + color: #ffffff; +} +.highlight .na { + color: #ffffff; +} +.highlight .nb { + color: #ffffff; +} +.highlight .nc { + color: #ffffff; +} +.highlight .no { + color: #ffa0a0; +} +.highlight .nd { + color: #ffffff; +} +.highlight .ni { + color: #ffdead; +} +.highlight .ne { + color: #ffffff; +} +.highlight .nf { + color: #ffffff; +} +.highlight .nl { + color: #ffffff; +} +.highlight .nn { + color: #ffffff; +} +.highlight .nx { + color: #ffffff; +} +.highlight .py { + color: #ffffff; +} +.highlight .nt { + color: #f0e68c; +} +.highlight .nv { + color: #98fb98; +} +.highlight .ow { + color: #ffffff; +} +.highlight .w { + color: #ffffff; +} +.highlight .mf { + color: #ffffff; +} +.highlight .mh { + color: #ffffff; +} +.highlight .mi { + color: #ffffff; +} +.highlight .mo { + color: #ffffff; +} +.highlight .sb { + color: #ffffff; +} +.highlight .sc { + color: #ffffff; +} +.highlight .sd { + color: #ffffff; +} +.highlight .s2 { + color: #ffffff; +} +.highlight .se { + color: #ffffff; +} +.highlight .sh { + color: #ffffff; +} +.highlight .si { + color: #ffffff; +} +.highlight .sx { + color: #ffffff; +} +.highlight .sr { + color: #ffffff; +} +.highlight .s1 { + color: #ffffff; +} +.highlight .ss { + color: #ffffff; +} +.highlight .bp { + color: #ffffff; +} +.highlight .vc { + color: #98fb98; +} +.highlight .vg { + color: #98fb98; +} +.highlight .vi { + color: #98fb98; +} +.highlight .il { + color: #ffffff; +} +.highlight .bash .nv { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} /*! * Font Awesome 4.2.0 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */ -@font-face { font-family: 'FontAwesome'; src: url("../fonts/fontawesome-webfont.eot?v=4.2.0"); src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff?v=4.2.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.2.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular") format("svg"); font-weight: normal; font-style: normal; } -.fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } +@font-face { + font-family: "FontAwesome"; + src: url("../fonts/fontawesome-webfont.eot?v=4.2.0"); + src: + url("../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0") + format("embedded-opentype"), + url("../fonts/fontawesome-webfont.woff?v=4.2.0") format("woff"), + url("../fonts/fontawesome-webfont.ttf?v=4.2.0") format("truetype"), + url("../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular") + format("svg"); + font-weight: normal; + font-style: normal; +} +.fa { + display: inline-block; + font: normal normal normal 14px/1 FontAwesome; + font-size: inherit; + text-rendering: auto; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} -.fa-link:before { content: "\f0c1"; } +.fa-link:before { + content: "\f0c1"; +} -.fa-pencil:before { content: "\f040"; } +.fa-pencil:before { + content: "\f040"; +} /* Variables */ /* Base */ -* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } +* { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} -body { font: 400 1em Lato, 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #000; background-color: #fff; border-top: 5px solid #007934; -webkit-box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); -webkit-font-feature-settings: "kern" 1; -moz-font-feature-settings: "kern" 1; -o-font-feature-settings: "kern" 1; font-feature-settings: "kern" 1; font-kerning: normal; } +body { + font: + 400 1em Lato, + "Helvetica Neue", + Helvetica, + Arial, + sans-serif; + color: #000; + background-color: #fff; + border-top: 5px solid #007934; + -webkit-box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); + -moz-box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); + box-shadow: inset 0 3px 30px rgba(0, 0, 0, 0.3); + -webkit-font-feature-settings: "kern" 1; + -moz-font-feature-settings: "kern" 1; + -o-font-feature-settings: "kern" 1; + font-feature-settings: "kern" 1; + font-kerning: normal; +} -.break { margin-bottom: 3em; } +.break { + margin-bottom: 3em; +} -.clear { display: block; } +.clear { + display: block; +} -.clear:after { content: " "; display: block; height: 0; clear: both; visibility: hidden; } +.clear:after { + content: " "; + display: block; + height: 0; + clear: both; + visibility: hidden; +} /* Sections */ -header, section, footer { float: left; width: 100%; clear: both; } +header, +section, +footer { + float: left; + width: 100%; + clear: both; +} /* Header */ -header h1, header nav { display: inline-block; } +header h1, +header nav { + display: inline-block; +} -nav ul { padding: 0; margin: 0; } -nav li { display: inline-block; } +nav ul { + padding: 0; + margin: 0; +} +nav li { + display: inline-block; +} -.main-nav { margin-top: 52px; } -.main-nav li { margin-right: 10px; } -.main-nav li a { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; font-weight: 900; font-size: 14px; padding: 0.5em 1em; text-shadow: none; text-transform: uppercase; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -o-transition: all 0.25s; transition: all 0.25s; } -.main-nav li a:hover { background-color: #252525; -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.1); } -.main-nav li.current a { background-color: #007934; color: #fdba12; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); } +.main-nav { + margin-top: 52px; +} +.main-nav li { + margin-right: 10px; +} +.main-nav li a { + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + font-weight: 900; + font-size: 14px; + padding: 0.5em 1em; + text-shadow: none; + text-transform: uppercase; + -webkit-transition: all 0.25s; + -moz-transition: all 0.25s; + -o-transition: all 0.25s; + transition: all 0.25s; +} +.main-nav li a:hover { + background-color: #252525; + -webkit-box-shadow: + inset 0 1px 3px rgba(0, 0, 0, 0.5), + 0 1px 0 rgba(255, 255, 255, 0.1); + -moz-box-shadow: + inset 0 1px 3px rgba(0, 0, 0, 0.5), + 0 1px 0 rgba(255, 255, 255, 0.1); + box-shadow: + inset 0 1px 3px rgba(0, 0, 0, 0.5), + 0 1px 0 rgba(255, 255, 255, 0.1); +} +.main-nav li.current a { + background-color: #007934; + color: #fdba12; + -webkit-box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); + -moz-box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); + box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); +} -.social-media { float: right; margin-left: 2em; } -.social-media a.sharer { padding: 0px 4px; border-radius: 4px; color: #333; } -.social-media a.sharer i { margin: 2px; } -.social-media a.facebook { background: #5671ff; color: #fff; } -.social-media a.twitter { background: #5671ff; color: #fff; } +.social-media { + float: right; + margin-left: 2em; +} +.social-media a.sharer { + padding: 0px 4px; + border-radius: 4px; + color: #333; +} +.social-media a.sharer i { + margin: 2px; +} +.social-media a.facebook { + background: #5671ff; + color: #fff; +} +.social-media a.twitter { + background: #5671ff; + color: #fff; +} -.mobile-nav ul { overflow: hidden; width: 100%; display: table; } -.mobile-nav a { float: left; width: 100%; background-color: #fff; color: #030; text-align: center; text-transform: uppercase; font-size: 14px; font-weight: 900; padding: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } -.mobile-nav li { display: table-cell; width: 20%; padding: 8px 2px; } -.mobile-nav .current a { background-color: #030; color: #fdba12; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 5px rgba(0, 0, 0, 0.5); } +.mobile-nav ul { + overflow: hidden; + width: 100%; + display: table; +} +.mobile-nav a { + float: left; + width: 100%; + background-color: #fff; + color: #030; + text-align: center; + text-transform: uppercase; + font-size: 14px; + font-weight: 900; + padding: 5px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +.mobile-nav li { + display: table-cell; + width: 20%; + padding: 8px 2px; +} +.mobile-nav .current a { + background-color: #030; + color: #fdba12; + -webkit-box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); + -moz-box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); + box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.5), + 0 1px 5px rgba(0, 0, 0, 0.5); +} /* This code is courtesy Ben Balter, modified by Parker Moore for jekyllrb.com http://ben.balter.com/2014/03/13/pages-anchor-links/ then modified for globalnames.org */ -.header-link { position: relative; left: 0.5em; opacity: 0; font-size: 0.8em; -webkit-transition: opacity 0.2s ease-in-out 0.1s; -moz-transition: opacity 0.2s ease-in-out 0.1s; -o-transition: opacity 0.2s ease-in-out 0.1s; transition: opacity 0.2s ease-in-out 0.1s; } +.header-link { + position: relative; + left: 0.5em; + opacity: 0; + font-size: 0.8em; + -webkit-transition: opacity 0.2s ease-in-out 0.1s; + -moz-transition: opacity 0.2s ease-in-out 0.1s; + -o-transition: opacity 0.2s ease-in-out 0.1s; + transition: opacity 0.2s ease-in-out 0.1s; +} -.logo { margin-left: 3px; } +.logo { + margin-left: 3px; +} -h2:hover .header-link, h3:hover .header-link, h4:hover .header-link, h5:hover .header-link, h6:hover .header-link { opacity: 1; } +h2:hover .header-link, +h3:hover .header-link, +h4:hover .header-link, +h5:hover .header-link, +h6:hover .header-link { + opacity: 1; +} -@media (max-width: 768px) { .main-nav ul { text-align: right; } } -@media (max-width: 830px) { .main-nav .show-on-mobiles { display: inline; } - .main-nav .hide-on-mobiles { display: none; } } +@media (max-width: 768px) { + .main-nav ul { + text-align: right; + } +} +@media (max-width: 830px) { + .main-nav .show-on-mobiles { + display: inline; + } + .main-nav .hide-on-mobiles { + display: none; + } +} /* Footer */ -footer { background-color: #212121; font-size: 16px; padding-bottom: 5px; color: #c0c0c0; margin-top: 40px; } -footer a { color: #fff; } -footer a:hover img { opacity: 1; } -footer .align-right p { display: inline-block; } -footer img { display: inline-block; position: relative; top: 8px; margin-left: 5px; opacity: .8; padding: 1px; -webkit-transition: opacity 0.2s; -moz-transition: opacity 0.2s; -o-transition: opacity 0.2s; transition: opacity 0.2s; } - -@media (max-width: 568px) { footer .one-third p { margin-bottom: 0; } - footer .two-thirds p { margin-top: -20px; } } +footer { + background-color: #212121; + font-size: 16px; + padding-bottom: 5px; + color: #c0c0c0; + margin-top: 40px; +} +footer a { + color: #fff; +} +footer a:hover img { + opacity: 1; +} +footer .align-right p { + display: inline-block; +} +footer img { + display: inline-block; + position: relative; + top: 8px; + margin-left: 5px; + opacity: 0.8; + padding: 1px; + -webkit-transition: opacity 0.2s; + -moz-transition: opacity 0.2s; + -o-transition: opacity 0.2s; + transition: opacity 0.2s; +} + +@media (max-width: 568px) { + footer .one-third p { + margin-bottom: 0; + } + footer .two-thirds p { + margin-top: -20px; + } +} /* Intro */ -.intro .unit { padding: 10px 0 20px; } -.intro p { font-size: 1em; line-height: 1em; margin: 0; } +.intro .unit { + padding: 10px 0 20px; +} +.intro p { + font-size: 1em; + line-height: 1em; + margin: 0; +} -@media (min-width: 569px) { .intro p { font-size: 1em; } } +@media (min-width: 569px) { + .intro p { + font-size: 1em; + } +} /* About Global Names */ -.about-gn .pane { background-color: #eee; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-shadow: none; position: relative; padding: 10px; } -.about-gn h2 { font-size: 1.4em; margin-top: 1em; } -.about-gn p, .about-gn a { font-size: 1em; } -.about-gn p { margin: .75em 0; } +.about-gn .pane { + background-color: #eee; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; + text-shadow: none; + position: relative; + padding: 10px; +} +.about-gn h2 { + font-size: 1.4em; + margin-top: 1em; +} +.about-gn p, +.about-gn a { + font-size: 1em; +} +.about-gn p { + margin: 0.75em 0; +} /* Article - Used for both docs and news */ -article { background-color: #eee; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 20px; margin: 0 10px; -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); font-size: 16px; } +article { + background-color: #eee; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; + padding: 20px; + margin: 0 10px; + -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); + box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); + font-size: 16px; +} -@media (max-width: 480px) { article ul { padding-left: 20px; } } -@media (max-width: 568px) { article { margin: 0; } } -@media (min-width: 768px) { article { padding: 40px 40px 30px; font-size: 21px; } } -.doc-date { font-size: 0.7em; color: grey; } +@media (max-width: 480px) { + article ul { + padding-left: 20px; + } +} +@media (max-width: 568px) { + article { + margin: 0; + } +} +@media (min-width: 768px) { + article { + padding: 40px 40px 30px; + font-size: 21px; + } +} +.doc-date { + font-size: 0.7em; + color: grey; +} -.app-date { float: right; font-size: 0.7em; color: grey; } +.app-date { + float: right; + font-size: 0.7em; + color: grey; +} /* Right-side nav - used by both docs and news */ -aside { padding-top: 30px; } -aside h4 { text-transform: uppercase; font-size: 14px; font-weight: 700; padding: 0 0 10px 30px; margin-left: -30px; display: inline-block; border-bottom: 1px solid #001689; } -aside ul { padding-left: 0; } -aside ul:first-child { margin-top: 0; } -aside li { list-style-type: none; padding-bottom: 0.3em; } -aside li a { font-size: 16px; position: relative; } -aside li.current a:before { content: ""; border-color: transparent transparent transparent #eee; border-style: solid; border-width: 10px; width: 0; height: 0; position: absolute; top: 0; left: -30px; } +aside { + padding-top: 30px; +} +aside h4 { + text-transform: uppercase; + font-size: 14px; + font-weight: 700; + padding: 0 0 10px 30px; + margin-left: -30px; + display: inline-block; + border-bottom: 1px solid #001689; +} +aside ul { + padding-left: 0; +} +aside ul:first-child { + margin-top: 0; +} +aside li { + list-style-type: none; + padding-bottom: 0.3em; +} +aside li a { + font-size: 16px; + position: relative; +} +aside li.current a:before { + content: ""; + border-color: transparent transparent transparent #eee; + border-style: solid; + border-width: 10px; + width: 0; + height: 0; + position: absolute; + top: 0; + left: -30px; +} /* Documentation */ -.docs article { min-height: 800px; } -.docs .content { padding: 0; } - -.section-nav { text-align: center; padding-top: 40px; position: relative; background: url(../img/article-footer.png) top center no-repeat; margin: 40px -20px 10px; } -.section-nav > div { width: 49.5%; } -.section-nav a, .section-nav span { color: #fff; font-size: 16px; text-transform: uppercase; font-weight: 700; padding: 8px 12px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; /*border: 1px solid #fff;*/ -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), inset 0 1px 1px rgba(255, 255, 255, 0.5); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), inset 0 1px 1px rgba(255, 255, 255, 0.5); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), inset 0 1px 1px rgba(255, 255, 255, 0.5); background-color: #767676; } -.section-nav a:hover { color: #fff; background-color: #888; } -.section-nav .next, .section-nav .prev { position: relative; } -.section-nav .next:after, .section-nav .prev:before { font-size: 36px; color: #222; font-weight: 900; position: absolute; top: -7px; } -.section-nav .next:after { content: '\203A'; right: 10px; } -.section-nav .prev:before { content: '\2039'; left: 10px; } -.section-nav .prev, .section-nav .prev:hover { padding-left: 30px; } -.section-nav .next, .section-nav .next:hover { padding-right: 30px; } -.section-nav .disabled { opacity: .5; cursor: default; } - -.improve { padding-top: 25px; font-size: 16px; } -.improve a { color: #999; } - -.docs-nav-mobile select { color: #000; width: 100%; } +.docs article { + min-height: 800px; +} +.docs .content { + padding: 0; +} + +.section-nav { + text-align: center; + padding-top: 40px; + position: relative; + background: url(../img/article-footer.png) top center no-repeat; + margin: 40px -20px 10px; +} +.section-nav > div { + width: 49.5%; +} +.section-nav a, +.section-nav span { + color: #fff; + font-size: 16px; + text-transform: uppercase; + font-weight: 700; + padding: 8px 12px 10px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; /*border: 1px solid #fff;*/ + -webkit-box-shadow: + 0 1px 3px rgba(0, 0, 0, 0.3), + inset 0 1px 1px rgba(255, 255, 255, 0.5); + -moz-box-shadow: + 0 1px 3px rgba(0, 0, 0, 0.3), + inset 0 1px 1px rgba(255, 255, 255, 0.5); + box-shadow: + 0 1px 3px rgba(0, 0, 0, 0.3), + inset 0 1px 1px rgba(255, 255, 255, 0.5); + background-color: #767676; +} +.section-nav a:hover { + color: #fff; + background-color: #888; +} +.section-nav .next, +.section-nav .prev { + position: relative; +} +.section-nav .next:after, +.section-nav .prev:before { + font-size: 36px; + color: #222; + font-weight: 900; + position: absolute; + top: -7px; +} +.section-nav .next:after { + content: "\203A"; + right: 10px; +} +.section-nav .prev:before { + content: "\2039"; + left: 10px; +} +.section-nav .prev, +.section-nav .prev:hover { + padding-left: 30px; +} +.section-nav .next, +.section-nav .next:hover { + padding-right: 30px; +} +.section-nav .disabled { + opacity: 0.5; + cursor: default; +} + +.improve { + padding-top: 25px; + font-size: 16px; +} +.improve a { + color: #999; +} + +.docs-nav-mobile select { + color: #000; + width: 100%; +} /* News */ -h1.section { margin-top: 1em; } +h1.section { + margin-top: 1em; +} -article h2:first-child { margin-top: 0; } +article h2:first-child { + margin-top: 0; +} -.post-category, .post-meta { display: inline-block; vertical-align: middle; color: #fdba12; font-size: .8em; } +.post-category, +.post-meta { + display: inline-block; + vertical-align: middle; + color: #fdba12; + font-size: 0.8em; +} -.post-category { display: inline-block; margin-left: -30px; padding: 6px 10px 8px; padding-left: 50px; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; position: relative; -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); background-color: #9e2812; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllMjgxMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZjBkMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#007934), to(#002d13)); background-image: -webkit-linear-gradient(top, #007934 0%, #002d13 100%); background-image: -moz-linear-gradient(top, #007934 0%, #002d13 100%); background-image: -o-linear-gradient(top, #007934 0%, #002d13 100%); background-image: linear-gradient(to bottom, #007934 0%, #002d13 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007934', endColorstr='#00662c',GradientType=0 ); } -.post-category:before { content: ""; position: absolute; top: -10px; left: 0; border-color: transparent #006029 #006029 transparent; border-style: solid; border-width: 5px; width: 0; height: 0; } +.post-category { + display: inline-block; + margin-left: -30px; + padding: 6px 10px 8px; + padding-left: 50px; + -webkit-border-radius: 0 5px 5px 0; + -moz-border-radius: 0 5px 5px 0; + border-radius: 0 5px 5px 0; + position: relative; + -webkit-box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + -moz-box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + background-color: #9e2812; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllMjgxMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZjBkMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#007934), + to(#002d13) + ); + background-image: -webkit-linear-gradient(top, #007934 0%, #002d13 100%); + background-image: -moz-linear-gradient(top, #007934 0%, #002d13 100%); + background-image: -o-linear-gradient(top, #007934 0%, #002d13 100%); + background-image: linear-gradient(to bottom, #007934 0%, #002d13 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007934', endColorstr='#00662c',GradientType=0 ); +} +.post-category:before { + content: ""; + position: absolute; + top: -10px; + left: 0; + border-color: transparent #006029 #006029 transparent; + border-style: solid; + border-width: 5px; + width: 0; + height: 0; +} -.post-content img { max-width: 100%; } +.post-content img { + max-width: 100%; +} -.label { float: left; text-transform: uppercase; font-weight: 700; } +.label { + float: left; + text-transform: uppercase; + font-weight: 700; +} -@media (max-width: 568px) { .post-category { padding-left: 30px; } } -@media (min-width: 768px) { .post-category { margin-left: -50px; } } -.avatar { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; display: inline-block; vertical-align: middle; } +@media (max-width: 568px) { + .post-category { + padding-left: 30px; + } +} +@media (min-width: 768px) { + .post-category { + margin-left: -50px; + } +} +.avatar { + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; + display: inline-block; + vertical-align: middle; +} -.post-meta { padding: 5px 0; color: #666; font-weight: 600; } +.post-meta { + padding: 5px 0; + color: #666; + font-weight: 600; +} -.post-date, .post-author { margin-left: 10px; } +.post-date, +.post-author { + margin-left: 10px; +} -.news article + article { margin-top: -10px; -webkit-border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; border-top: 1px solid #555; -webkit-box-shadow: 0 -1px 0 #2f2f2f; -moz-box-shadow: 0 -1px 0 #2f2f2f; box-shadow: 0 -1px 0 #2f2f2f; } +.news article + article { + margin-top: -10px; + -webkit-border-radius: 0 0 10px 10px; + -moz-border-radius: 0 0 10px 10px; + border-radius: 0 0 10px 10px; + border-top: 1px solid #555; + -webkit-box-shadow: 0 -1px 0 #2f2f2f; + -moz-box-shadow: 0 -1px 0 #2f2f2f; + box-shadow: 0 -1px 0 #2f2f2f; +} /* Code Highlighting */ -pre, code { white-space: pre; display: inline-block; margin: 0; font: 14px/1.8em Menlo, Consolas, "Courier New", Courier, "Liberation Mono", monospace; padding: 0 0.5em; } +pre, +code { + white-space: pre; + display: inline-block; + margin: 0; + font: + 14px/1.8em Menlo, + Consolas, + "Courier New", + Courier, + "Liberation Mono", + monospace; + padding: 0 0.5em; +} -@media (min-width: 768px) { pre, code { font-size: 16px; } } -.highlight, p > pre, p > code, p > nobr > code, li > code, h5 > code, .note > code { background-color: #2b2b2b; color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.1), 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.1), 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.1), 0 -1px 0 rgba(0, 0, 0, 0.5); } +@media (min-width: 768px) { + pre, + code { + font-size: 16px; + } +} +.highlight, +p > pre, +p > code, +p > nobr > code, +li > code, +h5 > code, +.note > code { + background-color: #2b2b2b; + color: #fff; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + -webkit-box-shadow: + inset 0 1px 10px rgba(0, 0, 0, 0.3), + 0 1px 0 rgba(255, 255, 255, 0.1), + 0 -1px 0 rgba(0, 0, 0, 0.5); + -moz-box-shadow: + inset 0 1px 10px rgba(0, 0, 0, 0.3), + 0 1px 0 rgba(255, 255, 255, 0.1), + 0 -1px 0 rgba(0, 0, 0, 0.5); + box-shadow: + inset 0 1px 10px rgba(0, 0, 0, 0.3), + 0 1px 0 rgba(255, 255, 255, 0.1), + 0 -1px 0 rgba(0, 0, 0, 0.5); +} -.note code { background-color: #fff; background-color: rgba(0, 0, 0, 0.2); margin-left: 2.5px; margin-right: 2.5px; font-size: 0.8em; } +.note code { + background-color: #fff; + background-color: rgba(0, 0, 0, 0.2); + margin-left: 2.5px; + margin-right: 2.5px; + font-size: 0.8em; +} -.highlight { margin: 1em 0; padding: 10px 0; width: 100%; overflow: auto; } +.highlight { + margin: 1em 0; + padding: 10px 0; + width: 100%; + overflow: auto; +} /* HTML Elements */ -h1, h2, h3, h4, h5, h6 { margin: 0; } +h1, +h2, +h3, +h4, +h5, +h6 { + margin: 0; +} -a { color: #007934; text-decoration: none; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -o-transition: all 0.25s; transition: all 0.25s; } -a:hover { color: #da9c02; } +a { + color: #007934; + text-decoration: none; + -webkit-transition: all 0.25s; + -moz-transition: all 0.25s; + -o-transition: all 0.25s; + transition: all 0.25s; +} +a:hover { + color: #da9c02; +} -strong { font-weight: 700; } +strong { + font-weight: 700; +} -p { line-height: 1.5em; } +p { + line-height: 1.5em; +} -.left { float: left; } +.left { + float: left; +} -.right { float: right; } +.right { + float: right; +} -.align-right { text-align: right; } +.align-right { + text-align: right; +} -.align-left { text-align: left; } +.align-left { + text-align: left; +} -.align-center { text-align: center; } +.align-center { + text-align: center; +} /* Article HTML */ -article h2, article h3, article h4, article h5, article h6 { margin: 1em 0; } -article h4 { color: #007934; } -article ul li { font-size: 1em; } -article ul li p { margin: 0; } -article ul li blockquote { margin: 10px 0; } -article ul li, article ol li { margin: 0; line-height: 1.5em; } -article ul { margin: 0; padding: 0; } +article h2, +article h3, +article h4, +article h5, +article h6 { + margin: 1em 0; +} +article h4 { + color: #007934; +} +article ul li { + font-size: 1em; +} +article ul li p { + margin: 0; +} +article ul li blockquote { + margin: 10px 0; +} +article ul li, +article ol li { + margin: 0; + line-height: 1.5em; +} +article ul { + margin: 0; + padding: 0; +} -h5, h6 { font-size: 1em; font-style: italic; } +h5, +h6 { + font-size: 1em; + font-style: italic; +} -blockquote { border-left: 2px solid #777; padding-left: 20px; font-style: italic; font-size: 18px; font-weight: 500; } +blockquote { + border-left: 2px solid #777; + padding-left: 20px; + font-style: italic; + font-size: 18px; + font-weight: 500; +} /* Tables */ -table { width: 100%; background-color: #555; margin: .5em 0; color: white; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } -table a { color: #fdba12; } +table { + width: 100%; + background-color: #555; + margin: 0.5em 0; + color: white; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); + -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); +} +table a { + color: #fdba12; +} -thead { -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; color: #fff; background-color: #3a3a3a; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzNhM2EzYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZTFlMWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#3a3a3a), to(#1e1e1e)); background-image: -webkit-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); background-image: -moz-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); background-image: -o-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); background-image: linear-gradient(to bottom, #3a3a3a 0%, #1e1e1e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a3a3a', endColorstr='#1e1e1e',GradientType=0 ); } -thead th { position: relative; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); } -thead th:first-child { -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; } -thead th:last-child { -webkit-border-top-right-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; } +thead { + -webkit-border-top-left-radius: 5px; + -moz-border-radius-topleft: 5px; + border-top-left-radius: 5px; + -webkit-border-top-right-radius: 5px; + -moz-border-radius-topright: 5px; + border-top-right-radius: 5px; + color: #fff; + background-color: #3a3a3a; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzNhM2EzYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZTFlMWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#3a3a3a), + to(#1e1e1e) + ); + background-image: -webkit-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); + background-image: -moz-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); + background-image: -o-linear-gradient(top, #3a3a3a 0%, #1e1e1e 100%); + background-image: linear-gradient(to bottom, #3a3a3a 0%, #1e1e1e 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a3a3a', endColorstr='#1e1e1e',GradientType=0 ); +} +thead th { + position: relative; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); +} +thead th:first-child { + -webkit-border-top-left-radius: 5px; + -moz-border-radius-topleft: 5px; + border-top-left-radius: 5px; +} +thead th:last-child { + -webkit-border-top-right-radius: 5px; + -moz-border-radius-topright: 5px; + border-top-right-radius: 5px; +} -td { padding: .5em .75em; } +td { + padding: 0.5em 0.75em; +} -td p { margin: 0; } +td p { + margin: 0; +} -th { text-transform: uppercase; font-size: 16px; padding: .5em .75em; color: #fff; } +th { + text-transform: uppercase; + font-size: 16px; + padding: 0.5em 0.75em; + color: #fff; +} -tbody td { border-top: 1px solid #747474; border-top: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.1)), to(rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%); background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%); background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#00ffffff',GradientType=0 ); } -tbody td p { font-size: 16px; } -tbody td p code { font-size: 14px; } +tbody td { + border-top: 1px solid #747474; + border-top: 1px solid rgba(0, 0, 0, 0.1); + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(rgba(255, 255, 255, 0.1)), + to(rgba(255, 255, 255, 0)) + ); + background-image: -webkit-linear-gradient( + top, + rgba(255, 255, 255, 0.1) 0%, + rgba(255, 255, 255, 0) 100% + ); + background-image: -moz-linear-gradient( + top, + rgba(255, 255, 255, 0.1) 0%, + rgba(255, 255, 255, 0) 100% + ); + background-image: -o-linear-gradient( + top, + rgba(255, 255, 255, 0.1) 0%, + rgba(255, 255, 255, 0) 100% + ); + background-image: linear-gradient( + to bottom, + rgba(255, 255, 255, 0.1) 0%, + rgba(255, 255, 255, 0) 100% + ); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#00ffffff',GradientType=0 ); +} +tbody td p { + font-size: 16px; +} +tbody td p code { + font-size: 14px; +} -code.option, th .option, code.filter, th .filter { color: #50B600; } +code.option, +th .option, +code.filter, +th .filter { + color: #50b600; +} -code.flag, th .flag, code.output, th .output { color: #049DCE; } +code.flag, +th .flag, +code.output, +th .output { + color: #049dce; +} -code.option, code.flag, code.filter, code.output { margin-bottom: 2px; } +code.option, +code.flag, +code.filter, +code.output { + margin-bottom: 2px; +} /* Note types */ -.note { margin: 30px 0; margin-left: -30px; padding: 20px 20px 24px; padding-left: 50px; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; position: relative; -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.3); background-color: #7e6d42; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdlNmQ0MiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1YzRlMzUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#7e6d42), to(#5c4e35)); background-image: -webkit-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); background-image: -moz-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); background-image: -o-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); background-image: linear-gradient(to bottom, #7e6d42 0%, #5c4e35 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7e6d42', endColorstr='#5c4e35',GradientType=0 ); } +.note { + margin: 30px 0; + margin-left: -30px; + padding: 20px 20px 24px; + padding-left: 50px; + -webkit-border-radius: 0 5px 5px 0; + -moz-border-radius: 0 5px 5px 0; + border-radius: 0 5px 5px 0; + position: relative; + -webkit-box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + -moz-box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + box-shadow: + 0 1px 5px rgba(0, 0, 0, 0.3), + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.3); + background-color: #7e6d42; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdlNmQ0MiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1YzRlMzUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#7e6d42), + to(#5c4e35) + ); + background-image: -webkit-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); + background-image: -moz-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); + background-image: -o-linear-gradient(top, #7e6d42 0%, #5c4e35 100%); + background-image: linear-gradient(to bottom, #7e6d42 0%, #5c4e35 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7e6d42', endColorstr='#5c4e35',GradientType=0 ); +} -@media (max-width: 568px) { .note { margin-right: -30px; } } -@media (min-width: 768px) { .note { margin-left: -50px; } } -.note:before { content: ""; position: absolute; top: -10px; left: 0; border-color: transparent #222 #222 transparent; border-style: solid; border-width: 5px; width: 0; height: 0; } -.note h5, .note p { margin: 0; color: #fff; } -.note h5 { line-height: 1.5em; font-weight: 900; font-style: normal; } -.note p { font-weight: 400; font-size: .75em; padding-bottom: 0.3em; } -.note:after { content: '\2605'; color: #007934; position: absolute; top: 14px; left: 14px; font-size: 28px; font-weight: 700; } -.note a { color: #fff; font-weight: 800; } -.note ul { padding: 0; margin: 0; } -.note ul li { display: inline-block; color: #fff; font-size: 0.8em; padding: 0; margin: 1em 1em 1em 0; } +@media (max-width: 568px) { + .note { + margin-right: -30px; + } +} +@media (min-width: 768px) { + .note { + margin-left: -50px; + } +} +.note:before { + content: ""; + position: absolute; + top: -10px; + left: 0; + border-color: transparent #222 #222 transparent; + border-style: solid; + border-width: 5px; + width: 0; + height: 0; +} +.note h5, +.note p { + margin: 0; + color: #fff; +} +.note h5 { + line-height: 1.5em; + font-weight: 900; + font-style: normal; +} +.note p { + font-weight: 400; + font-size: 0.75em; + padding-bottom: 0.3em; +} +.note:after { + content: "\2605"; + color: #007934; + position: absolute; + top: 14px; + left: 14px; + font-size: 28px; + font-weight: 700; +} +.note a { + color: #fff; + font-weight: 800; +} +.note ul { + padding: 0; + margin: 0; +} +.note ul li { + display: inline-block; + color: #fff; + font-size: 0.8em; + padding: 0; + margin: 1em 1em 1em 0; +} -.application { background-color: #0389aa; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAzODlhYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDYxN2YiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#0389aa), to(#00617f)); background-image: -webkit-linear-gradient(top, #0389aa 0%, #00617f 100%); background-image: -moz-linear-gradient(top, #0389aa 0%, #00617f 100%); background-image: -o-linear-gradient(top, #0389aa 0%, #00617f 100%); background-image: linear-gradient(to bottom, #0389aa 0%, #00617f 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0389aa', endColorstr='#00617f',GradientType=0 ); } +.application { + background-color: #0389aa; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAzODlhYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDYxN2YiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#0389aa), + to(#00617f) + ); + background-image: -webkit-linear-gradient(top, #0389aa 0%, #00617f 100%); + background-image: -moz-linear-gradient(top, #0389aa 0%, #00617f 100%); + background-image: -o-linear-gradient(top, #0389aa 0%, #00617f 100%); + background-image: linear-gradient(to bottom, #0389aa 0%, #00617f 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0389aa', endColorstr='#00617f',GradientType=0 ); +} -.library { background-color: #9e2812; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllMjgxMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZjBkMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#9e2812), to(#6f0d0d)); background-image: -webkit-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); background-image: -moz-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); background-image: -o-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); background-image: linear-gradient(to bottom, #9e2812 0%, #6f0d0d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e2812', endColorstr='#6f0d0d',GradientType=0 ); } +.library { + background-color: #9e2812; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllMjgxMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZjBkMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#9e2812), + to(#6f0d0d) + ); + background-image: -webkit-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); + background-image: -moz-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); + background-image: -o-linear-gradient(top, #9e2812 0%, #6f0d0d 100%); + background-image: linear-gradient(to bottom, #9e2812 0%, #6f0d0d 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e2812', endColorstr='#6f0d0d',GradientType=0 ); +} -.unreleased { background-color: #cd9239; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NkOTIzOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMjc1MjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background-image: -webkit-gradient(linear, left top, left bottom, from(#cd9239), to(#a27528)); background-image: -webkit-linear-gradient(top, #cd9239 0%, #a27528 100%); background-image: -moz-linear-gradient(top, #cd9239 0%, #a27528 100%); background-image: -o-linear-gradient(top, #cd9239 0%, #a27528 100%); background-image: linear-gradient(to bottom, #cd9239 0%, #a27528 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cd9239', endColorstr='#a27528',GradientType=0 ); } +.unreleased { + background-color: #cd9239; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NkOTIzOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMjc1MjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); + background-image: -webkit-gradient( + linear, + left top, + left bottom, + from(#cd9239), + to(#a27528) + ); + background-image: -webkit-linear-gradient(top, #cd9239 0%, #a27528 100%); + background-image: -moz-linear-gradient(top, #cd9239 0%, #a27528 100%); + background-image: -o-linear-gradient(top, #cd9239 0%, #a27528 100%); + background-image: linear-gradient(to bottom, #cd9239 0%, #a27528 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cd9239', endColorstr='#a27528',GradientType=0 ); +} -.application:before { border-color: transparent #00617f #00617f transparent; } +.application:before { + border-color: transparent #00617f #00617f transparent; +} -.library:before { border-color: transparent #6f0d0d #6f0d0d transparent; } +.library:before { + border-color: transparent #6f0d0d #6f0d0d transparent; +} -.unreleased:before { border-color: transparent #664719 #664719 transparent; } +.unreleased:before { + border-color: transparent #664719 #664719 transparent; +} -.application:after { content: '\2A5C'; color: #fff; position: absolute; top: 15px; left: 15px; font-size: 28px; font-weight: 700; } +.application:after { + content: "\2A5C"; + color: #fff; + position: absolute; + top: 15px; + left: 15px; + font-size: 28px; + font-weight: 700; +} -.library:after { content: '\270E'; color: #fff; position: absolute; top: 15px; left: 15px; font-size: 32px; font-weight: 400; } +.library:after { + content: "\270E"; + color: #fff; + position: absolute; + top: 15px; + left: 15px; + font-size: 32px; + font-weight: 400; +} -.unreleased:after { content: '\2692'; color: #2b2a12; position: absolute; top: 8px; left: 5px; font-size: 38px; font-weight: 700; } +.unreleased:after { + content: "\2692"; + color: #2b2a12; + position: absolute; + top: 8px; + left: 5px; + font-size: 38px; + font-weight: 700; +} /* Responsive tables */ -@media (max-width: 768px) { .mobile-side-scroller { overflow-x: scroll; margin: 0 -40px; padding: 0 10px; } } -.show-on-mobiles { display: none; } +@media (max-width: 768px) { + .mobile-side-scroller { + overflow-x: scroll; + margin: 0 -40px; + padding: 0 10px; + } +} +.show-on-mobiles { + display: none; +} -@media screen and (max-width: 568px) { .show-on-mobiles { display: block !important; } - a .show-on-mobiles { display: inline !important; } } +@media screen and (max-width: 568px) { + .show-on-mobiles { + display: block !important; + } + a .show-on-mobiles { + display: inline !important; + } +} /* Helper class taken from Bootstrap. Hides an element to all devices except screen readers. */ -.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} diff --git a/io/web/templates/layout.html b/io/web/templates/layout.html index 19965c6..853960d 100644 --- a/io/web/templates/layout.html +++ b/io/web/templates/layout.html @@ -1,90 +1,125 @@ {{ define "layout" }} - + + + + GNparser + + + + + - - - GNparser - - - - - - - -
- -
-
- -
-
-
-
-
-
-

Global Names Parser ({{ .Version }})

-

Scientific Names in Detail

+
+
+ +
+
-
-
+ +
+
+
+

Global Names Parser

+

Scientific Names in Detail

+
+
+
- {{ if .HomePage }} {{ template "home" . }} - {{ else }} {{ template "doc" .}} {{ end }} + {{ if .HomePage }} {{ template "home" . }} {{ else }} {{ template "doc" .}} + {{ end }} -
-
-
-
-
-
+ {{ end }}