Anxhelo Lushka
6 years ago
41 changed files with 3 additions and 11752 deletions
@ -1,74 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang="en" dir="ltr"> |
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>I2P Styleguide</title> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/open-iconic-bootstrap.css" /> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/bootstrap.min.css"> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/styles/main.css"> |
|
||||
<link rel="shortcut icon" type="image/png" href="/i2p-styleguide/assets/images/favicon.png"/> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcesans.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcecode.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/i2p.css" rel="stylesheet"> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom border-black sticky-top rp-navbar__top"> |
|
||||
<a class="navbar-brand" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
<div class="collapse navbar-collapse " id="navbarSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto display-xs"> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/">About</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/getting-started">Getting Started</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/design/">Design</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/components/">Components</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/writing/">Writing</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
|
|
||||
<style type="text/css" media="screen"> |
|
||||
.container { |
|
||||
margin: 10px auto; |
|
||||
max-width: 600px; |
|
||||
text-align: center; |
|
||||
} |
|
||||
h1 { |
|
||||
margin: 30px 0; |
|
||||
font-size: 4em; |
|
||||
line-height: 1; |
|
||||
letter-spacing: -1px; |
|
||||
} |
|
||||
</style> |
|
||||
|
|
||||
<div class="container"> |
|
||||
<h1>404</h1> |
|
||||
|
|
||||
<p><strong>Page not found :(</strong></p> |
|
||||
<p>The requested page could not be found.</p> |
|
||||
</div> |
|
||||
|
|
||||
<script src="/i2p-styleguide/assets/javascript/modernizr.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/jquery-3.3.1.slim.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/popper.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/bootstrap.min.js"></script> |
|
||||
<!-- <script src="/i2p-styleguide/assets/javascript/run_prettify.js"></script> /* --> |
|
||||
<script type="text/javascript" src="/i2p-styleguide/assets/javascript/index.js"></script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
||||
@ -1,21 +0,0 @@ |
|||||
MIT License |
|
||||
|
|
||||
Copyright (c) 2018 Ura Design |
|
||||
|
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy |
|
||||
of this software and associated documentation files (the "Software"), to deal |
|
||||
in the Software without restriction, including without limitation the rights |
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
|
||||
copies of the Software, and to permit persons to whom the Software is |
|
||||
furnished to do so, subject to the following conditions: |
|
||||
|
|
||||
The above copyright notice and this permission notice shall be included in all |
|
||||
copies or substantial portions of the Software. |
|
||||
|
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE |
|
||||
SOFTWARE. |
|
||||
@ -1,16 +0,0 @@ |
|||||
# About |
|
||||
|
|
||||
I2P is an anonymous overlay network - a network within a network. It is intended to protect communication from dragnet surveillance and monitoring by third parties such as ISPs. |
|
||||
I2P is used by many people who care about their privacy: activists, oppressed people, journalists and whistleblowers, as well as the average person. |
|
||||
|
|
||||
# Getting started |
|
||||
|
|
||||
The I2P styleguide is based on Bootstrap, an open-source toolkit for developing with HTML, CSS, and JS. We are currently on v4.1.0. |
|
||||
|
|
||||
To use the I2P styleguide, you can download our scss style (components.scss) and import it in your project with bootstrap included. SASS is a CSS extension language. |
|
||||
|
|
||||
If you want to use SASS you can download the complete archive for the styleguide. The scss folder under assets contains all the sass files. Since we use bootstrap, we only add a few styles without modifying bootstrap core or defining new elements whenever possible. |
|
||||
|
|
||||
Bootstrap contains a few JavaScript libraries for extra interaction with the DOM. We use these libraries but do not add extra JavaScript, so that only few elements are affected if you disable JavaScript. |
|
||||
|
|
||||
This styleguide has been built using Jekyll. Jekyll is a simple, blog-aware, static site generator. You can build this yourself by installing Jekyll. |
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,23 +0,0 @@ |
|||||
@font-face { |
|
||||
font-family: 'Source Code Pro'; |
|
||||
src: local('Source Code Pro Bold'), local('SourceCodePro-Bold'), |
|
||||
url('SourceCodePro-Bold.ttf'), url('../fonts/SourceCodePro-Bold.ttf') format('truetype'); |
|
||||
font-weight: bold; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
|
||||
@font-face { |
|
||||
font-family: 'Source Code Pro'; |
|
||||
src: local('Source Code Pro SemiBold'), local('SourceCodePro-SemiBold'), |
|
||||
url('SourceCodePro-SemiBold.ttf'), url('../fonts/SourceCodePro-SemiBold.ttf') format('truetype'); |
|
||||
font-weight: 600; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
|
||||
@font-face { |
|
||||
font-family: 'Source Code Pro'; |
|
||||
src: local('Source Code Pro Regular'), local('SourceCodePro-Regular'), |
|
||||
url('SourceCodePro-Regular.ttf'), url('../fonts/SourceCodePro-Regular.ttf') format('truetype'); |
|
||||
font-weight: 400; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
@ -1,23 +0,0 @@ |
|||||
@font-face { |
|
||||
font-family: 'Source Sans Pro'; |
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), |
|
||||
url('SourceSansPro-Bold.ttf'), url('../fonts/SourceSansPro-Bold.ttf') format('truetype'); |
|
||||
font-weight: bold; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
|
||||
@font-face { |
|
||||
font-family: 'Source Sans Pro'; |
|
||||
src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'), |
|
||||
url('SourceSansPro-SemiBold.ttf'), url('../fonts/SourceSansPro-SemiBold.ttf') format('truetype'); |
|
||||
font-weight: 600; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
|
||||
@font-face { |
|
||||
font-family: 'Source Sans Pro'; |
|
||||
src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), |
|
||||
url('SourceSansPro-Regular.ttf'), url('../fonts/SourceSansPro-Regular.ttf') format('truetype'); |
|
||||
font-weight: 400; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 6.8 KiB |
|
Before Width: | Height: | Size: 74 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 9.4 KiB |
File diff suppressed because one or more lines are too long
@ -1,49 +0,0 @@ |
|||||
// $(function(){
|
|
||||
// var current = location.href;
|
|
||||
// $('.list-group-item a').each(function(){
|
|
||||
// var $this = $(this);
|
|
||||
// var route = $this[0].href.split("/").pop();
|
|
||||
//
|
|
||||
// var location = current.split("/").indexOf(route);
|
|
||||
// console.log(current);
|
|
||||
// console.log(route);
|
|
||||
// console.log(location);
|
|
||||
//
|
|
||||
// if(location >= 0) {
|
|
||||
// $('.list-group-item a').addClass('active');
|
|
||||
// }
|
|
||||
// })
|
|
||||
// });
|
|
||||
|
|
||||
$(document).ready(function () { |
|
||||
var listItems = $('.sidebar__link__light'); |
|
||||
$.each(listItems, function (key, litem) { |
|
||||
var aElement = $(litem)[0]; |
|
||||
|
|
||||
if(aElement.href == document.URL.split('#')[0]) { |
|
||||
$(litem).addClass('active'); |
|
||||
} |
|
||||
$("#sidebar-left a li").click(function() { |
|
||||
// Reset them
|
|
||||
$("#sidebar-left a li").removeClass("active"); |
|
||||
// Add to the clicked one only
|
|
||||
$(this).addClass("active"); |
|
||||
}); |
|
||||
}); |
|
||||
}); |
|
||||
|
|
||||
// $(function() {
|
|
||||
// var listItems = $('.rb-main-sidebar');
|
|
||||
// $.each(listItems, function (key, litem) {
|
|
||||
// var aElement = $(this).children(litem)[0];
|
|
||||
// console.log(aElement.href, document.URL.split('#')[0].slice(0, -1));
|
|
||||
// if(aElement.href == document.URL.split('#')[0].slice(0, -1)) {
|
|
||||
// $(litem).addClass('active');
|
|
||||
// }
|
|
||||
// });
|
|
||||
// })
|
|
||||
|
|
||||
$('.rb-sidebar').on('click',function() { |
|
||||
$('.rb-sidebar.active').removeClass('active'); |
|
||||
$(this).addClass('active'); |
|
||||
}); |
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,64 +0,0 @@ |
|||||
!function(){/* |
|
||||
|
|
||||
Copyright (C) 2013 Google Inc. |
|
||||
|
|
||||
Licensed under the Apache License, Version 2.0 (the "License"); |
|
||||
you may not use this file except in compliance with the License. |
|
||||
You may obtain a copy of the License at |
|
||||
|
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
|
||||
|
|
||||
Unless required by applicable law or agreed to in writing, software |
|
||||
distributed under the License is distributed on an "AS IS" BASIS, |
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|
||||
See the License for the specific language governing permissions and |
|
||||
limitations under the License. |
|
||||
|
|
||||
Copyright (C) 2006 Google Inc. |
|
||||
|
|
||||
Licensed under the Apache License, Version 2.0 (the "License"); |
|
||||
you may not use this file except in compliance with the License. |
|
||||
You may obtain a copy of the License at |
|
||||
|
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
|
||||
|
|
||||
Unless required by applicable law or agreed to in writing, software |
|
||||
distributed under the License is distributed on an "AS IS" BASIS, |
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|
||||
See the License for the specific language governing permissions and |
|
||||
limitations under the License. |
|
||||
*/ |
|
||||
(function(){function aa(g){function r(){try{L.doScroll("left")}catch(ba){k.setTimeout(r,50);return}x("poll")}function x(r){if("readystatechange"!=r.type||"complete"==z.readyState)("load"==r.type?k:z)[B](n+r.type,x,!1),!l&&(l=!0)&&g.call(k,r.type||r)}var X=z.addEventListener,l=!1,E=!0,v=X?"addEventListener":"attachEvent",B=X?"removeEventListener":"detachEvent",n=X?"":"on";if("complete"==z.readyState)g.call(k,"lazy");else{if(z.createEventObject&&L.doScroll){try{E=!k.frameElement}catch(ba){}E&&r()}z[v](n+ |
|
||||
"DOMContentLoaded",x,!1);z[v](n+"readystatechange",x,!1);k[v](n+"load",x,!1)}}function T(){U&&aa(function(){var g=M.length;ca(g?function(){for(var r=0;r<g;++r)(function(g){k.setTimeout(function(){k.exports[M[g]].apply(k,arguments)},0)})(r)}:void 0)})}for(var k=window,z=document,L=z.documentElement,N=z.head||z.getElementsByTagName("head")[0]||L,B="",F=z.getElementsByTagName("script"),l=F.length;0<=--l;){var O=F[l],Y=O.src.match(/^[^?#]*\/run_prettify\.js(\?[^#]*)?(?:#.*)?$/);if(Y){B=Y[1]||"";O.parentNode.removeChild(O); |
|
||||
break}}var U=!0,H=[],P=[],M=[];B.replace(/[?&]([^&=]+)=([^&]+)/g,function(g,r,x){x=decodeURIComponent(x);r=decodeURIComponent(r);"autorun"==r?U=!/^[0fn]/i.test(x):"lang"==r?H.push(x):"skin"==r?P.push(x):"callback"==r&&M.push(x)});l=0;for(B=H.length;l<B;++l)(function(){var g=z.createElement("script");g.onload=g.onerror=g.onreadystatechange=function(){!g||g.readyState&&!/loaded|complete/.test(g.readyState)||(g.onerror=g.onload=g.onreadystatechange=null,--S,S||k.setTimeout(T,0),g.parentNode&&g.parentNode.removeChild(g), |
|
||||
g=null)};g.type="text/javascript";g.src="https://cdn.rawgit.com/google/code-prettify/master/loader/lang-"+encodeURIComponent(H[l])+".js";N.insertBefore(g,N.firstChild)})(H[l]);for(var S=H.length,F=[],l=0,B=P.length;l<B;++l)F.push("https://cdn.rawgit.com/google/code-prettify/master/loader/skins/"+encodeURIComponent(P[l])+".css");F.push("https://cdn.rawgit.com/google/code-prettify/master/loader/prettify.css");(function(g){function r(l){if(l!==x){var k=z.createElement("link");k.rel="stylesheet";k.type= |
|
||||
"text/css";l+1<x&&(k.error=k.onerror=function(){r(l+1)});k.href=g[l];N.appendChild(k)}}var x=g.length;r(0)})(F);var ca=function(){"undefined"!==typeof window&&(window.PR_SHOULD_USE_CONTINUATION=!0);var g;(function(){function r(a){function d(e){var a=e.charCodeAt(0);if(92!==a)return a;var c=e.charAt(1);return(a=k[c])?a:"0"<=c&&"7">=c?parseInt(e.substring(1),8):"u"===c||"x"===c?parseInt(e.substring(2),16):e.charCodeAt(1)}function f(e){if(32>e)return(16>e?"\\x0":"\\x")+e.toString(16);e=String.fromCharCode(e); |
|
||||
return"\\"===e||"-"===e||"]"===e||"^"===e?"\\"+e:e}function c(e){var c=e.substring(1,e.length-1).match(RegExp("\\\\u[0-9A-Fa-f]{4}|\\\\x[0-9A-Fa-f]{2}|\\\\[0-3][0-7]{0,2}|\\\\[0-7]{1,2}|\\\\[\\s\\S]|-|[^-\\\\]","g"));e=[];var a="^"===c[0],b=["["];a&&b.push("^");for(var a=a?1:0,h=c.length;a<h;++a){var m=c[a];if(/\\[bdsw]/i.test(m))b.push(m);else{var m=d(m),p;a+2<h&&"-"===c[a+1]?(p=d(c[a+2]),a+=2):p=m;e.push([m,p]);65>p||122<m||(65>p||90<m||e.push([Math.max(65,m)|32,Math.min(p,90)|32]),97>p||122<m|| |
|
||||
e.push([Math.max(97,m)&-33,Math.min(p,122)&-33]))}}e.sort(function(e,a){return e[0]-a[0]||a[1]-e[1]});c=[];h=[];for(a=0;a<e.length;++a)m=e[a],m[0]<=h[1]+1?h[1]=Math.max(h[1],m[1]):c.push(h=m);for(a=0;a<c.length;++a)m=c[a],b.push(f(m[0])),m[1]>m[0]&&(m[1]+1>m[0]&&b.push("-"),b.push(f(m[1])));b.push("]");return b.join("")}function g(e){for(var a=e.source.match(RegExp("(?:\\[(?:[^\\x5C\\x5D]|\\\\[\\s\\S])*\\]|\\\\u[A-Fa-f0-9]{4}|\\\\x[A-Fa-f0-9]{2}|\\\\[0-9]+|\\\\[^ux0-9]|\\(\\?[:!=]|[\\(\\)\\^]|[^\\x5B\\x5C\\(\\)\\^]+)", |
|
||||
"g")),b=a.length,d=[],h=0,m=0;h<b;++h){var p=a[h];"("===p?++m:"\\"===p.charAt(0)&&(p=+p.substring(1))&&(p<=m?d[p]=-1:a[h]=f(p))}for(h=1;h<d.length;++h)-1===d[h]&&(d[h]=++r);for(m=h=0;h<b;++h)p=a[h],"("===p?(++m,d[m]||(a[h]="(?:")):"\\"===p.charAt(0)&&(p=+p.substring(1))&&p<=m&&(a[h]="\\"+d[p]);for(h=0;h<b;++h)"^"===a[h]&&"^"!==a[h+1]&&(a[h]="");if(e.ignoreCase&&A)for(h=0;h<b;++h)p=a[h],e=p.charAt(0),2<=p.length&&"["===e?a[h]=c(p):"\\"!==e&&(a[h]=p.replace(/[a-zA-Z]/g,function(a){a=a.charCodeAt(0); |
|
||||
return"["+String.fromCharCode(a&-33,a|32)+"]"}));return a.join("")}for(var r=0,A=!1,q=!1,I=0,b=a.length;I<b;++I){var t=a[I];if(t.ignoreCase)q=!0;else if(/[a-z]/i.test(t.source.replace(/\\u[0-9a-f]{4}|\\x[0-9a-f]{2}|\\[^ux]/gi,""))){A=!0;q=!1;break}}for(var k={b:8,t:9,n:10,v:11,f:12,r:13},u=[],I=0,b=a.length;I<b;++I){t=a[I];if(t.global||t.multiline)throw Error(""+t);u.push("(?:"+g(t)+")")}return new RegExp(u.join("|"),q?"gi":"g")}function l(a,d){function f(a){var b=a.nodeType;if(1==b){if(!c.test(a.className)){for(b= |
|
||||
a.firstChild;b;b=b.nextSibling)f(b);b=a.nodeName.toLowerCase();if("br"===b||"li"===b)g[q]="\n",A[q<<1]=r++,A[q++<<1|1]=a}}else if(3==b||4==b)b=a.nodeValue,b.length&&(b=d?b.replace(/\r\n?/g,"\n"):b.replace(/[ \t\r\n]+/g," "),g[q]=b,A[q<<1]=r,r+=b.length,A[q++<<1|1]=a)}var c=/(?:^|\s)nocode(?:\s|$)/,g=[],r=0,A=[],q=0;f(a);return{a:g.join("").replace(/\n$/,""),c:A}}function k(a,d,f,c,g){f&&(a={h:a,l:1,j:null,m:null,a:f,c:null,i:d,g:null},c(a),g.push.apply(g,a.g))}function z(a){for(var d=void 0,f=a.firstChild;f;f= |
|
||||
f.nextSibling)var c=f.nodeType,d=1===c?d?a:f:3===c?S.test(f.nodeValue)?a:d:d;return d===a?void 0:d}function E(a,d){function f(a){for(var q=a.i,r=a.h,b=[q,"pln"],t=0,A=a.a.match(g)||[],u={},e=0,l=A.length;e<l;++e){var D=A[e],w=u[D],h=void 0,m;if("string"===typeof w)m=!1;else{var p=c[D.charAt(0)];if(p)h=D.match(p[1]),w=p[0];else{for(m=0;m<n;++m)if(p=d[m],h=D.match(p[1])){w=p[0];break}h||(w="pln")}!(m=5<=w.length&&"lang-"===w.substring(0,5))||h&&"string"===typeof h[1]||(m=!1,w="src");m||(u[D]=w)}p=t; |
|
||||
t+=D.length;if(m){m=h[1];var C=D.indexOf(m),G=C+m.length;h[2]&&(G=D.length-h[2].length,C=G-m.length);w=w.substring(5);k(r,q+p,D.substring(0,C),f,b);k(r,q+p+C,m,F(w,m),b);k(r,q+p+G,D.substring(G),f,b)}else b.push(q+p,w)}a.g=b}var c={},g;(function(){for(var f=a.concat(d),q=[],k={},b=0,t=f.length;b<t;++b){var n=f[b],u=n[3];if(u)for(var e=u.length;0<=--e;)c[u.charAt(e)]=n;n=n[1];u=""+n;k.hasOwnProperty(u)||(q.push(n),k[u]=null)}q.push(/[\0-\uffff]/);g=r(q)})();var n=d.length;return f}function v(a){var d= |
|
||||
[],f=[];a.tripleQuotedStrings?d.push(["str",/^(?:\'\'\'(?:[^\'\\]|\\[\s\S]|\'{1,2}(?=[^\']))*(?:\'\'\'|$)|\"\"\"(?:[^\"\\]|\\[\s\S]|\"{1,2}(?=[^\"]))*(?:\"\"\"|$)|\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$))/,null,"'\""]):a.multiLineStrings?d.push(["str",/^(?:\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$)|\`(?:[^\\\`]|\\[\s\S])*(?:\`|$))/,null,"'\"`"]):d.push(["str",/^(?:\'(?:[^\\\'\r\n]|\\.)*(?:\'|$)|\"(?:[^\\\"\r\n]|\\.)*(?:\"|$))/,null,"\"'"]);a.verbatimStrings&& |
|
||||
f.push(["str",/^@\"(?:[^\"]|\"\")*(?:\"|$)/,null]);var c=a.hashComments;c&&(a.cStyleComments?(1<c?d.push(["com",/^#(?:##(?:[^#]|#(?!##))*(?:###|$)|.*)/,null,"#"]):d.push(["com",/^#(?:(?:define|e(?:l|nd)if|else|error|ifn?def|include|line|pragma|undef|warning)\b|[^\r\n]*)/,null,"#"]),f.push(["str",/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h(?:h|pp|\+\+)?|[a-z]\w*)>/,null])):d.push(["com",/^#[^\r\n]*/,null,"#"]));a.cStyleComments&&(f.push(["com",/^\/\/[^\r\n]*/,null]),f.push(["com",/^\/\*[\s\S]*?(?:\*\/|$)/, |
|
||||
null]));if(c=a.regexLiterals){var g=(c=1<c?"":"\n\r")?".":"[\\S\\s]";f.push(["lang-regex",RegExp("^(?:^^\\.?|[+-]|[!=]=?=?|\\#|%=?|&&?=?|\\(|\\*=?|[+\\-]=|->|\\/=?|::?|<<?=?|>>?>?=?|,|;|\\?|@|\\[|~|{|\\^\\^?=?|\\|\\|?=?|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\\s*("+("/(?=[^/*"+c+"])(?:[^/\\x5B\\x5C"+c+"]|\\x5C"+g+"|\\x5B(?:[^\\x5C\\x5D"+c+"]|\\x5C"+g+")*(?:\\x5D|$))+/")+")")])}(c=a.types)&&f.push(["typ",c]);c=(""+a.keywords).replace(/^ | $/g,"");c.length&&f.push(["kwd", |
|
||||
new RegExp("^(?:"+c.replace(/[\s,]+/g,"|")+")\\b"),null]);d.push(["pln",/^\s+/,null," \r\n\t\u00a0"]);c="^.[^\\s\\w.$@'\"`/\\\\]*";a.regexLiterals&&(c+="(?!s*/)");f.push(["lit",/^@[a-z_$][a-z_$@0-9]*/i,null],["typ",/^(?:[@_]?[A-Z]+[a-z][A-Za-z_$@0-9]*|\w+_t\b)/,null],["pln",/^[a-z_$][a-z_$@0-9]*/i,null],["lit",/^(?:0x[a-f0-9]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+\-]?\d+)?)[a-z]*/i,null,"0123456789"],["pln",/^\\[\s\S]?/,null],["pun",new RegExp(c),null]);return E(d,f)}function B(a,d,f){function c(a){var b= |
|
||||
a.nodeType;if(1==b&&!r.test(a.className))if("br"===a.nodeName.toLowerCase())g(a),a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)c(a);else if((3==b||4==b)&&f){var e=a.nodeValue,d=e.match(n);d&&(b=e.substring(0,d.index),a.nodeValue=b,(e=e.substring(d.index+d[0].length))&&a.parentNode.insertBefore(q.createTextNode(e),a.nextSibling),g(a),b||a.parentNode.removeChild(a))}}function g(a){function c(a,b){var e=b?a.cloneNode(!1):a,p=a.parentNode;if(p){var p=c(p,1),d=a.nextSibling; |
|
||||
p.appendChild(e);for(var f=d;f;f=d)d=f.nextSibling,p.appendChild(f)}return e}for(;!a.nextSibling;)if(a=a.parentNode,!a)return;a=c(a.nextSibling,0);for(var e;(e=a.parentNode)&&1===e.nodeType;)a=e;b.push(a)}for(var r=/(?:^|\s)nocode(?:\s|$)/,n=/\r\n?|\n/,q=a.ownerDocument,k=q.createElement("li");a.firstChild;)k.appendChild(a.firstChild);for(var b=[k],t=0;t<b.length;++t)c(b[t]);d===(d|0)&&b[0].setAttribute("value",d);var l=q.createElement("ol");l.className="linenums";d=Math.max(0,d-1|0)||0;for(var t= |
|
||||
0,u=b.length;t<u;++t)k=b[t],k.className="L"+(t+d)%10,k.firstChild||k.appendChild(q.createTextNode("\u00a0")),l.appendChild(k);a.appendChild(l)}function n(a,d){for(var f=d.length;0<=--f;){var c=d[f];V.hasOwnProperty(c)?Q.console&&console.warn("cannot override language handler %s",c):V[c]=a}}function F(a,d){a&&V.hasOwnProperty(a)||(a=/^\s*</.test(d)?"default-markup":"default-code");return V[a]}function H(a){var d=a.j;try{var f=l(a.h,a.l),c=f.a;a.a=c;a.c=f.c;a.i=0;F(d,c)(a);var g=/\bMSIE\s(\d+)/.exec(navigator.userAgent), |
|
||||
g=g&&8>=+g[1],d=/\n/g,r=a.a,k=r.length,f=0,q=a.c,n=q.length,c=0,b=a.g,t=b.length,v=0;b[t]=k;var u,e;for(e=u=0;e<t;)b[e]!==b[e+2]?(b[u++]=b[e++],b[u++]=b[e++]):e+=2;t=u;for(e=u=0;e<t;){for(var x=b[e],z=b[e+1],w=e+2;w+2<=t&&b[w+1]===z;)w+=2;b[u++]=x;b[u++]=z;e=w}b.length=u;var h=a.h;a="";h&&(a=h.style.display,h.style.display="none");try{for(;c<n;){var m=q[c+2]||k,p=b[v+2]||k,w=Math.min(m,p),C=q[c+1],G;if(1!==C.nodeType&&(G=r.substring(f,w))){g&&(G=G.replace(d,"\r"));C.nodeValue=G;var Z=C.ownerDocument, |
|
||||
W=Z.createElement("span");W.className=b[v+1];var B=C.parentNode;B.replaceChild(W,C);W.appendChild(C);f<m&&(q[c+1]=C=Z.createTextNode(r.substring(w,m)),B.insertBefore(C,W.nextSibling))}f=w;f>=m&&(c+=2);f>=p&&(v+=2)}}finally{h&&(h.style.display=a)}}catch(y){Q.console&&console.log(y&&y.stack||y)}}var Q="undefined"!==typeof window?window:{},J=["break,continue,do,else,for,if,return,while"],K=[[J,"auto,case,char,const,default,double,enum,extern,float,goto,inline,int,long,register,restrict,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"], |
|
||||
"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],R=[K,"alignas,alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,delegate,dynamic_cast,explicit,export,friend,generic,late_check,mutable,namespace,noexcept,noreturn,nullptr,property,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],L=[K,"abstract,assert,boolean,byte,extends,finally,final,implements,import,instanceof,interface,null,native,package,strictfp,super,synchronized,throws,transient"], |
|
||||
M=[K,"abstract,add,alias,as,ascending,async,await,base,bool,by,byte,checked,decimal,delegate,descending,dynamic,event,finally,fixed,foreach,from,get,global,group,implicit,in,interface,internal,into,is,join,let,lock,null,object,out,override,orderby,params,partial,readonly,ref,remove,sbyte,sealed,select,set,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,value,var,virtual,where,yield"],K=[K,"abstract,async,await,constructor,debugger,enum,eval,export,from,function,get,import,implements,instanceof,interface,let,null,of,set,undefined,var,with,yield,Infinity,NaN"], |
|
||||
N=[J,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],O=[J,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],J=[J,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],P=/^(DIR|FILE|array|vector|(de|priority_)?queue|(forward_)?list|stack|(const_)?(reverse_)?iterator|(unordered_)?(multi)?(set|map)|bitset|u?(int|float)\d*)\b/, |
|
||||
S=/\S/,T=v({keywords:[R,M,L,K,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",N,O,J],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}),V={};n(T,["default-code"]);n(E([],[["pln",/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],["com",/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-", |
|
||||
/^<xmp\b[^>]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),"default-markup htm html mxml xhtml xml xsl".split(" "));n(E([["pln",/^[\s]+/,null," \t\r\n"],["atv",/^(?:\"[^\"]*\"?|\'[^\']*\'?)/,null,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w.:-]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^>\'\"\s]*(?:[^>\'\"\s\/]|\/(?=\s)))/], |
|
||||
["pun",/^[=<>\/]+/],["lang-js",/^on\w+\s*=\s*\"([^\"]+)\"/i],["lang-js",/^on\w+\s*=\s*\'([^\']+)\'/i],["lang-js",/^on\w+\s*=\s*([^\"\'>\s]+)/i],["lang-css",/^style\s*=\s*\"([^\"]+)\"/i],["lang-css",/^style\s*=\s*\'([^\']+)\'/i],["lang-css",/^style\s*=\s*([^\"\'>\s]+)/i]]),["in.tag"]);n(E([],[["atv",/^[\s\S]+/]]),["uq.val"]);n(v({keywords:R,hashComments:!0,cStyleComments:!0,types:P}),"c cc cpp cxx cyc m".split(" "));n(v({keywords:"null,true,false"}),["json"]);n(v({keywords:M,hashComments:!0,cStyleComments:!0, |
|
||||
verbatimStrings:!0,types:P}),["cs"]);n(v({keywords:L,cStyleComments:!0}),["java"]);n(v({keywords:J,hashComments:!0,multiLineStrings:!0}),["bash","bsh","csh","sh"]);n(v({keywords:N,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}),["cv","py","python"]);n(v({keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",hashComments:!0,multiLineStrings:!0,regexLiterals:2}), |
|
||||
["perl","pl","pm"]);n(v({keywords:O,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb","ruby"]);n(v({keywords:K,cStyleComments:!0,regexLiterals:!0}),["javascript","js","ts","typescript"]);n(v({keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,throw,true,try,unless,until,when,while,yes",hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,regexLiterals:!0}),["coffee"]);n(E([],[["str",/^[\s\S]+/]]), |
|
||||
["regex"]);var U=Q.PR={createSimpleLexer:E,registerLangHandler:n,sourceDecorator:v,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ",prettyPrintOne:function(a,d,f){f=f||!1;d=d||null;var c=document.createElement("div");c.innerHTML="<pre>"+a+"</pre>";c=c.firstChild;f&&B(c,f,!0);H({j:d,m:f,h:c,l:1,a:null,i:null,c:null,g:null}); |
|
||||
return c.innerHTML},prettyPrint:g=function(a,d){function f(){for(var c=Q.PR_SHOULD_USE_CONTINUATION?b.now()+250:Infinity;t<r.length&&b.now()<c;t++){for(var d=r[t],k=h,n=d;n=n.previousSibling;){var q=n.nodeType,l=(7===q||8===q)&&n.nodeValue;if(l?!/^\??prettify\b/.test(l):3!==q||/\S/.test(n.nodeValue))break;if(l){k={};l.replace(/\b(\w+)=([\w:.%+-]+)/g,function(a,b,c){k[b]=c});break}}n=d.className;if((k!==h||u.test(n))&&!e.test(n)){q=!1;for(l=d.parentNode;l;l=l.parentNode)if(w.test(l.tagName)&&l.className&& |
|
||||
u.test(l.className)){q=!0;break}if(!q){d.className+=" prettyprinted";q=k.lang;if(!q){var q=n.match(v),A;!q&&(A=z(d))&&D.test(A.tagName)&&(q=A.className.match(v));q&&(q=q[1])}if(x.test(d.tagName))l=1;else var l=d.currentStyle,y=g.defaultView,l=(l=l?l.whiteSpace:y&&y.getComputedStyle?y.getComputedStyle(d,null).getPropertyValue("white-space"):0)&&"pre"===l.substring(0,3);y=k.linenums;(y="true"===y||+y)||(y=(y=n.match(/\blinenums\b(?::(\d+))?/))?y[1]&&y[1].length?+y[1]:!0:!1);y&&B(d,y,l);H({j:q,h:d,m:y, |
|
||||
l:l,a:null,i:null,c:null,g:null})}}}t<r.length?Q.setTimeout(f,250):"function"===typeof a&&a()}for(var c=d||document.body,g=c.ownerDocument||document,c=[c.getElementsByTagName("pre"),c.getElementsByTagName("code"),c.getElementsByTagName("xmp")],r=[],k=0;k<c.length;++k)for(var n=0,l=c[k].length;n<l;++n)r.push(c[k][n]);var c=null,b=Date;b.now||(b={now:function(){return+new Date}});var t=0,v=/\blang(?:uage)?-([\w.]+)(?!\S)/,u=/\bprettyprint\b/,e=/\bprettyprinted\b/,x=/pre|xmp/i,D=/^code$/i,w=/^(?:pre|code|xmp)$/i, |
|
||||
h={};f()}},R=Q.define;"function"===typeof R&&R.amd&&R("google-code-prettify",[],function(){return U})})();return g}();S||k.setTimeout(T,0)})();}() |
|
||||
@ -1,196 +0,0 @@ |
|||||
/** Reset some basic elements */ |
|
||||
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; } |
|
||||
|
|
||||
/** Basic styling */ |
|
||||
body { font: 400 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; color: #111; background-color: #fdfdfd; -webkit-text-size-adjust: 100%; -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; display: flex; min-height: 100vh; flex-direction: column; } |
|
||||
|
|
||||
/** Set `margin-bottom` to maintain vertical rhythm */ |
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre, ul, ol, dl, figure, .highlight { margin-bottom: 15px; } |
|
||||
|
|
||||
/** `main` element */ |
|
||||
main { display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ } |
|
||||
|
|
||||
/** Images */ |
|
||||
img { max-width: 100%; vertical-align: middle; } |
|
||||
|
|
||||
/** Figures */ |
|
||||
figure > img { display: block; } |
|
||||
|
|
||||
figcaption { font-size: 14px; } |
|
||||
|
|
||||
/** Lists */ |
|
||||
ul, ol { margin-left: 30px; } |
|
||||
|
|
||||
li > ul, li > ol { margin-bottom: 0; } |
|
||||
|
|
||||
/** Headings */ |
|
||||
h1, h2, h3, h4, h5, h6 { font-weight: 400; } |
|
||||
|
|
||||
/** Links */ |
|
||||
a { color: #2a7ae2; text-decoration: none; } |
|
||||
a:visited { color: #1756a9; } |
|
||||
a:hover { color: #111; text-decoration: underline; } |
|
||||
.social-media-list a:hover { text-decoration: none; } |
|
||||
.social-media-list a:hover .username { text-decoration: underline; } |
|
||||
|
|
||||
/** Blockquotes */ |
|
||||
blockquote { color: #828282; border-left: 4px solid #e8e8e8; padding-left: 15px; font-size: 18px; letter-spacing: -1px; font-style: italic; } |
|
||||
blockquote > :last-child { margin-bottom: 0; } |
|
||||
|
|
||||
/** Code formatting */ |
|
||||
pre, code { font-size: 15px; border: 1px solid #e8e8e8; border-radius: 3px; background-color: #eef; } |
|
||||
|
|
||||
code { padding: 1px 5px; } |
|
||||
|
|
||||
pre { padding: 8px 12px; overflow-x: auto; } |
|
||||
pre > code { border: 0; padding-right: 0; padding-left: 0; } |
|
||||
|
|
||||
/** Wrapper */ |
|
||||
.wrapper { max-width: -webkit-calc(800px - (30px * 2)); max-width: calc(800px - (30px * 2)); margin-right: auto; margin-left: auto; padding-right: 30px; padding-left: 30px; } |
|
||||
@media screen and (max-width: 800px) { .wrapper { max-width: -webkit-calc(800px - (30px)); max-width: calc(800px - (30px)); padding-right: 15px; padding-left: 15px; } } |
|
||||
|
|
||||
/** Clearfix */ |
|
||||
.wrapper:after, .footer-col-wrapper:after { content: ""; display: table; clear: both; } |
|
||||
|
|
||||
/** Icons */ |
|
||||
.svg-icon { width: 16px; height: 16px; display: inline-block; fill: #828282; padding-right: 5px; vertical-align: text-top; } |
|
||||
|
|
||||
.social-media-list li + li { padding-top: 5px; } |
|
||||
|
|
||||
/** Tables */ |
|
||||
table { margin-bottom: 30px; width: 100%; text-align: left; color: #3f3f3f; border-collapse: collapse; border: 1px solid #e8e8e8; } |
|
||||
table tr:nth-child(even) { background-color: #f7f7f7; } |
|
||||
table th, table td { padding: 10px 15px; } |
|
||||
table th { background-color: #f0f0f0; border: 1px solid #dedede; border-bottom-color: #c9c9c9; } |
|
||||
table td { border: 1px solid #e8e8e8; } |
|
||||
|
|
||||
/** Site header */ |
|
||||
.site-header { border-top: 5px solid #424242; border-bottom: 1px solid #e8e8e8; min-height: 55.95px; position: relative; } |
|
||||
|
|
||||
.site-title { font-size: 26px; font-weight: 300; line-height: 54px; letter-spacing: -1px; margin-bottom: 0; float: left; } |
|
||||
.site-title, .site-title:visited { color: #424242; } |
|
||||
|
|
||||
.site-nav { float: right; line-height: 54px; } |
|
||||
.site-nav .nav-trigger { display: none; } |
|
||||
.site-nav .menu-icon { display: none; } |
|
||||
.site-nav .page-link { color: #111; line-height: 1.5; } |
|
||||
.site-nav .page-link:not(:last-child) { margin-right: 20px; } |
|
||||
@media screen and (max-width: 600px) { .site-nav { position: absolute; top: 9px; right: 15px; background-color: #fdfdfd; border: 1px solid #e8e8e8; border-radius: 5px; text-align: right; } |
|
||||
.site-nav label[for="nav-trigger"] { display: block; float: right; width: 36px; height: 36px; z-index: 2; cursor: pointer; } |
|
||||
.site-nav .menu-icon { display: block; float: right; width: 36px; height: 26px; line-height: 0; padding-top: 10px; text-align: center; } |
|
||||
.site-nav .menu-icon > svg { fill: #424242; } |
|
||||
.site-nav input ~ .trigger { clear: both; display: none; } |
|
||||
.site-nav input:checked ~ .trigger { display: block; padding-bottom: 5px; } |
|
||||
.site-nav .page-link { display: block; padding: 5px 10px; margin-left: 20px; } |
|
||||
.site-nav .page-link:not(:last-child) { margin-right: 0; } } |
|
||||
|
|
||||
/** Site footer */ |
|
||||
.site-footer { border-top: 1px solid #e8e8e8; padding: 30px 0; } |
|
||||
|
|
||||
.footer-heading { font-size: 18px; margin-bottom: 15px; } |
|
||||
|
|
||||
.contact-list, .social-media-list { list-style: none; margin-left: 0; } |
|
||||
|
|
||||
.footer-col-wrapper { font-size: 15px; color: #828282; margin-left: -15px; } |
|
||||
|
|
||||
.footer-col { float: left; margin-bottom: 15px; padding-left: 15px; } |
|
||||
|
|
||||
.footer-col-1 { width: -webkit-calc(35% - (30px / 2)); width: calc(35% - (30px / 2)); } |
|
||||
|
|
||||
.footer-col-2 { width: -webkit-calc(20% - (30px / 2)); width: calc(20% - (30px / 2)); } |
|
||||
|
|
||||
.footer-col-3 { width: -webkit-calc(45% - (30px / 2)); width: calc(45% - (30px / 2)); } |
|
||||
|
|
||||
@media screen and (max-width: 800px) { .footer-col-1, .footer-col-2 { width: -webkit-calc(50% - (30px / 2)); width: calc(50% - (30px / 2)); } |
|
||||
.footer-col-3 { width: -webkit-calc(100% - (30px / 2)); width: calc(100% - (30px / 2)); } } |
|
||||
@media screen and (max-width: 600px) { .footer-col { float: none; width: -webkit-calc(100% - (30px / 2)); width: calc(100% - (30px / 2)); } } |
|
||||
/** Page content */ |
|
||||
.page-content { padding: 30px 0; flex: 1; } |
|
||||
|
|
||||
.page-heading { font-size: 32px; } |
|
||||
|
|
||||
.post-list-heading { font-size: 28px; } |
|
||||
|
|
||||
.post-list { margin-left: 0; list-style: none; } |
|
||||
.post-list > li { margin-bottom: 30px; } |
|
||||
|
|
||||
.post-meta { font-size: 14px; color: #828282; } |
|
||||
|
|
||||
.post-link { display: block; font-size: 24px; } |
|
||||
|
|
||||
/** Posts */ |
|
||||
.post-header { margin-bottom: 30px; } |
|
||||
|
|
||||
.post-title { font-size: 42px; letter-spacing: -1px; line-height: 1; } |
|
||||
@media screen and (max-width: 800px) { .post-title { font-size: 36px; } } |
|
||||
|
|
||||
.post-content { margin-bottom: 30px; } |
|
||||
.post-content h2 { font-size: 32px; } |
|
||||
@media screen and (max-width: 800px) { .post-content h2 { font-size: 28px; } } |
|
||||
.post-content h3 { font-size: 26px; } |
|
||||
@media screen and (max-width: 800px) { .post-content h3 { font-size: 22px; } } |
|
||||
.post-content h4 { font-size: 20px; } |
|
||||
@media screen and (max-width: 800px) { .post-content h4 { font-size: 18px; } } |
|
||||
|
|
||||
/** Syntax highlighting styles */ |
|
||||
.highlight { background: #fff; } |
|
||||
.highlighter-rouge .highlight { background: #eef; } |
|
||||
.highlight .c { color: #998; font-style: italic; } |
|
||||
.highlight .err { color: #a61717; background-color: #e3d2d2; } |
|
||||
.highlight .k { font-weight: bold; } |
|
||||
.highlight .o { font-weight: bold; } |
|
||||
.highlight .cm { color: #998; font-style: italic; } |
|
||||
.highlight .cp { color: #999; font-weight: bold; } |
|
||||
.highlight .c1 { color: #998; font-style: italic; } |
|
||||
.highlight .cs { color: #999; font-weight: bold; font-style: italic; } |
|
||||
.highlight .gd { color: #000; background-color: #fdd; } |
|
||||
.highlight .gd .x { color: #000; background-color: #faa; } |
|
||||
.highlight .ge { font-style: italic; } |
|
||||
.highlight .gr { color: #a00; } |
|
||||
.highlight .gh { color: #999; } |
|
||||
.highlight .gi { color: #000; background-color: #dfd; } |
|
||||
.highlight .gi .x { color: #000; background-color: #afa; } |
|
||||
.highlight .go { color: #888; } |
|
||||
.highlight .gp { color: #555; } |
|
||||
.highlight .gs { font-weight: bold; } |
|
||||
.highlight .gu { color: #aaa; } |
|
||||
.highlight .gt { color: #a00; } |
|
||||
.highlight .kc { font-weight: bold; } |
|
||||
.highlight .kd { font-weight: bold; } |
|
||||
.highlight .kp { font-weight: bold; } |
|
||||
.highlight .kr { font-weight: bold; } |
|
||||
.highlight .kt { color: #458; font-weight: bold; } |
|
||||
.highlight .m { color: #099; } |
|
||||
.highlight .s { color: #d14; } |
|
||||
.highlight .na { color: #008080; } |
|
||||
.highlight .nb { color: #0086B3; } |
|
||||
.highlight .nc { color: #458; font-weight: bold; } |
|
||||
.highlight .no { color: #008080; } |
|
||||
.highlight .ni { color: #800080; } |
|
||||
.highlight .ne { color: #900; font-weight: bold; } |
|
||||
.highlight .nf { color: #900; font-weight: bold; } |
|
||||
.highlight .nn { color: #555; } |
|
||||
.highlight .nt { color: #000080; } |
|
||||
.highlight .nv { color: #008080; } |
|
||||
.highlight .ow { font-weight: bold; } |
|
||||
.highlight .w { color: #bbb; } |
|
||||
.highlight .mf { color: #099; } |
|
||||
.highlight .mh { color: #099; } |
|
||||
.highlight .mi { color: #099; } |
|
||||
.highlight .mo { color: #099; } |
|
||||
.highlight .sb { color: #d14; } |
|
||||
.highlight .sc { color: #d14; } |
|
||||
.highlight .sd { color: #d14; } |
|
||||
.highlight .s2 { color: #d14; } |
|
||||
.highlight .se { color: #d14; } |
|
||||
.highlight .sh { color: #d14; } |
|
||||
.highlight .si { color: #d14; } |
|
||||
.highlight .sx { color: #d14; } |
|
||||
.highlight .sr { color: #009926; } |
|
||||
.highlight .s1 { color: #d14; } |
|
||||
.highlight .ss { color: #990073; } |
|
||||
.highlight .bp { color: #999; } |
|
||||
.highlight .vc { color: #008080; } |
|
||||
.highlight .vg { color: #008080; } |
|
||||
.highlight .vi { color: #008080; } |
|
||||
.highlight .il { color: #099; } |
|
||||
|
Before Width: | Height: | Size: 9.7 KiB |
File diff suppressed because it is too large
@ -1,950 +0,0 @@ |
|||||
/* Bootstrap */ |
|
||||
|
|
||||
@font-face { |
|
||||
font-family: 'Icons'; |
|
||||
src: url('../fonts/open-iconic.eot'); |
|
||||
src: url('../fonts/open-iconic.eot?#iconic-sm') format('embedded-opentype'), url('../fonts/open-iconic.woff') format('woff'), url('../fonts/open-iconic.ttf') format('truetype'), url('../fonts/open-iconic.otf') format('opentype'), url('../fonts/open-iconic.svg#iconic-sm') format('svg'); |
|
||||
font-weight: normal; |
|
||||
font-style: normal; |
|
||||
} |
|
||||
|
|
||||
.oi { |
|
||||
position: relative; |
|
||||
top: 1px; |
|
||||
display: inline-block; |
|
||||
speak: none; |
|
||||
font-family: 'Icons'; |
|
||||
font-style: normal; |
|
||||
font-weight: normal; |
|
||||
line-height: 1; |
|
||||
-webkit-font-smoothing: antialiased; |
|
||||
-moz-osx-font-smoothing: grayscale; |
|
||||
} |
|
||||
|
|
||||
.oi:empty:before { |
|
||||
width: 1em; |
|
||||
text-align: center; |
|
||||
box-sizing: content-box; |
|
||||
} |
|
||||
|
|
||||
.oi.oi-align-center:before { |
|
||||
text-align: center; |
|
||||
} |
|
||||
|
|
||||
.oi.oi-align-left:before { |
|
||||
text-align: left; |
|
||||
} |
|
||||
|
|
||||
.oi.oi-align-right:before { |
|
||||
text-align: right; |
|
||||
} |
|
||||
|
|
||||
.oi.oi-flip-horizontal:before { |
|
||||
-webkit-transform: scale(-1, 1); |
|
||||
-ms-transform: scale(-1, 1); |
|
||||
transform: scale(-1, 1); |
|
||||
} |
|
||||
|
|
||||
.oi.oi-flip-vertical:before { |
|
||||
-webkit-transform: scale(1, -1); |
|
||||
-ms-transform: scale(-1, 1); |
|
||||
transform: scale(1, -1); |
|
||||
} |
|
||||
|
|
||||
.oi.oi-flip-horizontal-vertical:before { |
|
||||
-webkit-transform: scale(-1, -1); |
|
||||
-ms-transform: scale(-1, 1); |
|
||||
transform: scale(-1, -1); |
|
||||
} |
|
||||
|
|
||||
.oi-account-login:before { |
|
||||
content: '\e000'; |
|
||||
} |
|
||||
|
|
||||
.oi-account-logout:before { |
|
||||
content: '\e001'; |
|
||||
} |
|
||||
|
|
||||
.oi-action-redo:before { |
|
||||
content: '\e002'; |
|
||||
} |
|
||||
|
|
||||
.oi-action-undo:before { |
|
||||
content: '\e003'; |
|
||||
} |
|
||||
|
|
||||
.oi-align-center:before { |
|
||||
content: '\e004'; |
|
||||
} |
|
||||
|
|
||||
.oi-align-left:before { |
|
||||
content: '\e005'; |
|
||||
} |
|
||||
|
|
||||
.oi-align-right:before { |
|
||||
content: '\e006'; |
|
||||
} |
|
||||
|
|
||||
.oi-aperture:before { |
|
||||
content: '\e007'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-bottom:before { |
|
||||
content: '\e008'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-circle-bottom:before { |
|
||||
content: '\e009'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-circle-left:before { |
|
||||
content: '\e00a'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-circle-right:before { |
|
||||
content: '\e00b'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-circle-top:before { |
|
||||
content: '\e00c'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-left:before { |
|
||||
content: '\e00d'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-right:before { |
|
||||
content: '\e00e'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-thick-bottom:before { |
|
||||
content: '\e00f'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-thick-left:before { |
|
||||
content: '\e010'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-thick-right:before { |
|
||||
content: '\e011'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-thick-top:before { |
|
||||
content: '\e012'; |
|
||||
} |
|
||||
|
|
||||
.oi-arrow-top:before { |
|
||||
content: '\e013'; |
|
||||
} |
|
||||
|
|
||||
.oi-audio-spectrum:before { |
|
||||
content: '\e014'; |
|
||||
} |
|
||||
|
|
||||
.oi-audio:before { |
|
||||
content: '\e015'; |
|
||||
} |
|
||||
|
|
||||
.oi-badge:before { |
|
||||
content: '\e016'; |
|
||||
} |
|
||||
|
|
||||
.oi-ban:before { |
|
||||
content: '\e017'; |
|
||||
} |
|
||||
|
|
||||
.oi-bar-chart:before { |
|
||||
content: '\e018'; |
|
||||
} |
|
||||
|
|
||||
.oi-basket:before { |
|
||||
content: '\e019'; |
|
||||
} |
|
||||
|
|
||||
.oi-battery-empty:before { |
|
||||
content: '\e01a'; |
|
||||
} |
|
||||
|
|
||||
.oi-battery-full:before { |
|
||||
content: '\e01b'; |
|
||||
} |
|
||||
|
|
||||
.oi-beaker:before { |
|
||||
content: '\e01c'; |
|
||||
} |
|
||||
|
|
||||
.oi-bell:before { |
|
||||
content: '\e01d'; |
|
||||
} |
|
||||
|
|
||||
.oi-bluetooth:before { |
|
||||
content: '\e01e'; |
|
||||
} |
|
||||
|
|
||||
.oi-bold:before { |
|
||||
content: '\e01f'; |
|
||||
} |
|
||||
|
|
||||
.oi-bolt:before { |
|
||||
content: '\e020'; |
|
||||
} |
|
||||
|
|
||||
.oi-book:before { |
|
||||
content: '\e021'; |
|
||||
} |
|
||||
|
|
||||
.oi-bookmark:before { |
|
||||
content: '\e022'; |
|
||||
} |
|
||||
|
|
||||
.oi-box:before { |
|
||||
content: '\e023'; |
|
||||
} |
|
||||
|
|
||||
.oi-briefcase:before { |
|
||||
content: '\e024'; |
|
||||
} |
|
||||
|
|
||||
.oi-british-pound:before { |
|
||||
content: '\e025'; |
|
||||
} |
|
||||
|
|
||||
.oi-browser:before { |
|
||||
content: '\e026'; |
|
||||
} |
|
||||
|
|
||||
.oi-brush:before { |
|
||||
content: '\e027'; |
|
||||
} |
|
||||
|
|
||||
.oi-bug:before { |
|
||||
content: '\e028'; |
|
||||
} |
|
||||
|
|
||||
.oi-bullhorn:before { |
|
||||
content: '\e029'; |
|
||||
} |
|
||||
|
|
||||
.oi-calculator:before { |
|
||||
content: '\e02a'; |
|
||||
} |
|
||||
|
|
||||
.oi-calendar:before { |
|
||||
content: '\e02b'; |
|
||||
} |
|
||||
|
|
||||
.oi-camera-slr:before { |
|
||||
content: '\e02c'; |
|
||||
} |
|
||||
|
|
||||
.oi-caret-bottom:before { |
|
||||
content: '\e02d'; |
|
||||
} |
|
||||
|
|
||||
.oi-caret-left:before { |
|
||||
content: '\e02e'; |
|
||||
} |
|
||||
|
|
||||
.oi-caret-right:before { |
|
||||
content: '\e02f'; |
|
||||
} |
|
||||
|
|
||||
.oi-caret-top:before { |
|
||||
content: '\e030'; |
|
||||
} |
|
||||
|
|
||||
.oi-cart:before { |
|
||||
content: '\e031'; |
|
||||
} |
|
||||
|
|
||||
.oi-chat:before { |
|
||||
content: '\e032'; |
|
||||
} |
|
||||
|
|
||||
.oi-check:before { |
|
||||
content: '\e033'; |
|
||||
} |
|
||||
|
|
||||
.oi-chevron-bottom:before { |
|
||||
content: '\e034'; |
|
||||
} |
|
||||
|
|
||||
.oi-chevron-left:before { |
|
||||
content: '\e035'; |
|
||||
} |
|
||||
|
|
||||
.oi-chevron-right:before { |
|
||||
content: '\e036'; |
|
||||
} |
|
||||
|
|
||||
.oi-chevron-top:before { |
|
||||
content: '\e037'; |
|
||||
} |
|
||||
|
|
||||
.oi-circle-check:before { |
|
||||
content: '\e038'; |
|
||||
} |
|
||||
|
|
||||
.oi-circle-x:before { |
|
||||
content: '\e039'; |
|
||||
} |
|
||||
|
|
||||
.oi-clipboard:before { |
|
||||
content: '\e03a'; |
|
||||
} |
|
||||
|
|
||||
.oi-clock:before { |
|
||||
content: '\e03b'; |
|
||||
} |
|
||||
|
|
||||
.oi-cloud-download:before { |
|
||||
content: '\e03c'; |
|
||||
} |
|
||||
|
|
||||
.oi-cloud-upload:before { |
|
||||
content: '\e03d'; |
|
||||
} |
|
||||
|
|
||||
.oi-cloud:before { |
|
||||
content: '\e03e'; |
|
||||
} |
|
||||
|
|
||||
.oi-cloudy:before { |
|
||||
content: '\e03f'; |
|
||||
} |
|
||||
|
|
||||
.oi-code:before { |
|
||||
content: '\e040'; |
|
||||
} |
|
||||
|
|
||||
.oi-cog:before { |
|
||||
content: '\e041'; |
|
||||
} |
|
||||
|
|
||||
.oi-collapse-down:before { |
|
||||
content: '\e042'; |
|
||||
} |
|
||||
|
|
||||
.oi-collapse-left:before { |
|
||||
content: '\e043'; |
|
||||
} |
|
||||
|
|
||||
.oi-collapse-right:before { |
|
||||
content: '\e044'; |
|
||||
} |
|
||||
|
|
||||
.oi-collapse-up:before { |
|
||||
content: '\e045'; |
|
||||
} |
|
||||
|
|
||||
.oi-command:before { |
|
||||
content: '\e046'; |
|
||||
} |
|
||||
|
|
||||
.oi-comment-square:before { |
|
||||
content: '\e047'; |
|
||||
} |
|
||||
|
|
||||
.oi-compass:before { |
|
||||
content: '\e048'; |
|
||||
} |
|
||||
|
|
||||
.oi-contrast:before { |
|
||||
content: '\e049'; |
|
||||
} |
|
||||
|
|
||||
.oi-copywriting:before { |
|
||||
content: '\e04a'; |
|
||||
} |
|
||||
|
|
||||
.oi-credit-card:before { |
|
||||
content: '\e04b'; |
|
||||
} |
|
||||
|
|
||||
.oi-crop:before { |
|
||||
content: '\e04c'; |
|
||||
} |
|
||||
|
|
||||
.oi-dashboard:before { |
|
||||
content: '\e04d'; |
|
||||
} |
|
||||
|
|
||||
.oi-data-transfer-download:before { |
|
||||
content: '\e04e'; |
|
||||
} |
|
||||
|
|
||||
.oi-data-transfer-upload:before { |
|
||||
content: '\e04f'; |
|
||||
} |
|
||||
|
|
||||
.oi-delete:before { |
|
||||
content: '\e050'; |
|
||||
} |
|
||||
|
|
||||
.oi-dial:before { |
|
||||
content: '\e051'; |
|
||||
} |
|
||||
|
|
||||
.oi-document:before { |
|
||||
content: '\e052'; |
|
||||
} |
|
||||
|
|
||||
.oi-dollar:before { |
|
||||
content: '\e053'; |
|
||||
} |
|
||||
|
|
||||
.oi-double-quote-sans-left:before { |
|
||||
content: '\e054'; |
|
||||
} |
|
||||
|
|
||||
.oi-double-quote-sans-right:before { |
|
||||
content: '\e055'; |
|
||||
} |
|
||||
|
|
||||
.oi-double-quote-serif-left:before { |
|
||||
content: '\e056'; |
|
||||
} |
|
||||
|
|
||||
.oi-double-quote-serif-right:before { |
|
||||
content: '\e057'; |
|
||||
} |
|
||||
|
|
||||
.oi-droplet:before { |
|
||||
content: '\e058'; |
|
||||
} |
|
||||
|
|
||||
.oi-eject:before { |
|
||||
content: '\e059'; |
|
||||
} |
|
||||
|
|
||||
.oi-elevator:before { |
|
||||
content: '\e05a'; |
|
||||
} |
|
||||
|
|
||||
.oi-ellipses:before { |
|
||||
content: '\e05b'; |
|
||||
} |
|
||||
|
|
||||
.oi-envelope-closed:before { |
|
||||
content: '\e05c'; |
|
||||
} |
|
||||
|
|
||||
.oi-envelope-open:before { |
|
||||
content: '\e05d'; |
|
||||
} |
|
||||
|
|
||||
.oi-euro:before { |
|
||||
content: '\e05e'; |
|
||||
} |
|
||||
|
|
||||
.oi-excerpt:before { |
|
||||
content: '\e05f'; |
|
||||
} |
|
||||
|
|
||||
.oi-expand-down:before { |
|
||||
content: '\e060'; |
|
||||
} |
|
||||
|
|
||||
.oi-expand-left:before { |
|
||||
content: '\e061'; |
|
||||
} |
|
||||
|
|
||||
.oi-expand-right:before { |
|
||||
content: '\e062'; |
|
||||
} |
|
||||
|
|
||||
.oi-expand-up:before { |
|
||||
content: '\e063'; |
|
||||
} |
|
||||
|
|
||||
.oi-external-link:before { |
|
||||
content: '\e064'; |
|
||||
} |
|
||||
|
|
||||
.oi-eye:before { |
|
||||
content: '\e065'; |
|
||||
} |
|
||||
|
|
||||
.oi-eyedropper:before { |
|
||||
content: '\e066'; |
|
||||
} |
|
||||
|
|
||||
.oi-file:before { |
|
||||
content: '\e067'; |
|
||||
} |
|
||||
|
|
||||
.oi-fire:before { |
|
||||
content: '\e068'; |
|
||||
} |
|
||||
|
|
||||
.oi-flag:before { |
|
||||
content: '\e069'; |
|
||||
} |
|
||||
|
|
||||
.oi-flash:before { |
|
||||
content: '\e06a'; |
|
||||
} |
|
||||
|
|
||||
.oi-folder:before { |
|
||||
content: '\e06b'; |
|
||||
} |
|
||||
|
|
||||
.oi-fork:before { |
|
||||
content: '\e06c'; |
|
||||
} |
|
||||
|
|
||||
.oi-fullscreen-enter:before { |
|
||||
content: '\e06d'; |
|
||||
} |
|
||||
|
|
||||
.oi-fullscreen-exit:before { |
|
||||
content: '\e06e'; |
|
||||
} |
|
||||
|
|
||||
.oi-globe:before { |
|
||||
content: '\e06f'; |
|
||||
} |
|
||||
|
|
||||
.oi-graph:before { |
|
||||
content: '\e070'; |
|
||||
} |
|
||||
|
|
||||
.oi-grid-four-up:before { |
|
||||
content: '\e071'; |
|
||||
} |
|
||||
|
|
||||
.oi-grid-three-up:before { |
|
||||
content: '\e072'; |
|
||||
} |
|
||||
|
|
||||
.oi-grid-two-up:before { |
|
||||
content: '\e073'; |
|
||||
} |
|
||||
|
|
||||
.oi-hard-drive:before { |
|
||||
content: '\e074'; |
|
||||
} |
|
||||
|
|
||||
.oi-header:before { |
|
||||
content: '\e075'; |
|
||||
} |
|
||||
|
|
||||
.oi-headphones:before { |
|
||||
content: '\e076'; |
|
||||
} |
|
||||
|
|
||||
.oi-heart:before { |
|
||||
content: '\e077'; |
|
||||
} |
|
||||
|
|
||||
.oi-home:before { |
|
||||
content: '\e078'; |
|
||||
} |
|
||||
|
|
||||
.oi-image:before { |
|
||||
content: '\e079'; |
|
||||
} |
|
||||
|
|
||||
.oi-inbox:before { |
|
||||
content: '\e07a'; |
|
||||
} |
|
||||
|
|
||||
.oi-infinity:before { |
|
||||
content: '\e07b'; |
|
||||
} |
|
||||
|
|
||||
.oi-info:before { |
|
||||
content: '\e07c'; |
|
||||
} |
|
||||
|
|
||||
.oi-italic:before { |
|
||||
content: '\e07d'; |
|
||||
} |
|
||||
|
|
||||
.oi-justify-center:before { |
|
||||
content: '\e07e'; |
|
||||
} |
|
||||
|
|
||||
.oi-justify-left:before { |
|
||||
content: '\e07f'; |
|
||||
} |
|
||||
|
|
||||
.oi-justify-right:before { |
|
||||
content: '\e080'; |
|
||||
} |
|
||||
|
|
||||
.oi-key:before { |
|
||||
content: '\e081'; |
|
||||
} |
|
||||
|
|
||||
.oi-laptop:before { |
|
||||
content: '\e082'; |
|
||||
} |
|
||||
|
|
||||
.oi-layers:before { |
|
||||
content: '\e083'; |
|
||||
} |
|
||||
|
|
||||
.oi-lightbulb:before { |
|
||||
content: '\e084'; |
|
||||
} |
|
||||
|
|
||||
.oi-link-broken:before { |
|
||||
content: '\e085'; |
|
||||
} |
|
||||
|
|
||||
.oi-link-intact:before { |
|
||||
content: '\e086'; |
|
||||
} |
|
||||
|
|
||||
.oi-list-rich:before { |
|
||||
content: '\e087'; |
|
||||
} |
|
||||
|
|
||||
.oi-list:before { |
|
||||
content: '\e088'; |
|
||||
} |
|
||||
|
|
||||
.oi-location:before { |
|
||||
content: '\e089'; |
|
||||
} |
|
||||
|
|
||||
.oi-lock-locked:before { |
|
||||
content: '\e08a'; |
|
||||
} |
|
||||
|
|
||||
.oi-lock-unlocked:before { |
|
||||
content: '\e08b'; |
|
||||
} |
|
||||
|
|
||||
.oi-loop-circular:before { |
|
||||
content: '\e08c'; |
|
||||
} |
|
||||
|
|
||||
.oi-loop-square:before { |
|
||||
content: '\e08d'; |
|
||||
} |
|
||||
|
|
||||
.oi-loop:before { |
|
||||
content: '\e08e'; |
|
||||
} |
|
||||
|
|
||||
.oi-magnifying-glass:before { |
|
||||
content: '\e08f'; |
|
||||
} |
|
||||
|
|
||||
.oi-map-marker:before { |
|
||||
content: '\e090'; |
|
||||
} |
|
||||
|
|
||||
.oi-map:before { |
|
||||
content: '\e091'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-pause:before { |
|
||||
content: '\e092'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-play:before { |
|
||||
content: '\e093'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-record:before { |
|
||||
content: '\e094'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-skip-backward:before { |
|
||||
content: '\e095'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-skip-forward:before { |
|
||||
content: '\e096'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-step-backward:before { |
|
||||
content: '\e097'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-step-forward:before { |
|
||||
content: '\e098'; |
|
||||
} |
|
||||
|
|
||||
.oi-media-stop:before { |
|
||||
content: '\e099'; |
|
||||
} |
|
||||
|
|
||||
.oi-medical-cross:before { |
|
||||
content: '\e09a'; |
|
||||
} |
|
||||
|
|
||||
.oi-menu:before { |
|
||||
content: '\e09b'; |
|
||||
} |
|
||||
|
|
||||
.oi-microphone:before { |
|
||||
content: '\e09c'; |
|
||||
} |
|
||||
|
|
||||
.oi-minus:before { |
|
||||
content: '\e09d'; |
|
||||
} |
|
||||
|
|
||||
.oi-monitor:before { |
|
||||
content: '\e09e'; |
|
||||
} |
|
||||
|
|
||||
.oi-moon:before { |
|
||||
content: '\e09f'; |
|
||||
} |
|
||||
|
|
||||
.oi-move:before { |
|
||||
content: '\e0a0'; |
|
||||
} |
|
||||
|
|
||||
.oi-musical-note:before { |
|
||||
content: '\e0a1'; |
|
||||
} |
|
||||
|
|
||||
.oi-paperclip:before { |
|
||||
content: '\e0a2'; |
|
||||
} |
|
||||
|
|
||||
.oi-pencil:before { |
|
||||
content: '\e0a3'; |
|
||||
} |
|
||||
|
|
||||
.oi-people:before { |
|
||||
content: '\e0a4'; |
|
||||
} |
|
||||
|
|
||||
.oi-person:before { |
|
||||
content: '\e0a5'; |
|
||||
} |
|
||||
|
|
||||
.oi-phone:before { |
|
||||
content: '\e0a6'; |
|
||||
} |
|
||||
|
|
||||
.oi-pie-chart:before { |
|
||||
content: '\e0a7'; |
|
||||
} |
|
||||
|
|
||||
.oi-pin:before { |
|
||||
content: '\e0a8'; |
|
||||
} |
|
||||
|
|
||||
.oi-play-circle:before { |
|
||||
content: '\e0a9'; |
|
||||
} |
|
||||
|
|
||||
.oi-plus:before { |
|
||||
content: '\e0aa'; |
|
||||
} |
|
||||
|
|
||||
.oi-power-standby:before { |
|
||||
content: '\e0ab'; |
|
||||
} |
|
||||
|
|
||||
.oi-print:before { |
|
||||
content: '\e0ac'; |
|
||||
} |
|
||||
|
|
||||
.oi-project:before { |
|
||||
content: '\e0ad'; |
|
||||
} |
|
||||
|
|
||||
.oi-pulse:before { |
|
||||
content: '\e0ae'; |
|
||||
} |
|
||||
|
|
||||
.oi-puzzle-piece:before { |
|
||||
content: '\e0af'; |
|
||||
} |
|
||||
|
|
||||
.oi-question-mark:before { |
|
||||
content: '\e0b0'; |
|
||||
} |
|
||||
|
|
||||
.oi-rain:before { |
|
||||
content: '\e0b1'; |
|
||||
} |
|
||||
|
|
||||
.oi-random:before { |
|
||||
content: '\e0b2'; |
|
||||
} |
|
||||
|
|
||||
.oi-reload:before { |
|
||||
content: '\e0b3'; |
|
||||
} |
|
||||
|
|
||||
.oi-resize-both:before { |
|
||||
content: '\e0b4'; |
|
||||
} |
|
||||
|
|
||||
.oi-resize-height:before { |
|
||||
content: '\e0b5'; |
|
||||
} |
|
||||
|
|
||||
.oi-resize-width:before { |
|
||||
content: '\e0b6'; |
|
||||
} |
|
||||
|
|
||||
.oi-rss-alt:before { |
|
||||
content: '\e0b7'; |
|
||||
} |
|
||||
|
|
||||
.oi-rss:before { |
|
||||
content: '\e0b8'; |
|
||||
} |
|
||||
|
|
||||
.oi-script:before { |
|
||||
content: '\e0b9'; |
|
||||
} |
|
||||
|
|
||||
.oi-share-boxed:before { |
|
||||
content: '\e0ba'; |
|
||||
} |
|
||||
|
|
||||
.oi-share:before { |
|
||||
content: '\e0bb'; |
|
||||
} |
|
||||
|
|
||||
.oi-shield:before { |
|
||||
content: '\e0bc'; |
|
||||
} |
|
||||
|
|
||||
.oi-signal:before { |
|
||||
content: '\e0bd'; |
|
||||
} |
|
||||
|
|
||||
.oi-signpost:before { |
|
||||
content: '\e0be'; |
|
||||
} |
|
||||
|
|
||||
.oi-sort-ascending:before { |
|
||||
content: '\e0bf'; |
|
||||
} |
|
||||
|
|
||||
.oi-sort-descending:before { |
|
||||
content: '\e0c0'; |
|
||||
} |
|
||||
|
|
||||
.oi-spreadsheet:before { |
|
||||
content: '\e0c1'; |
|
||||
} |
|
||||
|
|
||||
.oi-star:before { |
|
||||
content: '\e0c2'; |
|
||||
} |
|
||||
|
|
||||
.oi-sun:before { |
|
||||
content: '\e0c3'; |
|
||||
} |
|
||||
|
|
||||
.oi-tablet:before { |
|
||||
content: '\e0c4'; |
|
||||
} |
|
||||
|
|
||||
.oi-tag:before { |
|
||||
content: '\e0c5'; |
|
||||
} |
|
||||
|
|
||||
.oi-tags:before { |
|
||||
content: '\e0c6'; |
|
||||
} |
|
||||
|
|
||||
.oi-target:before { |
|
||||
content: '\e0c7'; |
|
||||
} |
|
||||
|
|
||||
.oi-task:before { |
|
||||
content: '\e0c8'; |
|
||||
} |
|
||||
|
|
||||
.oi-terminal:before { |
|
||||
content: '\e0c9'; |
|
||||
} |
|
||||
|
|
||||
.oi-text:before { |
|
||||
content: '\e0ca'; |
|
||||
} |
|
||||
|
|
||||
.oi-thumb-down:before { |
|
||||
content: '\e0cb'; |
|
||||
} |
|
||||
|
|
||||
.oi-thumb-up:before { |
|
||||
content: '\e0cc'; |
|
||||
} |
|
||||
|
|
||||
.oi-timer:before { |
|
||||
content: '\e0cd'; |
|
||||
} |
|
||||
|
|
||||
.oi-transfer:before { |
|
||||
content: '\e0ce'; |
|
||||
} |
|
||||
|
|
||||
.oi-trash:before { |
|
||||
content: '\e0cf'; |
|
||||
} |
|
||||
|
|
||||
.oi-underline:before { |
|
||||
content: '\e0d0'; |
|
||||
} |
|
||||
|
|
||||
.oi-vertical-align-bottom:before { |
|
||||
content: '\e0d1'; |
|
||||
} |
|
||||
|
|
||||
.oi-vertical-align-center:before { |
|
||||
content: '\e0d2'; |
|
||||
} |
|
||||
|
|
||||
.oi-vertical-align-top:before { |
|
||||
content: '\e0d3'; |
|
||||
} |
|
||||
|
|
||||
.oi-video:before { |
|
||||
content: '\e0d4'; |
|
||||
} |
|
||||
|
|
||||
.oi-volume-high:before { |
|
||||
content: '\e0d5'; |
|
||||
} |
|
||||
|
|
||||
.oi-volume-low:before { |
|
||||
content: '\e0d6'; |
|
||||
} |
|
||||
|
|
||||
.oi-volume-off:before { |
|
||||
content: '\e0d7'; |
|
||||
} |
|
||||
|
|
||||
.oi-warning:before { |
|
||||
content: '\e0d8'; |
|
||||
} |
|
||||
|
|
||||
.oi-wifi:before { |
|
||||
content: '\e0d9'; |
|
||||
} |
|
||||
|
|
||||
.oi-wrench:before { |
|
||||
content: '\e0da'; |
|
||||
} |
|
||||
|
|
||||
.oi-x:before { |
|
||||
content: '\e0db'; |
|
||||
} |
|
||||
|
|
||||
.oi-yen:before { |
|
||||
content: '\e0dc'; |
|
||||
} |
|
||||
|
|
||||
.oi-zoom-in:before { |
|
||||
content: '\e0dd'; |
|
||||
} |
|
||||
|
|
||||
.oi-zoom-out:before { |
|
||||
content: '\e0de'; |
|
||||
} |
|
||||
@ -1,434 +0,0 @@ |
|||||
.alert { |
|
||||
border-radius: 15px; |
|
||||
|
|
||||
&-custom { |
|
||||
color: #3b4f87; |
|
||||
background-color: #e2e6f0; |
|
||||
border-color: #6679ac; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: #6679ac; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: #081b4f; |
|
||||
} |
|
||||
} |
|
||||
&-primary { |
|
||||
color: #3b4f87; |
|
||||
background-color: #e2e6f0; |
|
||||
border-color: #6679ac; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: #6679ac; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: #003600; |
|
||||
} |
|
||||
} |
|
||||
&-secondary { |
|
||||
color: $oc-gray-7; |
|
||||
background-color: $oc-gray-2; |
|
||||
border-color: $oc-gray-6; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: $oc-gray-6; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: $oc-gray-8; |
|
||||
} |
|
||||
} |
|
||||
&-success { |
|
||||
color: #105c10; |
|
||||
background-color: #e1f2e1; |
|
||||
border-color: #60ab60; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: #1d731d; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: #003b00; |
|
||||
} |
|
||||
} |
|
||||
&-warning { |
|
||||
color: #6b4c00; |
|
||||
background-color: #ffeab5; |
|
||||
border-color: #cca443; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: #cca443; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: #a66b00; |
|
||||
} |
|
||||
} |
|
||||
&-danger { |
|
||||
color: #700b00; |
|
||||
background-color: #ffcac4; |
|
||||
border-color: #e15647; |
|
||||
|
|
||||
& hr { |
|
||||
border-top-color: #e15647; |
|
||||
} |
|
||||
|
|
||||
& .alert-link { |
|
||||
color: #880000; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.background-primary { |
|
||||
background-color: $primary; |
|
||||
} |
|
||||
|
|
||||
.background-secondary { |
|
||||
background-color: $secondary; |
|
||||
} |
|
||||
|
|
||||
.background-warning { |
|
||||
background-color: $warning; |
|
||||
} |
|
||||
|
|
||||
.background-danger { |
|
||||
background-color: $danger; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
.background-gray-0 { |
|
||||
background-color: $oc-gray-0; |
|
||||
} |
|
||||
|
|
||||
.background-gray-1 { |
|
||||
background-color: $oc-gray-1; |
|
||||
} |
|
||||
|
|
||||
.background-gray-2 { |
|
||||
background-color: $oc-gray-2; |
|
||||
} |
|
||||
|
|
||||
.background-gray-3 { |
|
||||
background-color: $oc-gray-3; |
|
||||
} |
|
||||
|
|
||||
.background-gray-4 { |
|
||||
background-color: $oc-gray-4; |
|
||||
} |
|
||||
|
|
||||
.background-gray-5 { |
|
||||
background-color: $oc-gray-5; |
|
||||
} |
|
||||
|
|
||||
.background-gray-6 { |
|
||||
background-color: $oc-gray-6; |
|
||||
} |
|
||||
|
|
||||
.background-gray-7 { |
|
||||
background-color: $oc-gray-7; |
|
||||
} |
|
||||
|
|
||||
.background-gray-8 { |
|
||||
background-color: $oc-gray-8; |
|
||||
} |
|
||||
|
|
||||
.background-gray-9 { |
|
||||
background-color: $oc-gray-9; |
|
||||
} |
|
||||
|
|
||||
.background-black { |
|
||||
background-color: $oc-black; |
|
||||
} |
|
||||
|
|
||||
.color-primary { |
|
||||
color: $primary |
|
||||
} |
|
||||
|
|
||||
.color-secondary { |
|
||||
color: $secondary; |
|
||||
} |
|
||||
|
|
||||
.color-gray-9 { |
|
||||
color: $oc-gray-9; |
|
||||
} |
|
||||
|
|
||||
.rb-code { |
|
||||
font-family: 'Source Code Pro', monospace !important; |
|
||||
} |
|
||||
|
|
||||
.rb-isBold { |
|
||||
font-weight: bold; |
|
||||
} |
|
||||
|
|
||||
/* |
|
||||
Overwriting the default size for btn-lg and btn-md |
|
||||
*/ |
|
||||
|
|
||||
.btn-primary, |
|
||||
.btn-outline-primary, |
|
||||
.btn-lg, |
|
||||
.btn-large, |
|
||||
.btn-outline-large, |
|
||||
.btn-md, |
|
||||
.btn-medium, |
|
||||
.btn-outline-medium { |
|
||||
line-height: 1em; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
.btn-primary { |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
padding: 1rem 1.5rem !important; |
|
||||
font-size: 1rem; |
|
||||
&:hover { |
|
||||
background-color: $secondary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-white { |
|
||||
color: $primary !important; |
|
||||
background-color: $oc-white !important; |
|
||||
border-color: transparent !important; |
|
||||
padding: 1rem 1.5rem !important; |
|
||||
font-size: 1rem; |
|
||||
&:hover { |
|
||||
color: $oc-white !important; |
|
||||
background-color: $secondary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-small { |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
padding: .08rem .4rem 0 !important; |
|
||||
font-size: .8rem; |
|
||||
color: $oc-white; |
|
||||
&:hover { |
|
||||
background-color: $secondary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-medium { |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
padding: .5rem 1rem !important; |
|
||||
font-size: 1rem !important; |
|
||||
color: $oc-white; |
|
||||
&:hover { |
|
||||
background-color: $secondary !important; |
|
||||
border-color: transparent !important; |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-large { |
|
||||
border-radius: .3rem; |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
border-radius: 2em; |
|
||||
padding: .5rem 1rem !important; |
|
||||
font-size: 1.25rem !important; |
|
||||
color: $oc-white; |
|
||||
&:hover { |
|
||||
background-color: $secondary !important; |
|
||||
border-color: transparent !important; |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
.btn-outline-medium { |
|
||||
border-color: $primary !important; |
|
||||
color: $primary !important; |
|
||||
padding: .5rem 1rem !important; |
|
||||
font-size: 1rem !important; |
|
||||
background-color: transparent !important; |
|
||||
|
|
||||
&:hover { |
|
||||
color: white !important; |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-outline-small { |
|
||||
border-color: $primary !important; |
|
||||
color: $primary !important; |
|
||||
padding: .08rem .4rem 0 !important; |
|
||||
font-size: .8rem; |
|
||||
background-color: transparent !important; |
|
||||
|
|
||||
&:hover { |
|
||||
color: white !important; |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-outline-primary { |
|
||||
border-color: $primary !important; |
|
||||
color: $primary !important; |
|
||||
padding: 1rem 1.5rem !important; |
|
||||
font-size: 1rem; |
|
||||
|
|
||||
&:hover { |
|
||||
color: white !important; |
|
||||
background-color: $primary !important; |
|
||||
border-color: transparent !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-link { |
|
||||
color: $primary !important; |
|
||||
|
|
||||
&:hover { |
|
||||
color: $secondary !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.btn-scroller { |
|
||||
border-radius: .25rem; |
|
||||
text-align: center; |
|
||||
display: inline-block; |
|
||||
-webkit-transition-duration: .1s; |
|
||||
-o-transition-duration: .1s; |
|
||||
-webkit-transition-timing-function: linear; |
|
||||
-o-transition-timing-function: linear; |
|
||||
-webkit-transition-property: background-color,color,border-color; |
|
||||
-o-transition-property: background-color,color,border-color; |
|
||||
padding: .5rem 1rem; |
|
||||
transition-duration: .1s; |
|
||||
transition-timing-function: linear; |
|
||||
transition-property: background-color,color,border-color; |
|
||||
color: #00000b; |
|
||||
background-color: #dddde0; |
|
||||
border: 0; |
|
||||
} |
|
||||
|
|
||||
.btn-scroller:active, .btn-scroller:focus, .btn-scroller:hover { |
|
||||
color: #00000b; |
|
||||
background-color: #aaaab0; |
|
||||
} |
|
||||
|
|
||||
.btn-pill { |
|
||||
border-radius: 30px; |
|
||||
} |
|
||||
|
|
||||
.faq__chevron-up { |
|
||||
height: .8em; |
|
||||
vertical-align: -.06em; |
|
||||
fill: currentColor; |
|
||||
margin-left: .5em; |
|
||||
-webkit-transform: rotate(270deg); |
|
||||
-ms-transform: rotate(270deg); |
|
||||
-o-transform: rotate(270deg); |
|
||||
transform: rotate(270deg); |
|
||||
} |
|
||||
|
|
||||
.badge-primary { |
|
||||
background-color: $primary !important; |
|
||||
} |
|
||||
|
|
||||
.badge-secondary { |
|
||||
background-color: $secondary !important; |
|
||||
} |
|
||||
|
|
||||
.footer { |
|
||||
ul { |
|
||||
list-style: none; |
|
||||
font-weight: 600; |
|
||||
text-transform: capitalize; |
|
||||
margin-bottom: 2rem; |
|
||||
span { |
|
||||
display: block; |
|
||||
margin-bottom: 0.5em; |
|
||||
} |
|
||||
a { |
|
||||
color: rgba(255,255,255,0.5); |
|
||||
font-weight: 400; |
|
||||
|
|
||||
&:hover { |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
&__social-media { |
|
||||
display: flex; |
|
||||
margin-top: 16px !important; |
|
||||
&-icon { |
|
||||
height: 40px; |
|
||||
width: 40px; |
|
||||
margin-right: 1rem; |
|
||||
margin-bottom: 1rem; |
|
||||
color: rgba(255,255,255,0.5); |
|
||||
&:hover { |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
&-extras{ |
|
||||
ul { |
|
||||
li { |
|
||||
margin: 0 0.5rem; |
|
||||
} |
|
||||
} |
|
||||
&__logo img { |
|
||||
max-width: 180px; |
|
||||
height: auto; |
|
||||
} |
|
||||
} |
|
||||
.spacer { |
|
||||
content: " "; |
|
||||
height: 2rem; |
|
||||
} |
|
||||
} |
|
||||
#styleguide-nav { |
|
||||
background-color: $primary !important; |
|
||||
.nav-item:hover { |
|
||||
box-shadow: inset 0 -5px $oc-white; |
|
||||
} |
|
||||
.nav-link { |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
|
|
||||
.show { |
|
||||
.nav-item:hover { |
|
||||
box-shadow: 0 0; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.rb-link { |
|
||||
color: $primary !important; |
|
||||
&:hover { |
|
||||
color: $secondary !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.rb-paginate-active { |
|
||||
background-color: $primary !important; |
|
||||
color: white !important; |
|
||||
|
|
||||
&:hover { |
|
||||
background-color: $secondary !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.pagination .page-link { |
|
||||
color: $oc-gray-9; |
|
||||
} |
|
||||
|
|
||||
.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th { |
|
||||
background-color: $oc-gray-3 !important; |
|
||||
} |
|
||||
|
|
||||
.mark, mark { |
|
||||
background-color: $oc-gray-3 !important; |
|
||||
padding: .2em !important; |
|
||||
} |
|
||||
@ -1,167 +0,0 @@ |
|||||
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { |
|
||||
font-weight: 400 !important; |
|
||||
} |
|
||||
|
|
||||
.border-left-right { |
|
||||
// z-index: 99; |
|
||||
border-right: 1px solid $oc-gray-3 !important; |
|
||||
} |
|
||||
|
|
||||
.sidebar { |
|
||||
min-height: 100vh; |
|
||||
height: 100%; |
|
||||
width: 100%; |
|
||||
border-right: 1px solid $oc-gray-3 !important; |
|
||||
|
|
||||
// position: fixed; |
|
||||
|
|
||||
& .list-group { |
|
||||
position: fixed; |
|
||||
// width: 23vw; |
|
||||
} |
|
||||
|
|
||||
& .list-group-item { |
|
||||
background-color: transparent; |
|
||||
border: 0; |
|
||||
border-radius: 0 !important; |
|
||||
font-size: 1rem; |
|
||||
font-weight: 400 !important; |
|
||||
padding-left: 1.1rem !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.sidebar-wrapper { |
|
||||
background-color: $oc-gray-3; |
|
||||
} |
|
||||
|
|
||||
.sidebar__link__light { |
|
||||
color: $oc-gray-7 !important; |
|
||||
|
|
||||
&:hover { |
|
||||
color: $oc-black !important; |
|
||||
transition-timing-function: linear; |
|
||||
-webkit-transition-timing-function: linear; |
|
||||
-webkit-transition-duration: .3s; |
|
||||
transition-duration: .3s; |
|
||||
} |
|
||||
|
|
||||
&:active { |
|
||||
color: $primary; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.rb-sidebar__2 { |
|
||||
background-color: #F8F9FA !important; |
|
||||
} |
|
||||
|
|
||||
.row { |
|
||||
margin: auto !important; |
|
||||
} |
|
||||
|
|
||||
.active, |
|
||||
.active:hover { |
|
||||
// background-color: $oc-gray-3 !important; |
|
||||
// box-shadow: inset 5px 0 $primary; |
|
||||
|
|
||||
& * { |
|
||||
color: $primary !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.rp-navbar__top { |
|
||||
background-color: $primary; |
|
||||
} |
|
||||
|
|
||||
// bootstrap navbar-light class is not working, overwriting classes to fix this |
|
||||
//TODO fix this issue |
|
||||
|
|
||||
.navbar-light .navbar-toggler { |
|
||||
border-color: rgba(255,255,255,.5); |
|
||||
} |
|
||||
|
|
||||
.navbar-light .navbar-toggler-icon { |
|
||||
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); |
|
||||
} |
|
||||
|
|
||||
.navbar-light .navbar-nav .nav-link { |
|
||||
color: rgba(255,255,255,.5); |
|
||||
|
|
||||
&:hover { |
|
||||
color: $oc-white; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.rb-contain { |
|
||||
width: 100%; |
|
||||
height: auto; |
|
||||
max-height: 100%; |
|
||||
} |
|
||||
|
|
||||
.max-width-150 { |
|
||||
max-width: 150px; |
|
||||
} |
|
||||
|
|
||||
.padding-top-35 { |
|
||||
padding-top: 35px !important; |
|
||||
} |
|
||||
|
|
||||
.padding-top-18 { |
|
||||
padding-top: 18px; |
|
||||
} |
|
||||
|
|
||||
.align-horizontally { |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
} |
|
||||
|
|
||||
.flex-space-between { |
|
||||
justify-content: space-between; |
|
||||
} |
|
||||
|
|
||||
|
|
||||
.hidden-sm { |
|
||||
display: block; |
|
||||
} |
|
||||
|
|
||||
@media screen and (max-width: 991px) { |
|
||||
.hidden-sm { |
|
||||
display: none !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.sidebar-fill { |
|
||||
width: 12.45%; |
|
||||
} |
|
||||
|
|
||||
.list-group-item:focus, |
|
||||
.list-group-item:hover { |
|
||||
// background-color: $oc-gray-2 !important; |
|
||||
|
|
||||
& * { |
|
||||
color: $primary; |
|
||||
} |
|
||||
} |
|
||||
.list-group-item.active { |
|
||||
color: $primary; |
|
||||
} |
|
||||
|
|
||||
.bg-box { |
|
||||
background-color: #f1f3f5 !important; |
|
||||
} |
|
||||
|
|
||||
.bg { |
|
||||
&-primary { |
|
||||
background-color: $primary !important; |
|
||||
} |
|
||||
&-secondary { |
|
||||
background-color: $secondary !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.b-border { |
|
||||
border-bottom: 2px solid lightgrey !important; |
|
||||
} |
|
||||
|
|
||||
.typo-text { |
|
||||
display: inline-block; |
|
||||
} |
|
||||
@ -1,218 +0,0 @@ |
|||||
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-weight: 400 !important; } |
|
||||
|
|
||||
.border-left-right { border-right: 1px solid #dee2e6 !important; } |
|
||||
|
|
||||
.sidebar { min-height: 100vh; height: 100%; width: 100%; border-right: 1px solid #dee2e6 !important; } |
|
||||
.sidebar .list-group { position: fixed; } |
|
||||
.sidebar .list-group-item { background-color: transparent; border: 0; border-radius: 0 !important; font-size: 1rem; font-weight: 400 !important; padding-left: 1.1rem !important; } |
|
||||
|
|
||||
.sidebar-wrapper { background-color: #dee2e6; } |
|
||||
|
|
||||
.sidebar__link__light { color: #495057 !important; } |
|
||||
.sidebar__link__light:hover { color: #000000 !important; transition-timing-function: linear; -webkit-transition-timing-function: linear; -webkit-transition-duration: .3s; transition-duration: .3s; } |
|
||||
.sidebar__link__light:active { color: #4661A9; } |
|
||||
|
|
||||
.rb-sidebar__2 { background-color: #F8F9FA !important; } |
|
||||
|
|
||||
.row { margin: auto !important; } |
|
||||
|
|
||||
.active *, .active:hover * { color: #4661A9 !important; } |
|
||||
|
|
||||
.rp-navbar__top { background-color: #4661A9; } |
|
||||
|
|
||||
.navbar-light .navbar-toggler { border-color: rgba(255, 255, 255, 0.5); } |
|
||||
|
|
||||
.navbar-light .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } |
|
||||
|
|
||||
.navbar-light .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.5); } |
|
||||
.navbar-light .navbar-nav .nav-link:hover { color: #ffffff; } |
|
||||
|
|
||||
.rb-contain { width: 100%; height: auto; max-height: 100%; } |
|
||||
|
|
||||
.max-width-150 { max-width: 150px; } |
|
||||
|
|
||||
.padding-top-35 { padding-top: 35px !important; } |
|
||||
|
|
||||
.padding-top-18 { padding-top: 18px; } |
|
||||
|
|
||||
.align-horizontally { display: flex; align-items: center; } |
|
||||
|
|
||||
.flex-space-between { justify-content: space-between; } |
|
||||
|
|
||||
.hidden-sm { display: block; } |
|
||||
|
|
||||
@media screen and (max-width: 991px) { .hidden-sm { display: none !important; } } |
|
||||
.sidebar-fill { width: 12.45%; } |
|
||||
|
|
||||
.list-group-item:focus *, .list-group-item:hover * { color: #4661A9; } |
|
||||
|
|
||||
.list-group-item.active { color: #4661A9; } |
|
||||
|
|
||||
.bg-box { background-color: #f1f3f5 !important; } |
|
||||
|
|
||||
.bg-primary { background-color: #4661A9 !important; } |
|
||||
.bg-secondary { background-color: #60AB60 !important; } |
|
||||
|
|
||||
.b-border { border-bottom: 2px solid lightgrey !important; } |
|
||||
|
|
||||
.typo-text { display: inline-block; } |
|
||||
|
|
||||
.color { height: 100px; } |
|
||||
|
|
||||
.grid { height: 100px; background-color: #4661A9; border-radius: 7px; } |
|
||||
.grid span { margin: 10px 10px 10px 10px; color: white; } |
|
||||
|
|
||||
.header-display::before { background: #60AB60; content: " "; display: inline-block; width: 7px; } |
|
||||
|
|
||||
h1.header-display::before { height: 3.75rem; transform: translate(-15px, 0); margin-bottom: -0.9375rem; } |
|
||||
|
|
||||
h2.header-display::before { height: 3rem; transform: translate(-15px, 0); margin-bottom: -0.75rem; } |
|
||||
|
|
||||
h3.header-display::before { height: 2.625rem; transform: translate(-15px, 0); margin-bottom: -0.65625rem; } |
|
||||
|
|
||||
h4.header-display::before { height: 2.25rem; transform: translate(-15px, 0); margin-bottom: -0.5625rem; } |
|
||||
|
|
||||
.icon { font-size: 20px; background-color: #212529; padding: 20px; } |
|
||||
|
|
||||
.typography__headers__item { margin-bottom: 2rem; } |
|
||||
.typography__headers__item p { margin-bottom: 0.5rem !important; } |
|
||||
|
|
||||
.alert { border-radius: 15px; } |
|
||||
.alert-custom { color: #3b4f87; background-color: #e2e6f0; border-color: #6679ac; } |
|
||||
.alert-custom hr { border-top-color: #6679ac; } |
|
||||
.alert-custom .alert-link { color: #081b4f; } |
|
||||
.alert-primary { color: #3b4f87; background-color: #e2e6f0; border-color: #6679ac; } |
|
||||
.alert-primary hr { border-top-color: #6679ac; } |
|
||||
.alert-primary .alert-link { color: #003600; } |
|
||||
.alert-secondary { color: #495057; background-color: #e9ecef; border-color: #868e96; } |
|
||||
.alert-secondary hr { border-top-color: #868e96; } |
|
||||
.alert-secondary .alert-link { color: #343a40; } |
|
||||
.alert-success { color: #105c10; background-color: #e1f2e1; border-color: #60ab60; } |
|
||||
.alert-success hr { border-top-color: #1d731d; } |
|
||||
.alert-success .alert-link { color: #003b00; } |
|
||||
.alert-warning { color: #6b4c00; background-color: #ffeab5; border-color: #cca443; } |
|
||||
.alert-warning hr { border-top-color: #cca443; } |
|
||||
.alert-warning .alert-link { color: #a66b00; } |
|
||||
.alert-danger { color: #700b00; background-color: #ffcac4; border-color: #e15647; } |
|
||||
.alert-danger hr { border-top-color: #e15647; } |
|
||||
.alert-danger .alert-link { color: #880000; } |
|
||||
|
|
||||
.background-primary { background-color: #4661A9; } |
|
||||
|
|
||||
.background-secondary { background-color: #60AB60; } |
|
||||
|
|
||||
.background-warning { background-color: #FFC434; } |
|
||||
|
|
||||
.background-danger { background-color: #E15647; } |
|
||||
|
|
||||
.background-gray-0 { background-color: #f8f9fa; } |
|
||||
|
|
||||
.background-gray-1 { background-color: #f1f3f5; } |
|
||||
|
|
||||
.background-gray-2 { background-color: #e9ecef; } |
|
||||
|
|
||||
.background-gray-3 { background-color: #dee2e6; } |
|
||||
|
|
||||
.background-gray-4 { background-color: #ced4da; } |
|
||||
|
|
||||
.background-gray-5 { background-color: #adb5bd; } |
|
||||
|
|
||||
.background-gray-6 { background-color: #868e96; } |
|
||||
|
|
||||
.background-gray-7 { background-color: #495057; } |
|
||||
|
|
||||
.background-gray-8 { background-color: #343a40; } |
|
||||
|
|
||||
.background-gray-9 { background-color: #212529; } |
|
||||
|
|
||||
.background-black { background-color: #000000; } |
|
||||
|
|
||||
.color-primary { color: #4661A9; } |
|
||||
|
|
||||
.color-secondary { color: #60AB60; } |
|
||||
|
|
||||
.color-gray-9 { color: #212529; } |
|
||||
|
|
||||
.rb-code { font-family: 'Source Code Pro', monospace !important; } |
|
||||
|
|
||||
.rb-isBold { font-weight: bold; } |
|
||||
|
|
||||
/* |
|
||||
Overwriting the default size for btn-lg and btn-md |
|
||||
*/ |
|
||||
.btn-primary, .btn-outline-primary, .btn-lg, .btn-large, .btn-outline-large, .btn-md, .btn-medium, .btn-outline-medium { line-height: 1em; } |
|
||||
|
|
||||
.btn-primary { background-color: #4661A9 !important; border-color: transparent !important; padding: 1rem 1.5rem !important; font-size: 1rem; } |
|
||||
.btn-primary:hover { background-color: #60AB60 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-white { color: #4661A9 !important; background-color: #ffffff !important; border-color: transparent !important; padding: 1rem 1.5rem !important; font-size: 1rem; } |
|
||||
.btn-white:hover { color: #ffffff !important; background-color: #60AB60 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-small { background-color: #4661A9 !important; border-color: transparent !important; padding: .08rem .4rem 0 !important; font-size: .8rem; color: #ffffff; } |
|
||||
.btn-small:hover { background-color: #60AB60 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-medium { background-color: #4661A9 !important; border-color: transparent !important; padding: .5rem 1rem !important; font-size: 1rem !important; color: #ffffff; } |
|
||||
.btn-medium:hover { background-color: #60AB60 !important; border-color: transparent !important; color: #ffffff; } |
|
||||
|
|
||||
.btn-large { border-radius: .3rem; background-color: #4661A9 !important; border-color: transparent !important; border-radius: 2em; padding: .5rem 1rem !important; font-size: 1.25rem !important; color: #ffffff; } |
|
||||
.btn-large:hover { background-color: #60AB60 !important; border-color: transparent !important; color: #ffffff; } |
|
||||
|
|
||||
.btn-outline-medium { border-color: #4661A9 !important; color: #4661A9 !important; padding: .5rem 1rem !important; font-size: 1rem !important; background-color: transparent !important; } |
|
||||
.btn-outline-medium:hover { color: white !important; background-color: #4661A9 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-outline-small { border-color: #4661A9 !important; color: #4661A9 !important; padding: .08rem .4rem 0 !important; font-size: .8rem; background-color: transparent !important; } |
|
||||
.btn-outline-small:hover { color: white !important; background-color: #4661A9 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-outline-primary { border-color: #4661A9 !important; color: #4661A9 !important; padding: 1rem 1.5rem !important; font-size: 1rem; } |
|
||||
.btn-outline-primary:hover { color: white !important; background-color: #4661A9 !important; border-color: transparent !important; } |
|
||||
|
|
||||
.btn-link { color: #4661A9 !important; } |
|
||||
.btn-link:hover { color: #60AB60 !important; } |
|
||||
|
|
||||
.btn-scroller { border-radius: .25rem; text-align: center; display: inline-block; -webkit-transition-duration: .1s; -o-transition-duration: .1s; -webkit-transition-timing-function: linear; -o-transition-timing-function: linear; -webkit-transition-property: background-color,color,border-color; -o-transition-property: background-color,color,border-color; padding: .5rem 1rem; transition-duration: .1s; transition-timing-function: linear; transition-property: background-color,color,border-color; color: #00000b; background-color: #dddde0; border: 0; } |
|
||||
|
|
||||
.btn-scroller:active, .btn-scroller:focus, .btn-scroller:hover { color: #00000b; background-color: #aaaab0; } |
|
||||
|
|
||||
.btn-pill { border-radius: 30px; } |
|
||||
|
|
||||
.faq__chevron-up { height: .8em; vertical-align: -.06em; fill: currentColor; margin-left: .5em; -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); } |
|
||||
|
|
||||
.badge-primary { background-color: #4661A9 !important; } |
|
||||
|
|
||||
.badge-secondary { background-color: #60AB60 !important; } |
|
||||
|
|
||||
.footer ul { list-style: none; font-weight: 600; text-transform: capitalize; margin-bottom: 2rem; } |
|
||||
.footer ul span { display: block; margin-bottom: 0.5em; } |
|
||||
.footer ul a { color: rgba(255, 255, 255, 0.5); font-weight: 400; } |
|
||||
.footer ul a:hover { color: #ffffff; } |
|
||||
.footer__social-media { display: flex; margin-top: 16px !important; } |
|
||||
.footer__social-media-icon { height: 40px; width: 40px; margin-right: 1rem; margin-bottom: 1rem; color: rgba(255, 255, 255, 0.5); } |
|
||||
.footer__social-media-icon:hover { color: #ffffff; } |
|
||||
.footer-extras ul li { margin: 0 0.5rem; } |
|
||||
.footer-extras__logo img { max-width: 180px; height: auto; } |
|
||||
.footer .spacer { content: " "; height: 2rem; } |
|
||||
|
|
||||
#styleguide-nav { background-color: #4661A9 !important; } |
|
||||
#styleguide-nav .nav-item:hover { box-shadow: inset 0 -5px #ffffff; } |
|
||||
#styleguide-nav .nav-link { color: #ffffff; } |
|
||||
#styleguide-nav .show .nav-item:hover { box-shadow: 0 0; } |
|
||||
|
|
||||
.rb-link { color: #4661A9 !important; } |
|
||||
.rb-link:hover { color: #60AB60 !important; } |
|
||||
|
|
||||
.rb-paginate-active { background-color: #4661A9 !important; color: white !important; } |
|
||||
.rb-paginate-active:hover { background-color: #60AB60 !important; } |
|
||||
|
|
||||
.pagination .page-link { color: #212529; } |
|
||||
|
|
||||
.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th { background-color: #dee2e6 !important; } |
|
||||
|
|
||||
.mark, mark { background-color: #dee2e6 !important; padding: .2em !important; } |
|
||||
|
|
||||
@media (min-width: 992px) { .display-xs { display: none !important; } } |
|
||||
@media (max-width: 992px) { .display-md { display: none !important; } } |
|
||||
.display-md { display: unset; } |
|
||||
|
|
||||
body { color: #212529; font-family: "Source Sans Pro", sans-serif !important; font-size: 1rem; } |
|
||||
|
|
||||
a { text-decoration: none !important; } |
|
||||
@ -1,15 +0,0 @@ |
|||||
@media (min-width: 992px) { |
|
||||
.display-xs { |
|
||||
display: none !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
@media (max-width: 992px) { |
|
||||
.display-md { |
|
||||
display: none !important; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.display-md { |
|
||||
display: unset; |
|
||||
} |
|
||||
@ -1,60 +0,0 @@ |
|||||
$primary: #4661A9; |
|
||||
$secondary: #60AB60; |
|
||||
$warning: #FFC434; |
|
||||
$danger: #E15647; |
|
||||
$font: 'Source Sans Pro', sans-serif !important; |
|
||||
|
|
||||
// Open color |
|
||||
// |
|
||||
// |
|
||||
// 𝗖 𝗢 𝗟 𝗢 𝗥 |
|
||||
// v 1.6.3 |
|
||||
// |
|
||||
// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ |
|
||||
|
|
||||
|
|
||||
// General |
|
||||
// ─────────────────────────────────── |
|
||||
|
|
||||
$oc-white: #ffffff; |
|
||||
$oc-black: #000000; |
|
||||
|
|
||||
|
|
||||
// Gray |
|
||||
// ─────────────────────────────────── |
|
||||
|
|
||||
$oc-gray-list: ( |
|
||||
"0": #f8f9fa, |
|
||||
"1": #f1f3f5, |
|
||||
"2": #e9ecef, |
|
||||
"3": #dee2e6, |
|
||||
"4": #ced4da, |
|
||||
"5": #adb5bd, |
|
||||
"6": #868e96, |
|
||||
"7": #495057, |
|
||||
"8": #343a40, |
|
||||
"9": #212529 |
|
||||
); |
|
||||
|
|
||||
$oc-gray-0: map-get($oc-gray-list, "0"); |
|
||||
$oc-gray-1: map-get($oc-gray-list, "1"); |
|
||||
$oc-gray-2: map-get($oc-gray-list, "2"); |
|
||||
$oc-gray-3: map-get($oc-gray-list, "3"); |
|
||||
$oc-gray-4: map-get($oc-gray-list, "4"); |
|
||||
$oc-gray-5: map-get($oc-gray-list, "5"); |
|
||||
$oc-gray-6: map-get($oc-gray-list, "6"); |
|
||||
$oc-gray-7: map-get($oc-gray-list, "7"); |
|
||||
$oc-gray-8: map-get($oc-gray-list, "8"); |
|
||||
$oc-gray-9: map-get($oc-gray-list, "9"); |
|
||||
|
|
||||
// Mixins |
|
||||
// |
|
||||
// .header-display :before size and position |
|
||||
@mixin headerDisplayBefore($size) { |
|
||||
$height: $size * 1.5; |
|
||||
$horizontalAlignment: -15px; |
|
||||
$verticalAlignment: $height * -0.25; |
|
||||
height: $height; |
|
||||
transform: translate($horizontalAlignment, 0); |
|
||||
margin-bottom: $verticalAlignment; |
|
||||
} |
|
||||
@ -1,60 +0,0 @@ |
|||||
.color { |
|
||||
height: 100px; |
|
||||
} |
|
||||
|
|
||||
.grid { |
|
||||
height: 100px; |
|
||||
background-color: $primary; |
|
||||
border-radius: 7px; |
|
||||
|
|
||||
& span { |
|
||||
margin: 10px 10px 10px 10px; |
|
||||
color: white; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.header-display { |
|
||||
&::before { |
|
||||
background: $secondary; |
|
||||
content: " "; |
|
||||
display: inline-block; |
|
||||
width: 7px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
h1.header-display { |
|
||||
&::before { |
|
||||
@include headerDisplayBefore(2.5rem); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
h2.header-display { |
|
||||
&::before { |
|
||||
@include headerDisplayBefore(2rem); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
h3.header-display { |
|
||||
&::before { |
|
||||
@include headerDisplayBefore(1.75rem); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
h4.header-display { |
|
||||
&::before { |
|
||||
@include headerDisplayBefore(1.5rem); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.icon { |
|
||||
font-size: 20px; |
|
||||
background-color: $oc-gray-9; |
|
||||
padding: 20px; |
|
||||
} |
|
||||
|
|
||||
.typography__headers__item { |
|
||||
margin-bottom: 2rem; |
|
||||
p { |
|
||||
margin-bottom: 0.5rem !important; |
|
||||
} |
|
||||
} |
|
||||
@ -1,572 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang="en" dir="ltr"> |
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>I2P Styleguide</title> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/open-iconic-bootstrap.css" /> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/bootstrap.min.css"> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/styles/main.css"> |
|
||||
<link rel="shortcut icon" type="image/png" href="/i2p-styleguide/assets/images/favicon.png"/> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcesans.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcecode.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/i2p.css" rel="stylesheet"> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom border-black sticky-top rp-navbar__top"> |
|
||||
<a class="navbar-brand" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
<div class="collapse navbar-collapse " id="navbarSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto display-xs"> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/">About</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/getting-started">Getting Started</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/design/">Design</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/components/">Components</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/writing/">Writing</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-md-3 hidden-sm p-0"> |
|
||||
<div class="row" style="height: 100%"> |
|
||||
<div class="col-md-6 col-sm-16 col-xs-12 p-0"> |
|
||||
<div class="sidebar rb-sidebar__1" id="sidebar1"> |
|
||||
<ul id="sidebar-left" class="col-md-2 col-sm-16 col-xs-12 p-0 list-group pt-3 sidebar-fill"> |
|
||||
<a href="/i2p-styleguide/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">About</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/getting-started/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Getting Started</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/design/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Design</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/components/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Components</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/writing/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Writing</li> |
|
||||
</a> |
|
||||
</ul> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="col-md-6 col-sm-12 col-xs-3 p-0"> |
|
||||
<div class="sidebar border-left-right rb-sidebar__2" id="sidebar" style="border-color: $oc-gray-1;"> |
|
||||
<ul class="p-0 list-group pt-3 sidebar-fill"> |
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#alerts"><li class="list-group-item rb-sidebar"> |
|
||||
Alerts |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#badges"><li class="list-group-item rb-sidebar"> |
|
||||
Badges |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#buttons"><li class="list-group-item rb-sidebar"> |
|
||||
Buttons |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#cards"><li class="list-group-item rb-sidebar"> |
|
||||
Cards |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#footer"><li class="list-group-item rb-sidebar"> |
|
||||
Footer |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#forms"><li class="list-group-item rb-sidebar"> |
|
||||
Forms |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
|
|
||||
<a class="sidebar__link__light" href="#header"><li class="list-group-item rb-sidebar"> |
|
||||
Header |
|
||||
</li></a> |
|
||||
|
|
||||
|
|
||||
</ul> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="col-lg-9 pt-0 pl-5"> |
|
||||
<!--<p>This is the components page</p> |
|
||||
--> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="page-header mb-4"> |
|
||||
<h2 id="alerts">Alerts</h2> |
|
||||
<p class="text-muted">Some Description about alerts.</p> |
|
||||
</div> |
|
||||
<div class="row p-5 bg-light"> |
|
||||
<div class="col-12 alert alert-primary" role="alert"> |
|
||||
<p class="mb-0">This is a primary alert — check it out!</p> |
|
||||
</div> |
|
||||
<div class="col-12 alert alert-secondary" role="alert"> |
|
||||
<p class="mb-0">This is a default alert — check it out!</p> |
|
||||
</div> |
|
||||
<div class="col-12 alert alert-success" role="alert"> |
|
||||
<p class="mb-0">This is a success alert — check it out!</p> |
|
||||
</div> |
|
||||
<div class="col-12 alert alert-warning" role="alert"> |
|
||||
<p class="mb-0">This is a warning alert — check it out!</p> |
|
||||
</div> |
|
||||
<div class="col-12 alert alert-danger" role="alert"> |
|
||||
<p class="mb-0">This is a danger alert — check it out!</p> |
|
||||
</div> |
|
||||
<div class="col-12 alert alert-success" role="alert"> |
|
||||
<h4 class="alert-header">Well done!!</h4> |
|
||||
<p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p> |
|
||||
<hr> |
|
||||
<p class="mb-0">Also some extra text and a <a href="#alerts" class="alert-link">link</a>.</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="page-header mb-4"> |
|
||||
<h2 id="badges">Badges</h2> |
|
||||
<!--p class="text-muted">Some Description about badges.</p--> |
|
||||
</div> |
|
||||
<div class="row p-5 bg-light"> |
|
||||
<div class="col-12"> |
|
||||
<h2>Example heading <span class="badge badge-primary">New</span></h2> |
|
||||
</div> |
|
||||
<div class="col-12"> |
|
||||
<h4 class="pt-4">Example heading <span class="badge badge-secondary">New</span></h4> |
|
||||
</div> |
|
||||
<div class="col-12"> |
|
||||
<h6 class="pt-4">Example heading <span class="badge-pill badge-primary">New</span></h6> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div id="buttons" class="mb-4"> |
|
||||
<h2>Buttons</h2> |
|
||||
<!--p class="text-muted">Some Description about buttons.</p--> |
|
||||
</div> |
|
||||
<div class="row bg-light p-5"> |
|
||||
<div class="col-xs-12 col-sm-6 col-md-6 p-1"> |
|
||||
<p class="text-black small text-muted m-0 pb-2">Primary</p> |
|
||||
<button type="button" class="btn btn-lg btn-primary btn-pill mr-2">Primary</button> |
|
||||
<p class="text-black small text-muted m-0 pt-2 pb-2">Ghost</p> |
|
||||
<button type="button" class="btn btn-lg btn-outline-primary btn-pill mr-2">How to Contribute</button> |
|
||||
<p class="text-black small text-muted m-0 pt-2">Link</p> |
|
||||
<button type="button" class="btn btn-lg btn-link mr-2">Learn more</button> |
|
||||
</div> |
|
||||
<div class="col-xs-12 col-sm-6 col-md-6 p-1"> |
|
||||
<p class="text-black small text-muted m-0 pt-2 pb-2">Medium</p> |
|
||||
<button type="button" class="btn btn-medium btn-pill mr-2">Medium</button> |
|
||||
<button type="button" class="btn btn-outline-medium btn-pill mr-2">Ghost</button> |
|
||||
<button type="button" class="btn btn-link mr-2">Link</button> |
|
||||
<p class="text-black small text-muted m-0 pt-2 pb-2">Small</p> |
|
||||
<button type="button" class="btn btn-sm btn-small btn-pill mr-2">Small</button> |
|
||||
<button type="button" class="btn btn-sm btn-outline-small btn-pill mr-2">Ghost</button> |
|
||||
<button type="button" class="btn btn-sm btn-link mr-2">Link</button> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="mb-4" id="cards"> |
|
||||
<h2>Cards</h2> |
|
||||
<div class="row bg-light p-md-5 p-sm-3 pt-5 pb-5"> |
|
||||
<div class="col-md-6 col-sm-12 col-xs-12"> |
|
||||
<div class="card mb-2"> |
|
||||
<div class="card-body"> |
|
||||
<h4 class="card-title">I2P</h4> |
|
||||
<p class="card-text text-muted">I2P is an open source whistleblower submission system that media organizations can install to securely accept documents from anonymous sources.</p> |
|
||||
<a href="#" class="btn btn-medium btn-pill" onclick="return false;">Visit website</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="card mb-2"> |
|
||||
<div class="card-body"> |
|
||||
<h4 class="card-title">I2P</h4> |
|
||||
<p class="card-text text-muted">I2P is an open source whistleblower submission system that media organizations can install to securely accept documents from anonymous sources.</p> |
|
||||
<a href="#" class="rb-link" onclick="return false;">Apply</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="card"> |
|
||||
<div class="card-body"> |
|
||||
<h4 class="card-title">I2P</h4> |
|
||||
<p class="card-text text-muted">I2P is an open source whistleblower submission system that media organizations can install to securely accept documents from anonymous sources.</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="col-md-6 col-sm-12 col-xs-12"> |
|
||||
<div class="card"> |
|
||||
<img class="card-img-top" |
|
||||
src="/i2p-styleguide/assets/images/placeholder.jpg" alt="Card image cap"> |
|
||||
<div class="card-body"> |
|
||||
<h4 class="card-title">A few things everyone can do now</h4> |
|
||||
<p class="card-text text-muted">Numerous people contribute to the project to varying extents.</p> |
|
||||
</div> |
|
||||
<ul class="list-group list-group-flush"> |
|
||||
<li class="list-group-item">Consider <a href="#" class="rb-link" onclick="return false;"> |
|
||||
<mark>contributing</mark> |
|
||||
</a> to help the I2P project grow. |
|
||||
</li> |
|
||||
<li class="list-group-item">Take a moment to |
|
||||
<mark>donate</mark> |
|
||||
to support further development. |
|
||||
</li> |
|
||||
<li class="list-group-item">Help |
|
||||
<mark>translate</mark> |
|
||||
the documentation into <a href="#" class="rb-link" onclick="return false;">other languages</a>. |
|
||||
</li> |
|
||||
</ul> |
|
||||
<div class="card-body"> |
|
||||
<a href="#" class="rb-link" onclick="return false;">View All</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div id="footer" class="page-header mb-4"> |
|
||||
<h3>Footer</h3> |
|
||||
</div> |
|
||||
|
|
||||
<div class="footer col-12 p-5 background-primary text-white"> |
|
||||
<div class="footer__wrapper col-lg-11 col-md-12 mx-auto" > |
|
||||
<div class="row" id="footer-lists"> |
|
||||
<ul class="col-lg-3 col-md-4 col-sm-6 col-xs-12" id="footer-i2p-menu"> |
|
||||
<span>I2P</span> |
|
||||
<li><a href="#">About</a></li> |
|
||||
<li><a href="#">Blog</a></li> |
|
||||
<li><a href="#">events</a></li> |
|
||||
<li><a href="#">contact us</a></li> |
|
||||
</ul> |
|
||||
<ul class="col-lg-3 col-md-4 col-sm-6 col-xs-12" id="footer-gettingStarted-menu"> |
|
||||
<span>Getting started</span> |
|
||||
<li><a href="#">guides</a></li> |
|
||||
<li><a href="#">technology</a></li> |
|
||||
<li><a href="#">api</a></li> |
|
||||
<li><a href="#">docs</a></li> |
|
||||
</ul> |
|
||||
<ul class="col-lg-3 col-md-4 col-sm-6 col-xs-12" id="footer-getInvolved-menu"> |
|
||||
<span>get involved</span> |
|
||||
<li><a href="#">contribute</a></li> |
|
||||
<li><a href="#">donate</a></li> |
|
||||
<li><a href="#">partners</a></li> |
|
||||
</ul> |
|
||||
<ul class="col-lg-3 col-md-4 col-sm-6 col-xs-12 mb-5" id="footer-socialMedia-menu"> |
|
||||
<span>Follow us</span> |
|
||||
<div class="row footer__social-media" > |
|
||||
<li> |
|
||||
<svg |
|
||||
class="footer__social-media-icon" |
|
||||
fill="none" |
|
||||
stroke="currentColor" |
|
||||
stroke-width="2" |
|
||||
stroke-linecap="round" |
|
||||
stroke-linejoin="round" |
|
||||
> |
|
||||
<use xlink:href="../assets/images/feather-sprite.svg#github"/> |
|
||||
</svg> |
|
||||
</li> |
|
||||
<li> |
|
||||
<svg |
|
||||
class="footer__social-media-icon" |
|
||||
fill="none" |
|
||||
stroke="currentColor" |
|
||||
stroke-width="2" |
|
||||
stroke-linecap="round" |
|
||||
stroke-linejoin="round" |
|
||||
> |
|
||||
<use xlink:href="../assets/images/feather-sprite.svg#twitter"/> |
|
||||
</svg> |
|
||||
</li> |
|
||||
<li> |
|
||||
<svg |
|
||||
class="footer__social-media-icon" |
|
||||
fill="none" |
|
||||
stroke="currentColor" |
|
||||
stroke-width="2" |
|
||||
stroke-linecap="round" |
|
||||
stroke-linejoin="round" |
|
||||
> |
|
||||
<use xlink:href="../assets/images/feather-sprite.svg#slack"/> |
|
||||
</svg> |
|
||||
</li> |
|
||||
</div> |
|
||||
</ul> |
|
||||
</div> |
|
||||
<div class="spacer col-12" ></div> |
|
||||
<div class="footer-extras row"> |
|
||||
<div class="footer-extras__logo col-md-6 col-sm-12" > |
|
||||
<img class="mb-3" src="https://raw.githubusercontent.com/uracreative/works/master/I2P/PNG/horizontal_white.png" class="img-fluid" /> |
|
||||
<p>© 2018 The Invisible Internet Project<br /> |
|
||||
Content available under a Creative Commons license.</p> |
|
||||
</div> |
|
||||
<div class="col-lg-4 col-sm-12" > |
|
||||
<ul class="d-flex flex-wrap pl-0"> |
|
||||
<li><a href="#">data policy</a></li> |
|
||||
<li><a href="#">legal</a></li> |
|
||||
<li><a href="#">sitemap</a></li> |
|
||||
<li><a href="#">impressum</a></li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="page-header mb-4" id="forms"> |
|
||||
<h2>Forms</h2> |
|
||||
<!--p class="text-muted">Some Description about Forms.</p--> |
|
||||
</div> |
|
||||
<div class="row"> |
|
||||
<form class="bg-light p-5 col-sm-6"> |
|
||||
<div class="form-group"> |
|
||||
<label for="exampleInputEmail1">Email address</label> |
|
||||
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email"> |
|
||||
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> |
|
||||
</div> |
|
||||
<div class="form-group"> |
|
||||
<label for="exampleInputPassword1">Password</label> |
|
||||
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> |
|
||||
</div> |
|
||||
<div class="form-check"> |
|
||||
<input type="checkbox" class="form-check-input" id="check_me_out"> |
|
||||
<label for="check_me_out" class="form-check-label ml-2 mt-1">Check me out</label> |
|
||||
</div> |
|
||||
<button type="submit" class="btn btn-medium btn-pill mt-4" onclick="return false;">Submit</button> |
|
||||
</form> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div id="header" class="mb-4"> |
|
||||
<h2>Header</h2> |
|
||||
<!--p class="text-muted">Some Description about buttons.</p--> |
|
||||
</div> |
|
||||
<div class="bg-light p-5" id=""> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom align-items-end py-3" id="styleguide-nav" "style=background: $oc-white"> |
|
||||
<a class="navbar-brand mr-5" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#SGnavSupportedContent" aria-controls="SGnavSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
|
|
||||
<div class="collapse navbar-collapse" id="SGnavSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto"> |
|
||||
<li class="nav-item pb-2"> |
|
||||
<a class="nav-link mx-1 text-capitalize font-weight-bold" href="#">Blog</a> |
|
||||
</li> |
|
||||
<li class="nav-item pb-2"> |
|
||||
<a class="nav-link mx-1 text-capitalize font-weight-bold" href="#">Getting started</a> |
|
||||
</li> |
|
||||
<li class="nav-item pb-2"> |
|
||||
<a class="nav-link mx-1 text-capitalize font-weight-bold" href="#">Docs & data</a> |
|
||||
</li> |
|
||||
<li class="nav-item pb-2"> |
|
||||
<a class="nav-link mx-1 text-capitalize font-weight-bold" href="#">Contribute</a> |
|
||||
</li> |
|
||||
<li class="nav-item pb-2"> |
|
||||
<a class="nav-link mx-1 text-capitalize font-weight-bold" href="#">About us</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<!--div class="component-wrapper my-5" id=""> |
|
||||
<div class="mb-4" id="jumbotron"> |
|
||||
<h2 >Jumbotron</h2> |
|
||||
<div class="bg-light p-md-5 p-sm-3"> |
|
||||
<div class="jumbotron bg-primary text-white"> |
|
||||
<div class="container" > |
|
||||
<div class="row" > |
|
||||
<div class="col-sm-4 d-none d-sm-block" > |
|
||||
<img src="../assets/images/jumbo.png" class="img-fluid" /> |
|
||||
</div> |
|
||||
<div class="col-sm-8" > |
|
||||
<h1 class="display-4">Privacy in numbers</h1> |
|
||||
<p class="lead">Protect communication from dragnet surveillance and monitoring.</p> |
|
||||
<hr class="my-4"> |
|
||||
<a class="btn btn-white btn-pill btn-lg" href="#" role="button">Download I2P</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div--> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="page-header mb-4 " id="pagination"> |
|
||||
<h2>Pagination</h2> |
|
||||
<!--p class="text-muted">Some Description about pagination.</p--> |
|
||||
</div> |
|
||||
<div class="row bg-light p-5"> |
|
||||
<nav aria-label="..."> |
|
||||
<ul class="pagination m-0"> |
|
||||
<li class="page-item disabled"> |
|
||||
<span class="page-link">Previous</span> |
|
||||
</li> |
|
||||
<li class="page-item"><a class="page-link" href="#" onclick="return false;">1</a></li> |
|
||||
<li class="page-item"> |
|
||||
<span class="page-link rb-paginate-active"> |
|
||||
2<span class="sr-only">(current)</span> |
|
||||
</span> |
|
||||
</li> |
|
||||
<li class="page-item"><a class="page-link" href="#" onclick="return false;">3</a></li> |
|
||||
<li class="page-item"> |
|
||||
<a class="page-link" href="#" onclick="return false;">Next</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</nav> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="component-wrapper my-5" id=""> |
|
||||
<div class="page-header mb-4" id="tables"> |
|
||||
<h2>Tables</h2> |
|
||||
</div> |
|
||||
<div class="row bg-light p-5"> |
|
||||
<span>Default</span> |
|
||||
<br /> |
|
||||
<table class="table"> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">#</th> |
|
||||
<th scope="col">First</th> |
|
||||
<th scope="col">Last</th> |
|
||||
<th scope="col">Handle</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<th scope="row">1</th> |
|
||||
<td>Mark</td> |
|
||||
<td>Otto</td> |
|
||||
<td>@mdo</td> |
|
||||
</tr> |
|
||||
<tr> |
|
||||
<th scope="row">2</th> |
|
||||
<td>Jacob</td> |
|
||||
<td>Thornton</td> |
|
||||
<td>@fat</td> |
|
||||
</tr> |
|
||||
<tr> |
|
||||
<th scope="row">3</th> |
|
||||
<td>Larry</td> |
|
||||
<td>the Bird</td> |
|
||||
<td>@twitter</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
<span>Striped</span> |
|
||||
<br /> |
|
||||
<table class="table table-striped"> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th scope="col">#</th> |
|
||||
<th scope="col">First</th> |
|
||||
<th scope="col">Last</th> |
|
||||
<th scope="col">Handle</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
<tbody> |
|
||||
<tr> |
|
||||
<th scope="row">1</th> |
|
||||
<td>Mark</td> |
|
||||
<td>Otto</td> |
|
||||
<td>@mdo</td> |
|
||||
</tr> |
|
||||
<tr> |
|
||||
<th scope="row">2</th> |
|
||||
<td>Jacob</td> |
|
||||
<td>Thornton</td> |
|
||||
<td>@fat</td> |
|
||||
</tr> |
|
||||
<tr> |
|
||||
<th scope="row">3</th> |
|
||||
<td>Larry</td> |
|
||||
<td>the Bird</td> |
|
||||
<td>@twitter</td> |
|
||||
</tr> |
|
||||
</tbody> |
|
||||
</table> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
<div class="page-header mb-4 mt-5 d-none d-sm-none"> |
|
||||
<h3>Scrollspy</h3> |
|
||||
</div> |
|
||||
<div class="row p-0 pt-5 bg-light d-none d-sm-none"> |
|
||||
<div class="bd-example"> |
|
||||
<div class="row"> |
|
||||
<div class="col-4"> |
|
||||
<div id="list-example" class="list-group"> |
|
||||
<a class="list-group-item list-group-item-action active" href="https://securedrop.org/">SecureDrop</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-2">Second Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-3">Third Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-4">Forth Link</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="dropdown-divider mt-5 wi"></div> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-12 p-0"> |
|
||||
<p class="mt-5 mb-5"> |
|
||||
<span class="text-muted small"> Styleguide code licensed under <a href="https://opensource.org/licenses/MIT" class="rb-link" title="MIT" target="_blank">MIT</a>, documents licensed under a <a href="https://creativecommons.org/licenses/by/3.0/us/" title="CC 3.0" target="_blank">Creative Commons Attribution 3.0 United States License</a>. I2P is an anonymous network, exposing a simple layer that applications can use to anonymously and securely send messages to each other.<br>Templates and styles based on the <a href="https://reproducible-builds.org/style" target="_blank">Reproducible Builds styleguide</a>.</span> |
|
||||
</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
<script src="/i2p-styleguide/assets/javascript/modernizr.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/jquery-3.3.1.slim.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/popper.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/bootstrap.min.js"></script> |
|
||||
<!-- <script src="/i2p-styleguide/assets/javascript/run_prettify.js"></script> /* --> |
|
||||
<script type="text/javascript" src="/i2p-styleguide/assets/javascript/index.js"></script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
||||
@ -1,154 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang="en" dir="ltr"> |
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>I2P Styleguide</title> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/open-iconic-bootstrap.css" /> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/bootstrap.min.css"> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/styles/main.css"> |
|
||||
<link rel="shortcut icon" type="image/png" href="/i2p-styleguide/assets/images/favicon.png"/> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcesans.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcecode.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/i2p.css" rel="stylesheet"> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom border-black sticky-top rp-navbar__top"> |
|
||||
<a class="navbar-brand" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
<div class="collapse navbar-collapse " id="navbarSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto display-xs"> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/">About</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/getting-started">Getting Started</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/design/">Design</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/components/">Components</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/writing/">Writing</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
|
|
||||
<div class="row" style="height: 100%"> |
|
||||
<div class="col-md-3 col-sm-4 col-xs-4 p-0"> |
|
||||
<div class="row" style="height: 100%"> |
|
||||
<div class="col-md-6 col-sm-6 col-xs-6 p-0 display-md"> |
|
||||
<div class="sidebar rb-sidebar__1" id="sidebar1"> |
|
||||
<ul id="sidebar-left" class="col-md-2 col-sm-16 col-xs-12 p-0 list-group pt-3 sidebar-fill"> |
|
||||
<a href="/i2p-styleguide/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">About</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/getting-started/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Getting Started</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/design/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Design</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/components/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Components</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/writing/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Writing</li> |
|
||||
</a> |
|
||||
</ul> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="col-md-7 col-xs-12 col-sm-12 p-0"> |
|
||||
<main role="main" class="content-scroll p-5" data-spy="scroll" |
|
||||
data-target="#components-nav" data-offset="0"> |
|
||||
<div class="row"> |
|
||||
<div class="col-12 p-0"> |
|
||||
<div class="page-header mb-4"> |
|
||||
<h3>Getting started</h3> |
|
||||
<p class="text-muted">We are making I2P usable for everyone.</p> |
|
||||
</div> |
|
||||
<p>The I2P styleguide is based on <a href="https://getbootstrap.com/">Bootstrap</a>, an open-source |
|
||||
toolkit for developing with HTML, CSS, and JS. We are currently on |
|
||||
<a href="https://getbootstrap.com/docs/4.1/getting-started/introduction/">v4.1.0</a>. |
|
||||
</p> |
|
||||
<p> |
|
||||
To use the I2P styleguide, you can download our scss style (components.scss) and |
|
||||
import it in your project with bootstrap included. <a href="http://sass-lang.com/">SASS</a> is a CSS extension language. |
|
||||
</p> |
|
||||
<p class="purple"> |
|
||||
If you want to use SASS you can download the complete archive for the styleguide. The scss folder under |
|
||||
assets contains all the sass files. Since we use bootstrap, we only add a few styles without |
|
||||
modifying bootstrap core or defining new elements whenever possible. |
|
||||
</p> |
|
||||
<p>Bootstrap contains a few JavaScript libraries for extra interaction with the DOM. We use these |
|
||||
libraries but do not add extra JavaScript, so that only few elements are affected if you disable JavaScript. |
|
||||
</p> |
|
||||
<p>This styleguide has been built using <a href="https://jekyllrb.com/">Jekyll</a>. |
|
||||
Jekyll is a simple, blog-aware, static site generator. You can build this yourself by |
|
||||
<a href="https://jekyllrb.com/docs/continuous-integration/buddyworks/#1-getting-started"> |
|
||||
installing Jekyll</a>.</p> |
|
||||
<div class="bg-box p-5 mb-3"> |
|
||||
<h6>Use the I2P Styleguide</h6> |
|
||||
<p class="m-0">This package includes .scss files</p> |
|
||||
<a class="btn btn-lg btn-link p-0" title="I2P Repo" |
|
||||
href="https://github.com/uracreative/i2p-styleguide/tree/master/assets/styles" target="_blank">Visit Repo</a></div> |
|
||||
<div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="page-header mb-4 mt-5 d-none d-sm-none"> |
|
||||
<h3>Scrollspy</h3> |
|
||||
</div> |
|
||||
<div class="row p-0 pt-5 bg-light d-none d-sm-none"> |
|
||||
<div class="bd-example"> |
|
||||
<div class="row"> |
|
||||
<div class="col-4"> |
|
||||
<div id="list-example" class="list-group"> |
|
||||
<a class="list-group-item list-group-item-action active" href="https://securedrop.org/">SecureDrop</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-2">Second Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-3">Third Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-4">Forth Link</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="dropdown-divider mt-5 wi"></div> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-12 p-0"> |
|
||||
<p class="mt-5 mb-5"> |
|
||||
<span class="text-muted small"> Styleguide code licensed under <a href="https://opensource.org/licenses/MIT" class="rb-link" title="MIT" target="_blank">MIT</a>, documents licensed under a <a href="https://creativecommons.org/licenses/by/3.0/us/" title="CC 3.0" target="_blank">Creative Commons Attribution 3.0 United States License</a>. I2P is an anonymous network, exposing a simple layer that applications can use to anonymously and securely send messages to each other.<br>Templates and styles based on the <a href="https://reproducible-builds.org/style" target="_blank">Reproducible Builds styleguide</a>.</span> |
|
||||
</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
</main> |
|
||||
</div> |
|
||||
</div> |
|
||||
<script src="/i2p-styleguide/assets/javascript/modernizr.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/jquery-3.3.1.slim.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/popper.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/bootstrap.min.js"></script> |
|
||||
<!-- <script src="/i2p-styleguide/assets/javascript/run_prettify.js"></script> /* --> |
|
||||
<script type="text/javascript" src="/i2p-styleguide/assets/javascript/index.js"></script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
||||
@ -1,157 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang="en" dir="ltr"> |
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>I2P Styleguide</title> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/open-iconic-bootstrap.css" /> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/bootstrap.min.css"> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/styles/main.css"> |
|
||||
<link rel="shortcut icon" type="image/png" href="/i2p-styleguide/assets/images/favicon.png"/> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcesans.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcecode.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/i2p.css" rel="stylesheet"> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||
</head> |
|
||||
|
|
||||
|
|
||||
<body> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom border-black sticky-top rp-navbar__top"> |
|
||||
<a class="navbar-brand" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
<div class="collapse navbar-collapse " id="navbarSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto display-xs"> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/">About</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/getting-started">Getting Started</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/design/">Design</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/components/">Components</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/writing/">Writing</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-md-3 col-sm-4 col-xs-4 p-0"> |
|
||||
<div class="row" style="height: 100%"> |
|
||||
<div class="col-md-6 col-sm-6 col-xs-6 p-0 display-md sidebar-fill"> |
|
||||
<div class="sidebar rb-sidebar__1" id="sidebar1"> |
|
||||
<ul id="sidebar-left" class="col-md-2 col-sm-16 col-xs-12 p-0 list-group pt-3 sidebar-fill"> |
|
||||
<a href="/i2p-styleguide/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">About</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/getting-started/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Getting Started</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/design/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Design</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/components/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Components</li> |
|
||||
</a> |
|
||||
|
|
||||
<a href="/i2p-styleguide/writing/" class="sidebar__link__light"> |
|
||||
<li class="list-group-item rb-main-sidebar">Writing</li> |
|
||||
</a> |
|
||||
</ul> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="col-md-7 col-xs-12 col-sm-12 p-0"> |
|
||||
<main role="main" class="content-scroll p-5" data-spy="scroll" data-target="#components-nav" data-offset="0"> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-12 p-0"> |
|
||||
<div class="page-header mb-4"> |
|
||||
<h3>About</h3> |
|
||||
<p class="text-muted">I2P is an anonymous network, exposing a simple layer that applications can use to anonymously and securely send messages to each other. The network itself is strictly message based (a la IP), but there is a library available to allow reliable streaming communication on top of it (a la TCP).</p> |
|
||||
</div> |
|
||||
<p>This guide aims to provide standards, principles and components to design consistent views related to the I2P. These pages are a living document and we welcome contributions, feedback and suggestions.</p> |
|
||||
</p> |
|
||||
<br> |
|
||||
<h5>Contact</h5> |
|
||||
<div class="row mt-5"> |
|
||||
<div class="col-md-6 p-0"> |
|
||||
<div class="bg-box p-5 mb-3"> |
|
||||
<h6>Forum</h6> |
|
||||
<a class="btn btn-lg btn-link p-0" title="I2P Forum" href="https://i2pforum.net/" target="_blank" rel="noopener">I2P Forum</a></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="col-12 p-0"> |
|
||||
<div class="page-header mb-4 mt-5"> |
|
||||
<h5>Identihub</h5> |
|
||||
<p class="text-muted">The I2P brand assets are included in this Identihub project page.</p> |
|
||||
</div> |
|
||||
<div class="row mt-5"> |
|
||||
<div class="col-md-6 p-0"> |
|
||||
<div class="bg-box p-5 mb-3 text-left"> |
|
||||
<h6>Styleguide Mirror on Identihub</h6> |
|
||||
<p class="m-0"></p> |
|
||||
<a class="btn btn-lg btn-link p-0" href="https://demo.identihub.co/project/i2p" target="_blank">Project Page</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="page-header mb-4 mt-5 d-none d-sm-none"> |
|
||||
<h3>Scrollspy</h3> |
|
||||
</div> |
|
||||
<div class="row p-0 pt-5 bg-light d-none d-sm-none"> |
|
||||
<div class="bd-example"> |
|
||||
<div class="row"> |
|
||||
<div class="col-4"> |
|
||||
<div id="list-example" class="list-group"> |
|
||||
<a class="list-group-item list-group-item-action active" href="https://securedrop.org/">SecureDrop</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-2">Second Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-3">Third Link</a> |
|
||||
<a class="list-group-item list-group-item-action" href="#list-item-4">Forth Link</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="dropdown-divider mt-5 wi"></div> |
|
||||
|
|
||||
<div class="row"> |
|
||||
<div class="col-12 p-0"> |
|
||||
<p class="mt-5 mb-5"> |
|
||||
<span class="text-muted small"> Styleguide code licensed under <a href="https://opensource.org/licenses/MIT" class="rb-link" title="MIT" target="_blank">MIT</a>, documents licensed under a <a href="https://creativecommons.org/licenses/by/3.0/us/" title="CC 3.0" target="_blank">Creative Commons Attribution 3.0 United States License</a>. I2P is an anonymous network, exposing a simple layer that applications can use to anonymously and securely send messages to each other.<br>Templates and styles based on the <a href="https://reproducible-builds.org/style" target="_blank">Reproducible Builds styleguide</a>.</span> |
|
||||
</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
|
|
||||
</main> |
|
||||
</div> |
|
||||
</div> |
|
||||
<script src="/i2p-styleguide/assets/javascript/modernizr.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/jquery-3.3.1.slim.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/popper.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/bootstrap.min.js"></script> |
|
||||
<!-- <script src="/i2p-styleguide/assets/javascript/run_prettify.js"></script> /* --> |
|
||||
<script type="text/javascript" src="/i2p-styleguide/assets/javascript/index.js"></script> |
|
||||
|
|
||||
|
|
||||
</body> |
|
||||
|
|
||||
</html> |
|
||||
@ -1,81 +0,0 @@ |
|||||
<!DOCTYPE html> |
|
||||
<html lang="en" dir="ltr"> |
|
||||
<head> |
|
||||
<meta charset="utf-8"> |
|
||||
<title>I2P Styleguide</title> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/open-iconic-bootstrap.css" /> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/static/bootstrap.min.css"> |
|
||||
<link rel="stylesheet" href="/i2p-styleguide/assets/styles/main.css"> |
|
||||
<link rel="shortcut icon" type="image/png" href="/i2p-styleguide/assets/images/favicon.png"/> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcesans.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/sourcecode.css" rel="stylesheet"> |
|
||||
<link href="/i2p-styleguide/assets/fonts/i2p.css" rel="stylesheet"> |
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
||||
</head> |
|
||||
|
|
||||
<body> |
|
||||
<nav class="navbar navbar-expand-lg navbar-dark border-bottom border-black sticky-top rp-navbar__top"> |
|
||||
<a class="navbar-brand" href="https://geti2p.net/"> |
|
||||
<img src="/i2p-styleguide/assets/images/horizontal_white.png" class="my-2" height="40" width="auto" alt=""></img> |
|
||||
</a> |
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> |
|
||||
<span class="navbar-toggler-icon"></span> |
|
||||
</button> |
|
||||
<div class="collapse navbar-collapse " id="navbarSupportedContent"> |
|
||||
<ul class="navbar-nav mr-auto display-xs"> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/">About</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/getting-started">Getting Started</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/design/">Design</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/components/">Components</a> |
|
||||
</li> |
|
||||
<li class="nav-item"> |
|
||||
<a class="nav-link" href="/i2p-styleguide/writing/">Writing</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</nav> |
|
||||
|
|
||||
<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting"> |
|
||||
|
|
||||
<header class="post-header"> |
|
||||
<h1 class="post-title p-name" itemprop="name headline">Reproducible Builds Styleguide</h1> |
|
||||
<p class="post-meta"> |
|
||||
<time class="dt-published" datetime="2018-05-06T12:24:53+02:00" itemprop="datePublished">May 6, 2018 |
|
||||
</time></p> |
|
||||
</header> |
|
||||
|
|
||||
<div class="post-content e-content" itemprop="articleBody"> |
|
||||
<p>You’ll find this post in your <code class="highlighter-rouge">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class="highlighter-rouge">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p> |
|
||||
|
|
||||
<p>To add new posts, simply add a file in the <code class="highlighter-rouge">_posts</code> directory that follows the convention <code class="highlighter-rouge">YYYY-MM-DD-name-of-post.ext</code> and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works.</p> |
|
||||
|
|
||||
<p>Jekyll also offers powerful support for code snippets:</p> |
|
||||
|
|
||||
<figure class="highlight"><pre><code class="language-ruby" data-lang="ruby"><span class="k">def</span> <span class="nf">print_hi</span><span class="p">(</span><span class="nb">name</span><span class="p">)</span> |
|
||||
<span class="nb">puts</span> <span class="s2">"Hi, </span><span class="si">#{</span><span class="nb">name</span><span class="si">}</span><span class="s2">"</span> |
|
||||
<span class="k">end</span> |
|
||||
<span class="n">print_hi</span><span class="p">(</span><span class="s1">'Tom'</span><span class="p">)</span> |
|
||||
<span class="c1">#=> prints 'Hi, Tom' to STDOUT.</span></code></pre></figure> |
|
||||
|
|
||||
<p>Check out the <a href="https://jekyllrb.com/docs/home">Jekyll docs</a> for more info on how to get the most out of Jekyll. File all bugs/feature requests at <a href="https://github.com/jekyll/jekyll">Jekyll’s GitHub repo</a>. If you have questions, you can ask them on <a href="https://talk.jekyllrb.com/">Jekyll Talk</a>.</p> |
|
||||
|
|
||||
|
|
||||
</div><a class="u-url" href="/i2p-styleguide/jekyll/update/2018/05/06/welcome-to-jekyll.html" hidden></a> |
|
||||
</article> |
|
||||
|
|
||||
<script src="/i2p-styleguide/assets/javascript/modernizr.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/jquery-3.3.1.slim.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/popper.min.js"></script> |
|
||||
<script src="/i2p-styleguide/assets/javascript/bootstrap.min.js"></script> |
|
||||
<!-- <script src="/i2p-styleguide/assets/javascript/run_prettify.js"></script> /* --> |
|
||||
<script type="text/javascript" src="/i2p-styleguide/assets/javascript/index.js"></script> |
|
||||
|
|
||||
</body> |
|
||||
</html> |
|
||||
Loading…
Reference in new issue