Browse Source

Fixes #6

pull/7/head
Anxhelo Lushka 4 years ago
parent
commit
8cf2c94767
No known key found for this signature in database GPG Key ID: C86D6CF1F7FAAA35
  1. 27
      _includes/components/alerts.html
  2. 15
      _includes/components/badges.html
  3. 24
      _includes/components/buttons.html
  4. 54
      _includes/components/cards.html
  5. 87
      _includes/components/footer.html
  6. 22
      _includes/components/forms.html
  7. 20
      _includes/components/jumbotron.html
  8. 34
      _includes/components/navbar.html
  9. 23
      _includes/components/paginate.html
  10. 12
      _includes/components/scrollspy.html
  11. 69
      _includes/components/tables.html
  12. 2
      _includes/design/typography.html
  13. 26
      _includes/head.html
  14. 3
      _includes/navbar.html
  15. 4
      _includes/navbar_side.html
  16. 4
      _includes/scripts.html
  17. 2
      _includes/scrollspy.html
  18. 2
      _includes/writing/personality.html
  19. 31
      _layouts/components.html
  20. BIN
      assets/.DS_Store
  21. BIN
      assets/fonts/i2p-iconfont.zip
  22. 77
      assets/fonts/i2p.css
  23. BIN
      assets/fonts/i2p.eot
  24. 50
      assets/fonts/i2p.svg
  25. BIN
      assets/fonts/i2p.ttf
  26. BIN
      assets/fonts/i2p.woff
  27. BIN
      assets/images/.DS_Store
  28. 2
      assets/javascript/jquery-3.4.1.slim.min.js
  29. 2
      assets/javascript/jquery-3.5.1.slim.min.js
  30. 372
      assets/styles/components.scss
  31. 4
      assets/styles/main.scss
  32. 59
      assets/styles/vars.scss
  33. 19
      components.md

27
_includes/components/alerts.html

@ -1,27 +0,0 @@
<div id="alerts" class="col page-header mb-4">
<h2>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>

15
_includes/components/badges.html

@ -1,15 +0,0 @@
<div class="col 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>

24
_includes/components/buttons.html

@ -1,24 +0,0 @@
<div id="buttons" class="col 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>

54
_includes/components/cards.html

@ -1,54 +0,0 @@
<div class="col 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="{{site.baseurl}}/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>

87
_includes/components/footer.html

@ -1,87 +0,0 @@
<div id="footer" class="col 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>© 2020 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>

22
_includes/components/forms.html

@ -1,22 +0,0 @@
<div class="col 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>

20
_includes/components/jumbotron.html

@ -1,20 +0,0 @@
<div class="col 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>

34
_includes/components/navbar.html

@ -1,34 +0,0 @@
<div id="header" class="col 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="{{site.baseurl}}{{site.logo}}" 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>

23
_includes/components/paginate.html

@ -1,23 +0,0 @@
<div class="col 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>

12
_includes/components/scrollspy.html

@ -1,12 +0,0 @@
<div class="col page-header mb-4" id="scrollspy">
<h3>Scrollspy</h3>
<!--p class="text-muted">Some Description about scrollspy.</p-->
</div>
<div class="row bg-light p-5">
<div class="col-12 p-0">
<p>
<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" rel="noopener">Reproducible Builds styleguide</a>.</span>
</p>
</div>
</div>

69
_includes/components/tables.html

@ -1,69 +0,0 @@
<div class="col 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>

2
_includes/design/typography.html

@ -147,7 +147,7 @@
<div class="col-md-6"> <div class="col-md-6">
<p class="text-black small"> <p class="text-black small">
<span class="text-left color-gray-2 rb-isBold">Code Snippet</span> <span class="text-left color-gray-2 rb-isBold">Code Snippet</span>
<span class="text-right color-primary rb-isBold" style="float: right;">Inter</span> <span class="text-right color-primary rb-isBold" style="float: right;">Source Code Pro</span>
</p> </p>
<pre class="bg-light p-2 prettyprint rb-code" style="border: none;"> <pre class="bg-light p-2 prettyprint rb-code" style="border: none;">
$('.i2p-sidebar').on('click', 'a',function() { $('.i2p-sidebar').on('click', 'a',function() {

26
_includes/head.html

@ -4,7 +4,6 @@
<link rel="stylesheet" href="{{'/assets/static/bootstrap.min.css' | prepend: site.baseurl}}"> <link rel="stylesheet" href="{{'/assets/static/bootstrap.min.css' | prepend: site.baseurl}}">
<link rel="stylesheet" href="{{'/assets/styles/main.css' | prepend: site.baseurl}}"> <link rel="stylesheet" href="{{'/assets/styles/main.css' | prepend: site.baseurl}}">
<link rel="shortcut icon" type="image/png" href="{{'/assets/images/favicon.png' | prepend: site.baseurl}}"/> <link rel="shortcut icon" type="image/png" href="{{'/assets/images/favicon.png' | prepend: site.baseurl}}"/>
<link href="{{'/assets/fonts/i2p.css' | prepend: site.baseurl}}" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
@ -49,28 +48,3 @@
} }
}()); }());
</script> </script>
<script> // Asks on first time if you want to check out the dark theme
(function() {
var theme = window.localStorage.getItem('theme');
function revokeTheme() {
if (!window.confirm('Do you want to stay with that theme?')) {
window.localStorage.removeItem('theme');
document.documentElement.dataset.theme = null;
}
}
if (!theme) {
if (window.confirm('This page offers a "dark" theme, you want to try it?')) {
window.localStorage.setItem('theme', 'dark');
document.documentElement.dataset.theme = 'dark';
window.setTimeout(revokeTheme, 3000);
} else {
window.localStorage.setItem('theme', 'light');
document.documentElement.dataset.theme = 'light';
}
}
}())
</script>

3
_includes/navbar.html

@ -19,9 +19,6 @@
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{{site.baseurl}}/design/">Design</a> <a class="nav-link" href="{{site.baseurl}}/design/">Design</a>
</li> </li>
<li class="nav-item">
<a class="nav-link" href="{{site.baseurl}}/components/">Components</a>
</li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{{site.baseurl}}/writing/">Writing</a> <a class="nav-link" href="{{site.baseurl}}/writing/">Writing</a>
</li> </li>

4
_includes/navbar_side.html

@ -12,10 +12,6 @@
<li class="list-group-item rb-main-sidebar">Design</li> <li class="list-group-item rb-main-sidebar">Design</li>
</a> </a>
<a href="{{site.baseurl}}/components/" class="sidebar__link__light">
<li class="list-group-item rb-main-sidebar">Components</li>
</a>
<a href="{{site.baseurl}}/writing/" class="sidebar__link__light"> <a href="{{site.baseurl}}/writing/" class="sidebar__link__light">
<li class="list-group-item rb-main-sidebar">Writing</li> <li class="list-group-item rb-main-sidebar">Writing</li>
</a> </a>

4
_includes/scripts.html

@ -1,5 +1,5 @@
<!--<script src="{{'/assets/javascript/modernizr.min.js' | prepend: site.baseurl}}"></script>--> <script src="{{'/assets/javascript/modernizr.min.js' | prepend: site.baseurl}}"></script>
<script src="{{'/assets/javascript/jquery-3.4.1.slim.min.js' | prepend: site.baseurl}}"></script> <script src="{{'/assets/javascript/jquery-3.5.1.slim.min.js' | prepend: site.baseurl}}"></script>
<script src="{{'/assets/javascript/popper.min.js' | prepend: site.baseurl}}"></script> <script src="{{'/assets/javascript/popper.min.js' | prepend: site.baseurl}}"></script>
<script src="{{'/assets/javascript/bootstrap.min.js' | prepend: site.baseurl}}"></script> <script src="{{'/assets/javascript/bootstrap.min.js' | prepend: site.baseurl}}"></script>
<script type="text/javascript" src="{{'/assets/javascript/index.js' | prepend: site.baseurl}}"></script> <script type="text/javascript" src="{{'/assets/javascript/index.js' | prepend: site.baseurl}}"></script>

2
_includes/scrollspy.html

@ -1,4 +1,4 @@
<div class="dropdown-divider mt-5 wi"></div> <div class="dropdown-divider mt-5"></div>
<div class="row"> <div class="row">
<div class="col-12 p-0"> <div class="col-12 p-0">
<p class="mt-5 mb-5"> <p class="mt-5 mb-5">

2
_includes/writing/personality.html

@ -1,4 +1,4 @@
<div id="personality" class="page-header mb-0 mt-5 pl-4 pt-2 pb-0"> <div id="personality" class="page-header mb-0 pl-4 pt-2 pb-0">
<h2>Personality</h2> <h2>Personality</h2>
</div> </div>
<div class="row"> <div class="row">

31
_layouts/components.html

@ -1,31 +0,0 @@
<!DOCTYPE html>
<html lang="en" dir="ltr" data-theme="light">
{% include head.html %}
<body>
{% include navbar.html %}
<div class="row">
<div class="col-md-3 col-sm-5 hidden-sm p-0">
<div class="row" style="height: 100%">
<div class="col-md-6 col-sm-6 col-xs-6 p-0">
{% include navbar_side.html sidebarClassName="rb-sidebar__1" %}
</div>
<div class="col-md-6 col-sm-6 col-xs-6 p-0">
{% include sidebar.html sidebarClassName="rb-sidebar__2" %}
</div>
</div>
</div>
<div class="col-lg-9 py-5 pl-sm-5">
{% include components/alerts.html %}
{% include components/badges.html %}
{% include components/buttons.html %}
{% include components/cards.html %}
{% include components/footer.html %}
{% include components/forms.html %}
{% include components/navbar.html %}
{% include components/paginate.html %}
{% include components/tables.html %}
</div>
</div>
{% include scripts.html %}
</body>
</html>

BIN
assets/.DS_Store

Binary file not shown.

BIN
assets/fonts/i2p-iconfont.zip

Binary file not shown.

77
assets/fonts/i2p.css

@ -1,77 +0,0 @@
@font-face {
font-family: 'i2p';
src: url('i2p.eot');
src: url('i2p.eot') format('embedded-opentype'),
url('i2p.woff2') format('woff2'),
url('i2p.woff') format('woff'),
url('i2p.ttf') format('truetype'),
url('i2p.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'i2p';
src: url('../font/i2p.svg?48147931#i2p') format('svg');
}
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "i2p";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-i2p-help:before { content: '\e800'; } /* '' */
.icon-i2p-mail:before { content: '\e801'; } /* '' */
.icon-i2p-plugin:before { content: '\e802'; } /* '' */
.icon-i2p-router:before { content: '\e803'; } /* '' */
.icon-i2p-dashboard:before { content: '\e804'; } /* '' */
.icon-i2p-bandwidth:before { content: '\e805'; } /* '' */
.icon-i2p-server:before { content: '\e806'; } /* '' */
.icon-i2p-paste:before { content: '\e807'; } /* '' */
.icon-i2p-bug:before { content: '\e808'; } /* '' */
.icon-i2p-docs:before { content: '\e809'; } /* '' */
.icon-i2p-address:before { content: '\e80a'; } /* '' */
.icon-i2p-wiki:before { content: '\e80b'; } /* '' */
.icon-i2p-sync:before { content: '\e80c'; } /* '' */
.icon-i2p-power:before { content: '\e80d'; } /* '' */
.icon-i2p-directory:before { content: '\e80e'; } /* '' */
.icon-i2p-fingerprint:before { content: '\e80f'; } /* '' */
.icon-i2p-alert:before { content: '\e810'; } /* '' */
.icon-i2p-valid:before { content: '\e811'; } /* '' */
.icon-i2p-fast:before { content: '\e812'; } /* '' */
.icon-i2p-anon:before { content: '\e813'; } /* '' */

BIN
assets/fonts/i2p.eot

Binary file not shown.

50
assets/fonts/i2p.svg

@ -1,50 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Copyright (C) 2018 by original authors @ fontello.com</metadata>
<defs>
<font id="i2p" horiz-adv-x="1000" >
<font-face font-family="i2p" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
<missing-glyph horiz-adv-x="1000" />
<glyph glyph-name="i2p-help" unicode="&#xe800;" d="M825 208c39 90 39 194 0 284l-115-52c25-57 25-122 1-180l114-52m-182 467c-91 39-195 39-285 0l52-114c58 24 123 24 181-1l52 115m-468-182c-39-91-39-195 0-285l115 52c-25 57-25 123 0 181l-115 52m183-468c90-39 194-39 285 1l-52 114c-58-25-123-25-181-1l-52-114m142 742c230 0 417-187 417-417s-187-417-417-417-417 187-417 417 187 417 417 417m0-250c-92 0-167-75-167-167s75-167 167-167 167 75 167 167-75 167-167 167z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-mail" unicode="&#xe801;" d="M833 517l-333-209-333 209v83l333-208 333 208m0 83h-666c-47 0-84-37-84-83v-500c0-46 38-83 84-83h666c46 0 84 37 84 83v500c0 46-38 83-84 83z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-plugin" unicode="&#xe802;" d="M833 371h-62v167c0 46-38 83-83 83h-167v62c0 58-47 105-104 105s-104-47-104-105v-62h-167c-46 0-83-37-83-83v-159h62c63 0 113-50 113-112s-50-113-113-113h-62v-158c0-46 37-84 83-84h158v63c0 63 50 113 113 113s112-50 112-113v-63h159c46 0 83 38 83 84v167h62c58 0 105 46 105 104s-47 104-105 104z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-router" unicode="&#xe803;" d="M714 767c46 0 84-38 84-84v-416c0-46-38-84-84-84h-166v-83h41c23 0 42-19 42-42h292v-83h-292c0-23-19-42-42-42h-166c-23 0-42 19-42 42h-292v83h292c0 23 19 42 42 42h41v83h-166c-46 0-84 38-84 84v416c0 46 38 84 84 84h416m-416-167l166-167-166-166h119l136 136c16 17 16 43 0 60l-137 137h-118m416-250h-125v-83h125v83z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-dashboard" unicode="&#xe804;" d="M542 725v-250h333v250m-333-750h333v417h-333m-417-417h333v250h-333m0 83h333v417h-333v-417z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-bandwidth" unicode="&#xe805;" d="M500 170c-69 0-125 56-125 125 0 47 25 87 63 109l404 234-230-399c-21-41-63-69-112-69m0 542c75 0 146-21 207-55l-87-51c-37 14-78 22-120 22-184 0-333-149-333-333 0-92 37-176 97-236h1c16-16 16-42 0-58-17-17-43-17-60-1l0 0c-75 76-122 180-122 295 0 230 187 417 417 417m417-417c0-115-47-219-122-295l0 0c-17-16-43-16-59 1-16 16-16 42 0 58l0 0c60 61 97 144 97 236 0 42-8 83-22 121l50 87c35-62 56-132 56-208z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-server" unicode="&#xe806;" d="M167 808h666c23 0 42-18 42-41v-167c0-23-19-42-42-42h-666c-23 0-42 19-42 42v167c0 23 19 41 42 41m0-333h666c23 0 42-19 42-42v-166c0-23-19-42-42-42h-666c-23 0-42 19-42 42v166c0 23 19 42 42 42m0-333h666c23 0 42-19 42-42v-167c0-23-19-41-42-41h-666c-23 0-42 18-42 41v167c0 23 19 42 42 42m208 500h42v83h-42v-83m0-334h42v84h-42v-84m0-333h42v83h-42v-83m-167 750v-83h84v83h-84m0-333v-84h84v84h-84m0-334v-83h84v83h-84z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-paste" unicode="&#xe807;" d="M798-25h-584v667h84v-125h416v125h84m-292 83c23 0 42-19 42-42s-19-41-42-41c-23 0-42 18-42 41s19 42 42 42m292 0h-174c-18 48-64 83-118 83s-100-35-117-83h-175c-46 0-83-37-83-83v-667c0-46 37-83 83-83h584c46 0 83 37 83 83v667c0 46-37 83-83 83z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-bug" unicode="&#xe808;" d="M583 350h-166v83h166m0-250h-166v84h166m250 250h-117c-18 32-44 60-76 81l68 68-58 59-91-90c-19 4-38 7-59 7s-40-3-59-7l-91 90-58-59 67-68c-31-21-56-49-75-81h-117v-84h87c-2-13-4-27-4-41v-42h-83v-83h83v-42c0-14 2-28 4-42h-87v-83h117c43-75 124-125 216-125s173 50 216 125h117v83h-87c2 14 4 28 4 42v42h83v83h-83v42c0 14-2 28-4 41h87v84z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-docs" unicode="&#xe809;" d="M619 549h218l-218 217v-217m-277 277h316l238-238v-475c0-44-36-79-79-79h-475c-44 0-79 36-79 79v634c0 43 35 79 79 79m356-634v80h-356v-80h356m119 159v79h-475v-79h475z m-634 355v-753h634v-79h-634c-43 0-79 36-79 79v753h79z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-address" unicode="&#xe80a;" d="M125 558v84h83v41c0 47 38 84 84 84h250v-292l104 63 104-63v292h42c43 0 83-40 83-84v-666c0-44-40-84-83-84h-500c-44 0-84 40-84 84v41h-83v84h83v166h-83v84h83v166h-83m167-166h-84v-84h84v84m0 166v84h-84v-84h84m0-500v84h-84v-84h84z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-wiki" unicode="&#xe80b;" d="M895 294c4-64-26-126-79-164l32-62c10-19 11-41 3-61-8-20-24-35-44-42l-33-10c-7-3-15-4-23-4-21 0-41 10-55 27l-88 104c-37 6-72 22-102 46-21-6-42-10-62-10-37 0-74 12-105 33-22-6-44-9-67-9-33 0-65 6-96 19-59 27-99 85-101 150-3 30 2 61 14 88-12 31-13 66-2 97 15 40 44 73 80 94 25 70 92 117 167 112 67 63 169 69 243 16 17 4 36 7 54 7 57 1 111-24 146-69 85-22 146-98 149-186 2-46-10-92-36-130 3-15 5-30 5-46m-208 59c23-3 42-21 42-45 0-23-19-41-42-41h-26c-13-38-37-71-67-96 10-3 21-6 32-8 213 2 188 133 188 135-2 60-52 106-112 104-23 0-41 18-41 41s18 42 41 42c52-1 101-20 139-54 2 12 3 24 3 37-2 52-25 97-119 105-52 124-183 55-183 17l0 0c-2-10 8-30 10-31 23 0 42-19 42-42 0-23-19-42-42-42l0 0c-22 1-43 10-60 24-20-13-43-21-66-24l0 0c-24-2-44 15-45 38-3 23 14 44 37 46 6 1 39 6 39 32l0 0c0 27 10 54 28 74-38 11-79-3-121-53-77 12-108 1-131-80-39-19-60-33-69-75 45 9 91 6 134-10 21-8 32-32 24-54-8-22-32-33-53-25-31 14-65 15-96 3-14-11-14-35-14-53 0-31 16-60 42-76 22-12 47-17 71-17-6 11-11 22-16 34-8 22 4 47 27 55 22 8 47-4 55-27 16-47 59-80 109-85 57 3 108 36 133 88 9 58 56 63 107 63m83-311l-26 54-30-7 42-52 14 5m-194 358c1 23-16 41-38 43-29 2-58-8-80-28-24-24-36-57-35-91 0-23 19-41 41-41 24 0 42 18 42 41 0 11 3 23 10 32 5 4 11 6 18 6 23-1 42 16 42 38z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-sync" unicode="&#xe80c;" d="M500 100c-138 0-250 112-250 250 0 42 10 82 29 117l-61 61c-32-52-51-113-51-178 0-184 149-333 333-333v-125l167 166-167 167m0 458v125l-167-166 167-167v125c138 0 250-112 250-250 0-42-10-82-29-117l61-60c32 51 51 112 51 177 0 184-149 333-333 333z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-power" unicode="&#xe80d;" d="M690 582l-60-61c72-43 120-122 120-213 0-138-112-250-250-250s-250 112-250 250c0 91 48 170 120 214l-60 60c-87-60-143-160-143-274 0-184 149-333 333-333s333 149 333 333c0 114-56 214-143 274m-148 101h-84v-416h84" horiz-adv-x="1000" />
<glyph glyph-name="i2p-directory" unicode="&#xe80e;" d="M792 17h-625c-47 0-84 37-84 83v500c0 46 37 83 84 83h250l83-83h292c46 0 83-37 83-83l0 0h-708v-417l89 333h711l-95-354c-9-36-42-62-80-62z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-fingerprint" unicode="&#xe80f;" d="M748 664c-3 0-6 1-9 2-80 42-150 59-233 59-82 0-160-20-232-59-10-5-22-1-28 9-5 10-2 23 8 28 78 43 163 64 252 64s167-20 252-63c10-6 14-19 9-29-4-7-11-11-19-11m-596-219c-4 0-8 1-12 4-9 6-12 19-5 29 41 58 94 104 156 136 132 68 298 68 430 1 62-32 115-77 156-136 7-9 4-22-5-29-10-7-23-5-29 4-38 54-85 95-141 124-120 61-273 61-392-1-57-29-104-71-142-123-3-6-9-9-16-9m260-503c-5 0-10 2-14 6-36 37-56 60-84 110-29 52-44 114-44 181 0 124 106 225 236 225s236-101 236-225c0-11-9-21-21-21-11 0-21 10-21 21 0 101-87 183-194 183s-194-82-194-183c0-60 13-115 39-160 26-48 45-69 77-101 8-8 8-21 0-30-5-4-10-6-16-6m299 77c-49 0-93 13-129 37-62 42-99 111-99 183 0 12 9 21 21 21s20-9 20-21c0-59 30-114 81-148 30-20 64-30 106-30 10 0 27 2 43 4 12 3 23-5 25-17 2-10-6-22-17-24-24-4-45-5-51-5m-84-86c-1 0-3 0-5 0-66 19-110 44-155 89-58 57-90 135-90 217 0 68 57 123 128 123s128-55 128-123c0-44 40-81 87-81 48 0 87 37 87 81 0 157-136 285-303 285-118 0-227-66-275-168-16-34-25-73-25-117 0-32 3-84 28-150 5-11-1-23-12-27-11-4-23 2-26 12-21 55-31 109-31 165 0 50 10 96 29 135 55 116 178 192 312 192 190 0 344-146 344-326 0-68-57-123-128-123-71 0-128 55-128 123 0 44-39 80-87 80-48 0-87-36-87-80 0-72 28-138 78-188 40-39 78-61 136-77 12-3 18-15 15-26-2-9-11-16-20-16z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-alert" unicode="&#xe810;" d="M542 267h-84v166h84m0-333h-84v83h84m-500-208h916l-458 792-458-792z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-valid" unicode="&#xe811;" d="M500 767c230 0 417-187 417-417s-187-417-417-417-417 187-417 417 187 417 417 417m-42-604l292 291-59 59-233-233-128 129-59-59 187-187z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-fast" unicode="&#xe812;" d="M292 767v-459h125v-375l291 500h-166l166 334h-416z" horiz-adv-x="1000" />
<glyph glyph-name="i2p-anon" unicode="&#xe813;" d="M506 695c-96 0-163 28-163 28l-50-212c0-1 0-1 0-1h426c1 0 1 1 1 1l-51 212c0 0-67-28-163-28l0 0z m-244-234c-37-10-133-107-133-107h754c0 0-97 97-134 107 0 0-478 2-487 0z m31-161c0-55 44-88 99-88 54 0 99 77 99 77 0 1 9 5 15 5 5 0 15-4 15-5 0 0 44-77 99-77 55 0 99 33 99 88 0 7-1 14-2 20h-422c-1-6-2-13-2-20z m156-317l-258 0c-7 0-10 10-3 14l84 49c0 0 0 0 0 0-49 43-211 83-211 83s103 99 234 112c0 0 11-160 154-258 0 0 0 0 0 0z m114 0l258 0c7 0 10 10 4 14l-84 49c0 0 0 0 0 0 48 43 209 83 210 83 0 0 0 0 0 0 0 0-103 99-234 112 0 0-11-159-154-258 0 0 0 0 0 0z" horiz-adv-x="1000" />
</font>
</defs>
</svg>

Before

Width:  |  Height:  |  Size: 8.7 KiB

BIN
assets/fonts/i2p.ttf

Binary file not shown.

BIN
assets/fonts/i2p.woff

Binary file not shown.

BIN
assets/images/.DS_Store

Binary file not shown.

2
assets/javascript/jquery-3.4.1.slim.min.js

File diff suppressed because one or more lines are too long

2
assets/javascript/jquery-3.5.1.slim.min.js

File diff suppressed because one or more lines are too long

372
assets/styles/components.scss

@ -3,19 +3,6 @@
.alert { .alert {
border-radius: 15px; border-radius: 15px;
&-custom {
color: #3b4f87;
background-color: #e2e6f0;
border-color: #6679ac;
& hr {
border-top-color: #6679ac;
}
& .alert-link {
color: #081b4f;
}
}
&-primary { &-primary {
color: #3b4f87; color: #3b4f87;
background-color: #e2e6f0; background-color: #e2e6f0;
@ -28,7 +15,8 @@
& .alert-link { & .alert-link {
color: #003600; color: #003600;
} }
} }
&-secondary { &-secondary {
color: $gray-700; color: $gray-700;
background-color: $gray-200; background-color: $gray-200;
@ -41,7 +29,8 @@
& .alert-link { & .alert-link {
color: $gray-800; color: $gray-800;
} }
} }
&-success { &-success {
color: #105c10; color: #105c10;
background-color: #e1f2e1; background-color: #e1f2e1;
@ -54,7 +43,8 @@
& .alert-link { & .alert-link {
color: #003b00; color: #003b00;
} }
} }
&-warning { &-warning {
color: #6b4c00; color: #6b4c00;
background-color: #ffeab5; background-color: #ffeab5;
@ -67,7 +57,8 @@
& .alert-link { & .alert-link {
color: #a66b00; color: #a66b00;
} }
} }
&-danger { &-danger {
color: #700b00; color: #700b00;
background-color: #ffcac4; background-color: #ffcac4;
@ -101,232 +92,6 @@
background-color: $white; background-color: $white;
} }
.background-warning {
background-color: $warning;
}
.background-danger {
background-color: $danger;
}
// Other color backgrounds
.background-gray-100 {
background-color: $gray-100;
}
.background-gray-200 {
background-color: $gray-200;
}
.background-gray-300 {
background-color: $gray-300;
}
.background-gray-400 {
background-color: $gray-400;
}
.background-gray-500 {
background-color: $gray-500;
}
.background-gray-600 {
background-color: $gray-600;
}
.background-gray-700 {
background-color: $gray-700;
}
.background-gray-800 {
background-color: $gray-800;
}
.background-gray-900 {
background-color: $gray-900;
}
.background-indigo-100 {
background-color: $indigo-100;
}
.background-indigo-200 {
background-color: $indigo-200;
}
.background-indigo-300 {
background-color: $indigo-300;
}
.background-indigo-400 {
background-color: $indigo-400;
}
.background-indigo-500 {
background-color: $indigo-500;
}
.background-indigo-600 {
background-color: $indigo-600;
}
.background-indigo-700 {
background-color: $indigo-700;
}
.background-indigo-800 {
background-color: $indigo-800;
}
.background-indigo-900 {
background-color: $indigo-900;
}
.background-teal-100 {
background-color: $teal-100;
}
.background-teal-200 {
background-color: $teal-200;
}
.background-teal-300 {
background-color: $teal-300;
}
.background-teal-400 {
background-color: $teal-400;
}
.background-teal-500 {
background-color: $teal-500;
}
.background-teal-600 {
background-color: $teal-600;
}
.background-teal-700 {
background-color: $teal-700;
}
.background-teal-800 {
background-color: $teal-800;
}
.background-teal-900 {
background-color: $teal-900;
}
.background-orange-100 {
background-color: $orange-100;
}
.background-orange-200 {
background-color: $orange-200;
}
.background-orange-300 {
background-color: $orange-300;
}
.background-orange-400 {
background-color: $orange-400;
}
.background-orange-500 {
background-color: $orange-500;
}
.background-orange-600 {
background-color: $orange-600;
}
.background-orange-700 {
background-color: $orange-700;
}
.background-orange-800 {
background-color: $orange-800;
}
.background-orange-900 {
background-color: $orange-900;
}
.background-red-100 {
background-color: $red-100;
}
.background-red-200 {
background-color: $red-200;
}
.background-red-300 {
background-color: $red-300;
}
.background-red-400 {
background-color: $red-400;
}
.background-red-500 {
background-color: $red-500;
}
.background-red-600 {
background-color: $red-600;
}
.background-red-700 {
background-color: $red-700;
}
.background-red-800 {
background-color: $red-800;
}
.background-red-900 {
background-color: $red-900;
}
.background-night-100 {
background-color: $night-100;
}
.background-night-200 {
background-color: $night-200;
}
.background-night-300 {
background-color: $night-300;
}
.background-night-400 {
background-color: $night-400;
}
.background-night-500 {
background-color: $night-500;
}
.background-night-600 {
background-color: $night-600;
}
.background-night-700 {
background-color: $night-700;
}
.background-night-800 {
background-color: $night-800;
}
.background-night-900 {
background-color: $night-900;
}
// Text colors // Text colors
.color-primary { .color-primary {
@ -337,10 +102,6 @@
color: $secondary; color: $secondary;
} }
.color-gray-9 {
color: $gray-900;
}
.rb-code { .rb-code {
font-family: 'Source Code Pro', monospace !important; font-family: 'Source Code Pro', monospace !important;
} }
@ -476,30 +237,6 @@
} }
} }
.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 { .btn-pill {
border-radius: 30px; border-radius: 30px;
} }
@ -512,75 +249,6 @@
background-color: $secondary !important; background-color: $secondary !important;
} }
// Footer
.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: $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: $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 $white;
}
.nav-link {
color: $white;
}
.show {
.nav-item:hover {
box-shadow: 0 0;
}
}
}
.rb-link { .rb-link {
color: var(--link) !important; color: var(--link) !important;
&:hover { &:hover {
@ -588,23 +256,6 @@
} }
} }
.rb-paginate-active {
background-color: $primary !important;
color: $white !important;
&:hover {
background-color: $secondary !important;
}
}
.pagination .page-link {
color: $gray-900;
}
.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
background-color: $gray-300 !important;
}
.mark, mark { .mark, mark {
background-color: $gray-300 !important; background-color: $gray-300 !important;
padding: .2em !important; padding: .2em !important;
@ -630,6 +281,13 @@ img {
} }
} }
// Dropdowns
.dropdown-toggle {
background-color: var(--box) !important;
color: var(--text) !important;
}
.dropdown-menu { .dropdown-menu {
background-color: var(--box) !important; background-color: var(--box) !important;
} }

4
assets/styles/main.scss

@ -73,7 +73,7 @@ html[data-theme="light"] {
--link-hover: #{$teal-600}; --link-hover: #{$teal-600};
--logo-text-color: #{$indigo-900}; --logo-text-color: #{$indigo-900};
--header-text: #{$gray-900}; --header-text: #{$gray-900};
--sidebar-bg: #{$gray-100}; --sidebar-bg: #{$gray-200};
--sidebar-inner-bg: #{$gray-100}; --sidebar-inner-bg: #{$gray-100};
--sidebar-text: #{$gray-800}; --sidebar-text: #{$gray-800};
--navbar-bg: #{$indigo-600}; --navbar-bg: #{$indigo-600};
@ -110,7 +110,7 @@ html[data-theme="dark"] {
--link-hover: #{$gray-200}; --link-hover: #{$gray-200};
--logo-text-color: #{$white}; --logo-text-color: #{$white};
--header-text: #{$gray-900}; --header-text: #{$gray-900};
--sidebar-bg: #{$night-800}; --sidebar-bg: #{$night-900};
--sidebar-inner-bg: #{$night-800}; --sidebar-inner-bg: #{$night-800};
--sidebar-text: #{$gray-100}; --sidebar-text: #{$gray-100};
--navbar-bg: #{$indigo-900}; --navbar-bg: #{$indigo-900};

59
assets/styles/vars.scss

@ -4,7 +4,7 @@ $warning: #FFC434;
$danger: #E15647; $danger: #E15647;
$body-font: 'Inter', sans-serif !important; $body-font: 'Inter', sans-serif !important;
$header-font: 'Nunito', sans-serif !important; $header-font: 'Nunito', sans-serif !important;
$border-radius: 5px; $border-radius: 4px;
// General // General
@ -151,6 +151,63 @@ $red-700: map-get($red-list, "700");
$red-800: map-get($red-list, "800"); $red-800: map-get($red-list, "800");
$red-900: map-get($red-list, "900"); $red-900: map-get($red-list, "900");
// Dynamic background and color classes creation
@each $value in $gray-list {
.background-gray-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-gray-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
@each $value in $night-list {
.background-night-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-night-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
@each $value in $indigo-list {
.background-indigo-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-indigo-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
@each $value in $teal-list {
.background-teal-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-teal-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
@each $value in $orange-list {
.background-orange-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-orange-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
@each $value in $red-list {
.background-red-#{nth($value, 1)} {
background-color: nth($value, 2) !important;
}
.color-red-#{nth($value, 1)} {
color:nth($value, 2) !important;
}
}
// Mixins // Mixins
// //
// .header-display :before size and position // .header-display :before size and position

19
components.md

@ -1,19 +0,0 @@
---
layout: components
title: Components
permalink: /components/
sidebar:
- alerts: Alerts
- badges: Badges
- buttons: Buttons
- cards: Cards
- footer: Footer
- forms: Forms
- header: Header
// - jumbotron: Jumbotron
- pagination: Pagination
- tables: Tables
---
This is the components page
Loading…
Cancel
Save