embarklabs/embark-framework.github.io
1
0
Fork 0
mirror of https://github.com/embarklabs/embark-framework.github.io.git synced 2026-08-30 16:31:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added navigation menu to site, along with new footer structure.

Browse Source
This commit is contained in:
Kevin Love
2020-01-16 16:50:07 -08:00
parent 8979d6fda4
commit a08bac2b9e
6 changed files with 390 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/v2.css
+209 -59
View File
@@ -1,6 +1,142 @@
body{
font-family: 'Roboto', sans-serif !important;
}
header{
position:relative;
}
.offcanvas-collapse {
position: fixed;
height: 100%;
z-index: 999;
top: 0; /* Height of navbar */
bottom: 0;
right: 100%;
left:-300px;
width: 300px;
padding-right: 1rem;
padding-left: 1rem;
overflow-y: auto;
visibility: hidden;
background-color: #01264D;
transition-timing-function: ease-in-out;
transition-duration: .3s;
transition-property: left, visibility;
}
.offcanvas-collapse {
align-items:start;
-moz-background-clip: padding; /* Firefox 3.6 */
-webkit-background-clip: padding; /* Safari 4? Chrome 6? */
background-clip: padding-box; /* Firefox 4, Safari 5, Opera 10, IE 9 */
border-right:5px solid rgba(0, 0, 0, 0.2);
}
/* Makes the nav visibile with the open class */
.offcanvas-collapse.open {
left: 0;
visibility: visible;
}
.navbar-expand-lg .navbar-nav {
-ms-flex-direction: column;
flex-direction: column;
}
.nav-scroller {
position: relative;
z-index: 2;
height: 2.75rem;
overflow-y: hidden;
}
.nav-scroller .nav {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
padding-bottom: 1rem;
margin-top: -1px;
overflow-x: auto;
color: rgba(255, 255, 255, .75);
text-align: center;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.u-link-ghost {
color: #fff !important;
}
.c-navigation__trigger {
background: transparent;
border: 0;
}
.c-icon {
display: inline-block;
fill: currentColor;
height: 24px;
stroke-width: 0;
stroke: currentColor;
vertical-align: baseline;
width: 24px;
}
.mobileMenu li{
padding:1.5rem 0;
}
.mobileMenu li a{
font-size: 18px;
color: #FFFFFF;
transition: color .2s ease;
}
.mobileMenu li a:hover{
font-size: 18px;
color: #FAB266;
transition: color .2s ease;
text-decoration:none;
}
.mobileMenu li a img{
max-width: 45px;
opacity:1;
transition: opacity .2s ease;
}
.mobileMenu li a img:hover{
opacity:.6;
transition: opacity .2s ease;
}
.mainNav{
list-style-type: none;
}
.mainNav li{
display:inline-block;
padding:0 2rem;
}
.mainNav li.social {
padding: 0 1rem;
}
.mainNav li:nth-child(5){
padding: 0 1rem 0 2rem !important;
}
.mainNav li a{
font-size: 18px;
color: #FFFFFF;
transition: color .2s ease;
}
.mainNav li a:hover{
font-size: 18px;
color: #FAB266;
transition: color .2s ease;
text-decoration:none;
}
.mainNav li a img:hover{
opacity:.6;
transition: opacity .2s ease;
}
.mainNav li a img{
max-width:45px;
opacity:1;
transition: opacity .2s ease;
}
.top-logo{
display: block;
height: 100px;
@@ -90,6 +226,53 @@ header{
animation: float 6s ease-in-out infinite;
max-width: 400px;
}
.footer-link-cols {
padding: 4rem 0 3rem 0;
}
.footer-link-cols a{
color: #FFFFFF;
font-family: 'Roboto', sans-serif;
font-size: 18px;
font-weight: bold;
line-height: 21px;
transition: .2s ease;
opacity: 1;
}
.footer-link-cols a:hover{
transition: .2s ease;
opacity: .6;
text-decoration: none;
}
.footer-link-cols ul li{
margin-bottom:1.2rem;
}
.footer-link-cols ul{
margin-top:2rem !important;
}
.footer-link-cols .footer-widget .social-footer{
list-style-type: none;
margin:0;
padding:0;
}
.footer-link-cols .footer-widget .social-footer li a img{
max-width:35px;
margin-right:1rem;
}
.footer-link-cols .footer-widget .widget-header{
font-size: 18px;
color: #5D7D97;
font-family: 'Roboto', sans-serif;
}
.footer-link-cols .footer-widget .links-footer{
list-style-type: none;
margin:0;
padding:0;
}
.two-cols{
columns: 2;
-webkit-columns: 2;
-moz-columns: 2;
}
@-webkit-keyframes float {
0% {
-webkit-transform: translatey(0px);
@@ -413,36 +596,6 @@ footer {
position: relative;
z-index: 999;
}
.footer-links {
padding-bottom: 2rem;
padding-top: 2rem;
}
.footer-links ul {
list-style-type: none;
padding: 0;
margin: 0;
text-align: center;
}
.footer-links ul li {
display: inline;
padding: 0 36px;
vertical-align: middle;
padding-top: 1rem;
}
.footer-links ul li a {
color: #FFFFFF;
font-family: 'Roboto', sans-serif;
font-size: 18px;
font-weight: bold;
line-height: 21px;
transition:.2s ease;
opacity:1;
}
.footer-links ul li a:hover {
transition:.2s ease;
text-decoration:none;
opacity:.7;
}
.footer-astro {
position: absolute;
bottom: 0;
@@ -460,20 +613,11 @@ footer {
.disable-mobile{
display: block;
}
.footer-links ul li a.top-logo {
height: 100px;
width: 129px;
margin:0 auto;
}
@media only screen and (max-width: 1200px) {
.explore-content {
padding-right: 1rem;
padding-left: 2rem;
}
.footer-links ul li {
padding: 0 18px;
padding-top: 1rem;
}
}
@media only screen and (max-width: 1170px) {
.rocket-ship img{
@@ -481,10 +625,6 @@ footer {
}
}
@media only screen and (max-width: 1024px) {
.footer-links ul li {
padding: 0 18px;
padding-top: 1rem;
}
.footer-astro {
left: 1%;
}
@@ -497,12 +637,6 @@ footer {
}
}
@media only screen and (max-width: 991px) {
.footer-links .container{
max-width:100%;
}
.footer-links ul li a {
font-size: 16px;
}
.explore-more {
position: relative;
}
@@ -534,10 +668,13 @@ footer {
}
}
@media only screen and (max-width: 768px) {
.footer-links ul li {
padding: 0 18px;
padding-top: 1rem;
display: block;
.footer-widget{
text-align:center;
}
.two-cols {
columns: 1;
-webkit-columns: 1;
-moz-columns: 1;
}
.c-header__background {
background-position: bottom;
@@ -641,9 +778,6 @@ footer {
.footer-astro {
display: none;
}
.footer-links ul li {
display: block;
}
.signupLabel {
width: 100%;
margin:0;
@@ -719,9 +853,6 @@ footer {
.footer-astro {
display: none;
}
.footer-links ul li {
display: block;
}
.subForm .form-group{
width:100%;
}
@@ -739,4 +870,23 @@ footer {
#questions{
height: 400px;
}
}
.onlyMobile{
display:none;
}
.onlyDesktop{
display:block;
}
@media (max-width:1200px){
.mainNav li {
padding: 0 1.5rem;
}
}
@media (max-width:991px){
.onlyMobile{
display:block;
}
.onlyDesktop{
display:none;
}
}
images/github-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

images/icons.svg
+99
View File
@@ -0,0 +1,99 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="0" height="0" style="position:absolute">
<symbol id="icon-app-window-search-text" viewBox="0 0 60 60">
<path d="M52.847 46.75a13.785 13.785 0 1 0-4.227 4.225.625.625 0 0 1 .777.088l6.335 6.335a2.5 2.5 0 0 0 3.535-3.535l-6.335-6.338a.625.625 0 0 1-.085-.775zm-3.405-4.392a8.668 8.668 0 1 1-16.22-6.115 8.668 8.668 0 0 1 16.22 6.112v.003zM27.5 22.5a1.875 1.875 0 0 0-1.875-1.875h-12.5a1.875 1.875 0 1 0 0 3.75h12.5A1.875 1.875 0 0 0 27.5 22.5zM13.125 29.377a1.875 1.875 0 0 0 0 3.75h6.25a1.875 1.875 0 1 0 0-3.75h-6.25z"/><path d="M25 50.627a2.5 2.5 0 0 0-2.5-2.5h-15a2.5 2.5 0 0 1-2.5-2.5V15a.625.625 0 0 1 .625-.625h48.75A.624.624 0 0 1 55 15v6.875a2.5 2.5 0 0 0 5 0v-12.5a7.5 7.5 0 0 0-7.5-7.5h-45a7.5 7.5 0 0 0-7.5 7.5v36.25a7.5 7.5 0 0 0 7.5 7.5h15a2.5 2.5 0 0 0 2.5-2.5v.002zm-.865-43.75a2.415 2.415 0 0 1 4.23 0c.24.374.374.806.385 1.25a2.43 2.43 0 0 1-.385 1.25 2.415 2.415 0 0 1-4.23 0 2.43 2.43 0 0 1-.385-1.25c.011-.444.145-.876.385-1.25zm-8.75 0a2.415 2.415 0 0 1 4.23 0c.24.374.374.806.385 1.25a2.43 2.43 0 0 1-.385 1.25 2.415 2.415 0 0 1-4.23 0A2.43 2.43 0 0 1 15 8.127c.011-.444.145-.876.385-1.25zm-8.905.228a2.5 2.5 0 0 1 2.27-1.478 2.458 2.458 0 0 1 2.115 1.25c.24.374.374.806.385 1.25a2.43 2.43 0 0 1-.385 1.25 2.415 2.415 0 0 1-4.23 0 2.43 2.43 0 0 1-.385-1.25c.003-.353.081-.702.23-1.022z"/>
</symbol>
<symbol id="icon-arrow-down-1" viewBox="0 0 24 24">
<title>arrow-down-1</title><path d="M12 19.5a2.3 2.3 0 0 1-1.729-.78L.46 7.568a1.847 1.847 0 0 1 2.773-2.439l8.579 9.752a.25.25 0 0 0 .376 0l8.579-9.752a1.847 1.847 0 1 1 2.773 2.439l-9.808 11.148A2.31 2.31 0 0 1 12 19.5z"/>
</symbol>
<symbol id="icon-arrow-left-1" viewBox="0 0 24 24">
<title>arrow-left-1</title><path d="M4.5 12a2.3 2.3 0 0 1 .78-1.729L16.432.46a1.847 1.847 0 0 1 2.439 2.773l-9.752 8.579a.25.25 0 0 0 0 .376l9.752 8.579a1.847 1.847 0 1 1-2.439 2.773L5.284 13.732A2.31 2.31 0 0 1 4.5 12z"/>
</symbol>
<symbol id="icon-arrow-right-1" viewBox="0 0 24 24">
<title>arrow-right-1</title><path d="M19.5 12a2.3 2.3 0 0 1-.78 1.729L7.568 23.54a1.847 1.847 0 0 1-2.439-2.773l9.752-8.579a.25.25 0 0 0 0-.376L5.129 3.233A1.847 1.847 0 0 1 7.568.46l11.148 9.808A2.31 2.31 0 0 1 19.5 12z"/>
</symbol>
<symbol id="icon-arrow-up-1" viewBox="0 0 24 24">
<title>arrow-up-1</title><path d="M12 4.5a2.3 2.3 0 0 1 1.729.78l9.811 11.15a1.847 1.847 0 1 1-2.773 2.439l-8.579-9.75a.25.25 0 0 0-.376 0l-8.579 9.752A1.847 1.847 0 1 1 .46 16.432l9.808-11.148A2.31 2.31 0 0 1 12 4.5z"/>
</symbol>
<symbol id="icon-browser-gauge" viewBox="0 0 24 24">
<title>browser-gauge</title><path d="M6.122 16.9H4.163a.735.735 0 0 0 0 1.469h1.959a.735.735 0 1 0 0-1.469zM7.278 14.057l-1.7-.979a.735.735 0 1 0-.735 1.272l1.7.98a.735.735 0 0 0 .735-1.273zM8.718 10.477a.735.735 0 0 0-1.273.735l.98 1.7a.735.735 0 0 0 1.275-.738zM12 12.488a.735.735 0 0 0 .735-.735V9.8a.735.735 0 0 0-1.47 0v1.958a.735.735 0 0 0 .735.73zM19.156 14.349a.735.735 0 0 0-.734-1.273l-1.7.978a.735.735 0 0 0 .368 1.371.726.726 0 0 0 .366-.1zM19.839 16.9H17.88a.735.735 0 0 0 0 1.469h1.959a.735.735 0 0 0 0-1.469zM15.5 11.2l-4.277 4.27a2.726 2.726 0 0 0-.692 1.673v.489a.774.774 0 0 0 .96.788l.528-.105a2.024 2.024 0 0 0 1.324-1.1l2.357-5.886a.123.123 0 0 0-.2-.132z"/><path d="M2.939 24h18.122A2.942 2.942 0 0 0 24 21.061V2.939A2.942 2.942 0 0 0 21.061 0H2.939A2.942 2.942 0 0 0 0 2.939v18.122A2.942 2.942 0 0 0 2.939 24zM11.02 2.939a.735.735 0 1 1-.734-.735.734.734 0 0 1 .734.735zm-2.938 0a.735.735 0 1 1-.735-.739.735.735 0 0 1 .735.739zm-2.939 0a.735.735 0 1 1-.735-.739.735.735 0 0 1 .735.739zm15.918 19.1H2.939a.98.98 0 0 1-.98-.98V6.633a1 1 0 0 1 1-1h18.082a1 1 0 0 1 1 1v14.428a.98.98 0 0 1-.98.98z"/>
</symbol>
<symbol id="icon-check" viewBox="0 0 24 24">
<path d="M23.146 5.4l-2.792-2.8a.499.499 0 0 0-.708 0L7.854 14.4a.5.5 0 0 1-.708 0l-2.792-2.8a.5.5 0 0 0-.708 0L.854 14.4a.5.5 0 0 0 0 .707L7.146 21.4a.5.5 0 0 0 .708 0L23.146 6.1a.5.5 0 0 0 0-.7z"/>
</symbol>
<symbol id="icon-close" viewBox="0 0 24 24">
<title>close</title><path d="M14.3 12.179a.25.25 0 0 1 0-.354l9.263-9.262A1.5 1.5 0 0 0 21.439.442L12.177 9.7a.25.25 0 0 1-.354 0L2.561.442A1.5 1.5 0 0 0 .439 2.563L9.7 11.825a.25.25 0 0 1 0 .354L.439 21.442a1.5 1.5 0 0 0 2.122 2.121l9.262-9.263a.25.25 0 0 1 .354 0l9.262 9.263a1.5 1.5 0 0 0 2.122-2.121z"/>
</symbol>
<symbol id="icon-computer-bug-search" viewBox="0 0 54 54">
<path d="M32.202 12.42a1.688 1.688 0 0 0-3.375 0 3.358 3.358 0 0 1-1.152 2.52.567.567 0 0 1-.565.113 6.782 6.782 0 0 0-2.216-.383 6.556 6.556 0 0 0-2.151.371.566.566 0 0 1-.551-.106 3.35 3.35 0 0 1-1.24-2.515 1.687 1.687 0 0 0-3.375 0 6.675 6.675 0 0 0 1.76 4.455.563.563 0 0 1 .04.7 6.689 6.689 0 0 0-1.208 3.229.563.563 0 0 0 .562.616H31.05a.562.562 0 0 0 .56-.617 6.679 6.679 0 0 0-1.21-3.23.56.56 0 0 1 .042-.698 6.678 6.678 0 0 0 1.76-4.455zM14.764 32.108a1.687 1.687 0 1 0 0 3.375h3.657a.566.566 0 0 1 .5.301 6.72 6.72 0 0 0 11.94 0 .565.565 0 0 1 .5-.301h3.653a1.687 1.687 0 1 0 0-3.375h-2.812a.562.562 0 0 1-.563-.563v-2.25a.563.563 0 0 1 .563-.563h2.812a1.687 1.687 0 1 0 0-3.374h-2.812a.562.562 0 0 1-.563-.563v-.563a.56.56 0 0 0-.562-.562H18.702a.562.562 0 0 0-.563.563v.562a.56.56 0 0 1-.562.563h-2.813a1.687 1.687 0 1 0 0 3.375h2.813a.561.561 0 0 1 .562.562v2.25a.56.56 0 0 1-.562.563h-2.813z"/><path d="M0 24.761a24.703 24.703 0 0 0 38.97 20.214 1.125 1.125 0 0 1 1.449.126l7.819 7.9a3.376 3.376 0 0 0 4.774-4.772l-7.848-7.927a1.125 1.125 0 0 1-.121-1.435A24.733 24.733 0 0 0 20.666.35 24.733 24.733 0 0 0 0 24.761zm24.75-20.25A20.25 20.25 0 1 1 4.5 24.761a20.272 20.272 0 0 1 20.25-20.25z"/>
</symbol>
<symbol id="icon-copy-paste" viewBox="0 0 24 24">
<title>copy-paste</title><path d="M13.4 4.727a.251.251 0 0 0 .2.265 1.089 1.089 0 0 1 .824 1.108v1.4a1.244 1.244 0 0 0 1.244 1.244A1.244 1.244 0 0 0 16.913 7.5V3.975a1.494 1.494 0 0 0-1.5-1.494h-1.724a.246.246 0 0 0-.177.074.249.249 0 0 0-.073.177c.002.473.001 1.492-.039 1.995zM8.954 21.262a1.244 1.244 0 0 0-1.244-1.244H3.484a1.073 1.073 0 0 1-1-1.136V6.1a1.086 1.086 0 0 1 .842-1.115.25.25 0 0 0 .2-.258c-.039-.766-.051-1.6-.055-2a.25.25 0 0 0-.25-.247H1.5A1.494 1.494 0 0 0 0 3.975v17.037a1.493 1.493 0 0 0 1.494 1.493H7.71a1.244 1.244 0 0 0 1.244-1.243zM11.937 4.472V2.484a.5.5 0 0 0-.5-.5h-.758a.251.251 0 0 1-.249-.222 1.989 1.989 0 0 0-3.953 0 .249.249 0 0 1-.249.222h-.755a.5.5 0 0 0-.5.5v1.988a.5.5 0 0 0 .5.5h5.967a.5.5 0 0 0 .497-.5zM19.02 17.269h-3.979a.75.75 0 1 0 0 1.5h3.979a.75.75 0 1 0 0-1.5zM14.291 14.54a.75.75 0 0 0 .75.749h2.486a.75.75 0 1 0 0-1.5h-2.486a.75.75 0 0 0-.75.751z"/><path d="M23.5 13.46a1.991 1.991 0 0 0-.584-1.409l-1.406-1.4a1.994 1.994 0 0 0-1.41-.584h-7.606a1.993 1.993 0 0 0-1.994 1.988V22a2 2 0 0 0 2 2h9a2 2 0 0 0 2-2zm-11-.4a1 1 0 0 1 1-1h6.187a1 1 0 0 1 .707.292l.818.816a1 1 0 0 1 .293.708V21a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1z"/>
</symbol>
<symbol id="icon-crypto-currency-bitcoin-circle" viewBox="0 0 55 55">
<g clip-path="url(#a)"><path d="M24.276 17.98a.573.573 0 0 0-.573.573v4.971a.573.573 0 0 0 .573.573h3.964a3.06 3.06 0 0 0 0-6.117h-3.964zM28.24 29.826h-3.964a.573.573 0 0 0-.573.573v4.973a.573.573 0 0 0 .573.573h3.964a3.06 3.06 0 1 0 0-6.12z"/><path d="M27.5 0a27.5 27.5 0 1 0 0 55 27.5 27.5 0 0 0 0-55zm7.505 26.597a.57.57 0 0 0 0 .729 8.723 8.723 0 0 1-6.318 14.293.573.573 0 0 0-.545.57v1.353a2.865 2.865 0 0 1-5.73 0v-1.295a.57.57 0 0 0-.572-.573h-1.002a2.864 2.864 0 0 1-2.864-2.865V15.125a2.861 2.861 0 0 1 2.864-2.865h1.004a.573.573 0 0 0 .573-.572v-.23a2.865 2.865 0 0 1 5.729 0v.346a.5.5 0 0 0 .479.5 8.708 8.708 0 0 1 6.382 14.293z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h55v55H0z"/></clipPath></defs>
</symbol>
<symbol id="icon-github" viewBox="0 0 23 22">
<path clip-rule="evenodd" d="M11.5 0C5.15 0 0 5.05 0 11.28c0 4.982 3.295 9.209 7.865 10.7.575.104.785-.244.785-.543 0-.268-.01-.977-.016-1.918-3.199.682-3.874-1.512-3.874-1.512-.522-1.303-1.276-1.65-1.276-1.65-1.045-.7.079-.685.079-.685 1.153.08 1.76 1.162 1.76 1.162 1.027 1.724 2.692 1.226 3.348.937.104-.73.402-1.226.73-1.508-2.553-.285-5.238-1.252-5.238-5.574 0-1.231.448-2.238 1.184-3.027-.119-.285-.513-1.431.112-2.984 0 0 .966-.303 3.162 1.156.918-.25 1.902-.375 2.88-.38.976.005 1.96.13 2.879.38 2.195-1.46 3.159-1.156 3.159-1.156.627 1.553.233 2.699.114 2.984.738.79 1.183 1.796 1.183 3.027 0 4.333-2.69 5.286-5.25 5.566.412.348.78 1.036.78 2.088 0 1.508-.015 2.724-.015 3.094 0 .302.207.653.79.542C19.709 20.485 23 16.26 23 11.28 23 5.05 17.85 0 11.5 0z"/>
</symbol>
<symbol id="icon-list-to-do" viewBox="0 0 24 24">
<title>list-to-do</title><path d="M10.414 13.531l-1.375 1.718a.139.139 0 0 1-.228 0l-.781-.781a.75.75 0 0 0-1.06 1.062l1.5 1.5a.748.748 0 0 0 .53.219h.041a.75.75 0 0 0 .545-.28l2-2.5a.75.75 0 0 0-1.172-.937zM10.414 8.031L9.039 9.749a.139.139 0 0 1-.228 0l-.781-.78a.75.75 0 0 0-1.06 1.061l1.5 1.5a.748.748 0 0 0 .53.219h.041a.75.75 0 0 0 .545-.28l2-2.5a.75.75 0 0 0-1.172-.937zM16 9.749h-2.5a.75.75 0 0 0 0 1.5H16a.75.75 0 0 0 0-1.5zM16 15.249h-2.5a.75.75 0 1 0 0 1.5H16a.75.75 0 0 0 0-1.5z"/><path d="M21.707 5.706L16.293.292A1 1 0 0 0 15.586 0H4a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6.413a1 1 0 0 0-.293-.707zM20 21.5a.5.5 0 0 1-.5.5h-15a.5.5 0 0 1-.5-.5v-19a.5.5 0 0 1 .5-.5h10.25a.25.25 0 0 1 .25.25V5a2 2 0 0 0 2 2h2.75a.25.25 0 0 1 .25.25z"/>
</symbol>
<symbol id="icon-module" viewBox="0 0 54 54">
<path d="M50.677 7.526l-21.91-5.94a6.816 6.816 0 0 0-3.533 0l-21.91 5.94A4.563 4.563 0 0 0 0 11.871v28.22a4.5 4.5 0 0 0 3.022 4.25l22.817 7.938c.73.254 1.5.379 2.273.369a6.386 6.386 0 0 0 2.346-.437l20.644-7.875A4.687 4.687 0 0 0 54 40.14V11.871a4.55 4.55 0 0 0-3.323-4.345zM26.41 5.931a2.277 2.277 0 0 1 1.18 0l13.853 3.755a.563.563 0 0 1 0 1.085l-13.194 3.793a.563.563 0 0 1-.3 0l-14.93-3.917a.562.562 0 0 1 0-1.087L26.41 5.931zM4.878 40.221a.562.562 0 0 1-.378-.53V13.794a.565.565 0 0 1 .457-.555.572.572 0 0 1 .254.006l20.25 5.314a.561.561 0 0 1 .42.545v27.63a.556.556 0 0 1-.482.548.568.568 0 0 1-.264-.024L4.878 40.221z" fill="#0B476D"/>
</symbol>
<symbol id="icon-navigation-menu" viewBox="0 0 24 24">
<title>navigation-menu</title><rect x=".5" y="2.5" width="23" height="3" rx="1" ry="1"/><rect x=".5" y="10.5" width="23" height="3" rx="1" ry="1"/><rect x=".5" y="18.5" width="23" height="3" rx="1" ry="1"/>
</symbol>
<symbol id="icon-notes-paper-text" viewBox="0 0 54 54">
<g clip-path="url(#a)" fill="#0B476D"><path d="M42.09 20.716l2.25-2.25a2.25 2.25 0 1 0-3.18-3.182l-2.25 2.25a2.251 2.251 0 0 1-3.184 0 6.912 6.912 0 0 0-9.545 0 2.25 2.25 0 0 1-3.181 0 6.914 6.914 0 0 0-9.547 0l-2.25 2.25a2.25 2.25 0 0 0 3.184 3.182l2.25-2.25a2.304 2.304 0 0 1 3.181 0 6.75 6.75 0 0 0 9.544 0 2.304 2.304 0 0 1 3.182 0 6.75 6.75 0 0 0 9.547 0zM26.181 31.034a2.25 2.25 0 0 1-3.181 0 6.914 6.914 0 0 0-9.547 0l-2.25 2.25a2.25 2.25 0 0 0 3.184 3.182l2.25-2.25a2.304 2.304 0 0 1 3.181 0 6.75 6.75 0 0 0 9.544 0 2.25 2.25 0 0 0-3.181-3.182z"/><path d="M54 4.5A4.5 4.5 0 0 0 49.5 0h-45A4.5 4.5 0 0 0 0 4.5v45A4.5 4.5 0 0 0 4.5 54H36a2.25 2.25 0 0 0 1.59-.66l15.75-15.75A2.25 2.25 0 0 0 54 36V4.5zM4.5 5.625A1.125 1.125 0 0 1 5.625 4.5h42.75A1.125 1.125 0 0 1 49.5 5.625V33.75a1.125 1.125 0 0 1-1.125 1.125h-9a4.5 4.5 0 0 0-4.5 4.5v9A1.125 1.125 0 0 1 33.75 49.5H5.625A1.125 1.125 0 0 1 4.5 48.375V5.625z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h54v54H0z"/></clipPath></defs>
</symbol>
<symbol id="icon-paginate-filter-video-alternate" viewBox="0 0 54 54">
<g clip-path="url(#a)" fill="#0B476D"><path d="M40.446 20.637L27.12 13.023a2.337 2.337 0 0 0-3.496 2.025v15.226a2.338 2.338 0 0 0 3.496 2.025l13.325-7.616a2.335 2.335 0 0 0 0-4.05l.002.004z"/><path d="M49.5 0H12.375a4.5 4.5 0 0 0-4.5 4.5v37.125a4.5 4.5 0 0 0 4.5 4.5H49.5a4.5 4.5 0 0 0 4.5-4.5V4.5A4.5 4.5 0 0 0 49.5 0zm-.326 41.297a1.123 1.123 0 0 1-.797.328H13.5a1.125 1.125 0 0 1-1.125-1.125V5.625A1.125 1.125 0 0 1 13.5 4.5h34.875A1.125 1.125 0 0 1 49.5 5.625V40.5c0 .296-.118.58-.326.79v.007z"/><path d="M43.875 49.5H5.625A1.125 1.125 0 0 1 4.5 48.375v-38.25a2.25 2.25 0 1 0-4.5 0V49.5A4.5 4.5 0 0 0 4.5 54h39.375a2.25 2.25 0 0 0 0-4.5z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h54v54H0z"/></clipPath></defs>
</symbol>
<symbol id="icon-pen-write-paper" viewBox="0 0 50 50">
<g clip-path="url(#a)" fill="#0B476D"><path d="M39.583 27.083a2.083 2.083 0 0 0-2.083 2.084v6.25h-6.25a4.167 4.167 0 0 0-4.167 4.166v6.25H6.25a2.083 2.083 0 0 1-2.083-2.083V6.25A2.083 2.083 0 0 1 6.25 4.167h14.583a2.083 2.083 0 1 0 0-4.167H6.25A6.25 6.25 0 0 0 0 6.25v37.5A6.25 6.25 0 0 0 6.25 50h20.833a4.139 4.139 0 0 0 2.946-1.22l10.417-10.418a4.184 4.184 0 0 0 1.22-2.945v-6.25a2.083 2.083 0 0 0-2.083-2.084z"/><path d="M18.188 26.085a1.043 1.043 0 0 0-.736.752l-1.16 4.66-2.609 2.61a1.562 1.562 0 0 0 2.209 2.21l2.633-2.63 4.598-1.156a1.042 1.042 0 0 0 .485-1.744l-4.406-4.433a1.041 1.041 0 0 0-1.015-.269zM49.39.61a2.083 2.083 0 0 0-2.946 0l-1.875 1.875a4.19 4.19 0 0 0-3.194.434l-.108-.106a6.25 6.25 0 0 0-8.823.012l-7.525 7.51a2.083 2.083 0 0 0 0 2.946 2.108 2.108 0 0 0 2.948 0l7.55-7.529a2.083 2.083 0 0 1 2.93.015L36.876 7.24a1.042 1.042 0 0 0 0 1.473l4.413 4.412a1.041 1.041 0 0 0 1.472 0l3.684-3.683A4.167 4.167 0 0 0 47.52 5.42l1.875-1.875A2.083 2.083 0 0 0 49.39.61z"/><path d="M25.833 29.625c.276 0 .54-.11.736-.306l13.241-13.24a1.042 1.042 0 0 0 0-1.473l-4.414-4.42a1.071 1.071 0 0 0-1.473 0L20.68 23.426a1.041 1.041 0 0 0 0 1.473l4.419 4.419c.194.195.458.305.733.306z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h50v50H0z"/></clipPath></defs>
</symbol>
<symbol id="icon-pie-line-graph" viewBox="0 0 50 50">
<path d="M6.123 50h37.754A6.13 6.13 0 0 0 50 43.877V6.123A6.13 6.13 0 0 0 43.877 0H6.123A6.13 6.13 0 0 0 0 6.123v37.754A6.13 6.13 0 0 0 6.123 50zm37.754-4.081H6.123a2.042 2.042 0 0 1-2.042-2.042V6.25a2.083 2.083 0 0 1 2.084-2.083h37.67A2.083 2.083 0 0 1 45.92 6.25v37.627a2.042 2.042 0 0 1-2.042 2.042z" fill="#0B476D"/><path d="M39.242 32.483l-4.3 3.817a.525.525 0 0 1-.657.03l-2.845-2.11a3.913 3.913 0 0 0-2.365-.705 3.685 3.685 0 0 0-2.331.898L21.5 39.067a2.087 2.087 0 1 0 2.767 3.125l4.652-4.13a.521.521 0 0 1 .654-.029l2.846 2.109c.69.485 1.52.734 2.364.708a3.687 3.687 0 0 0 2.332-.9l4.893-4.342a2.088 2.088 0 0 0-2.766-3.125zM29.856 21.09a.434.434 0 0 0-.323-.182l-8.47-.654a.436.436 0 0 0-.463.535l1.842 8.294a.444.444 0 0 0 .407.344.438.438 0 0 0 .186-.031 11.472 11.472 0 0 0 6.892-7.938.433.433 0 0 0-.07-.369zM15.019 7.935a.441.441 0 0 0-.242.625l4.72 8.732a.436.436 0 0 0 .353.227l9.883.764a.44.44 0 0 0 .473-.477 11.457 11.457 0 0 0-15.187-9.86v-.01zM12.158 9.6a.437.437 0 0 0-.36.081 11.458 11.458 0 0 0 6.994 20.527c.223 0 .443 0 .664-.018a.433.433 0 0 0 .325-.175.446.446 0 0 0 .08-.36l-2.307-10.378a.471.471 0 0 0-.041-.114L12.453 9.82a.441.441 0 0 0-.296-.22zM38.542 13.542a2.083 2.083 0 1 0 0-4.167 2.083 2.083 0 0 0 0 4.167zM38.542 19.792a2.083 2.083 0 1 0 0-4.167 2.083 2.083 0 0 0 0 4.167zM38.542 26.042a2.083 2.083 0 1 0 0-4.167 2.083 2.083 0 0 0 0 4.167z" fill="#0B476D"/>
</symbol>
<symbol id="icon-rating-star" viewBox="0 0 16 16">
<path d="M15.704 5.82a1.003 1.003 0 0 0-.938-.654H10.71a.333.333 0 0 1-.315-.223L8.937.815a1 1 0 0 0-1.873 0l-.004.01-1.453 4.118a.333.333 0 0 1-.314.223h-4.06a1 1 0 0 0-.641 1.767L4.048 9.8a.333.333 0 0 1 .103.362L2.7 14.516a1 1 0 0 0 1.54 1.123l3.564-2.614a.334.334 0 0 1 .394 0l3.563 2.613a1 1 0 0 0 1.541-1.122l-1.452-4.357a.333.333 0 0 1 .104-.362l3.462-2.87a1 1 0 0 0 .289-1.108z" fill="#fff"/>
</symbol>
<symbol id="icon-search-bar" viewBox="0 0 68 68">
<path d="M60.177 57.08a.706.706 0 0 1-.085-.895 14.308 14.308 0 1 0-3.913 3.913.709.709 0 0 1 .896.085l7.182 7.18a2.221 2.221 0 0 0 3.117 0 2.193 2.193 0 0 0 0-3.1l-7.197-7.183zM48.26 58.137a9.872 9.872 0 1 1 9.872-9.871 9.882 9.882 0 0 1-9.872 9.871z" fill="#0B476D"/><path d="M29.75 48.85a.705.705 0 0 0-.694-.683H7.083a1.417 1.417 0 0 1-1.416-1.417V24.083a1.417 1.417 0 0 1 1.416-1.416h51a1.417 1.417 0 0 1 1.417 1.416v9.229a.703.703 0 0 0 .264.55 18.532 18.532 0 0 1 4.09 4.657.71.71 0 0 0 1.313-.374V22.667A5.667 5.667 0 0 0 59.5 17H5.667A5.667 5.667 0 0 0 0 22.667v25.5a5.667 5.667 0 0 0 5.667 5.666H29.69a.706.706 0 0 0 .686-.892 18.522 18.522 0 0 1-.626-4.092z" fill="#0B476D"/><path d="M14.167 38.25a2.833 2.833 0 1 0 0-5.667 2.833 2.833 0 0 0 0 5.667zM25.5 38.25a2.833 2.833 0 1 0 0-5.667 2.833 2.833 0 0 0 0 5.667z" fill="#0B476D"/>
</symbol>
<symbol id="icon-symbols" viewBox="">
</symbol>
<symbol id="icon-tag-new-circle" viewBox="0 0 54 54">
<g clip-path="url(#a)"><path d="M27 0a27 27 0 1 0 27 27A27.03 27.03 0 0 0 27 0zm-7.69 20.25V36a1.687 1.687 0 0 1-1.697 1.688 1.687 1.687 0 0 1-1.51-.932l-3.6-7.227a.563.563 0 0 0-1.066.252V36a1.687 1.687 0 1 1-3.375 0V20.25a1.687 1.687 0 0 1 3.188-.756l3.6 7.227a.562.562 0 0 0 1.066-.252V20.25a1.687 1.687 0 1 1 3.375 0h.018zm1.928 2.626a4.318 4.318 0 0 1 4.313-4.314h5.25a1.687 1.687 0 0 1 0 3.375h-5.25a.943.943 0 0 0-.938.939v2.999a.562.562 0 0 0 .562.563h3.002a1.687 1.687 0 0 1 0 3.375h-3.002a.563.563 0 0 0-.562.562v3a.942.942 0 0 0 .938.938h5.25a1.687 1.687 0 0 1 0 3.374h-5.25a4.318 4.318 0 0 1-4.313-4.313V22.876zM42.953 36.6l-1.182-3.072a.563.563 0 0 0-1.048 0l-1.181 3.072a1.687 1.687 0 0 1-3.25-.398l-1.968-15.75a1.687 1.687 0 1 1 3.348-.419l.857 6.849a.563.563 0 0 0 1.082.13l.061-.157a1.757 1.757 0 0 1 3.15 0l.06.157a.562.562 0 0 0 1.085-.13l.855-6.849a1.688 1.688 0 1 1 3.348.419l-1.968 15.75a1.683 1.683 0 0 1-1.674 1.478 1.685 1.685 0 0 1-1.575-1.073V36.6z" fill="#0B476D"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h54v54H0z"/></clipPath></defs>
</symbol>
<symbol id="icon-twitter" viewBox="0 0 27 27">
<path d="M0 13.5C0 6.044 6.044 0 13.5 0S27 6.044 27 13.5 20.956 27 13.5 27 0 20.956 0 13.5z" fill="#55ACEE"/><path d="M13.096 10.973l.028.467-.472-.057c-1.719-.22-3.22-.963-4.495-2.212l-.623-.62-.16.458c-.34 1.02-.124 2.097.585 2.822.377.4.292.458-.36.22-.226-.077-.424-.134-.443-.106-.066.067.16.935.34 1.278.246.476.746.944 1.294 1.22l.462.22-.547.009c-.53 0-.548.01-.491.21.189.62.935 1.277 1.765 1.563l.586.2-.51.305a5.316 5.316 0 0 1-2.53.706c-.426.01-.775.047-.775.076 0 .095 1.152.63 1.822.839 2.012.62 4.4.353 6.195-.706 1.275-.753 2.55-2.25 3.145-3.698.32-.773.642-2.184.642-2.86 0-.439.028-.496.557-1.02.311-.306.604-.64.66-.735.095-.18.086-.18-.396-.019-.802.286-.916.248-.52-.18.294-.306.643-.859.643-1.02 0-.03-.142.018-.302.104-.17.095-.548.238-.831.324l-.51.162-.463-.314c-.255-.172-.614-.363-.802-.42-.482-.133-1.219-.114-1.653.038-1.18.43-1.926 1.535-1.841 2.746z" fill="#fff"/>
</symbol>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

images/status-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

images/twitter-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

index.html
+82 -25
View File
@@ -15,20 +15,49 @@
</head>
<body>
<header role="banner">
<span class="c-header__background"></span>
<div class="container mw-960">
<div class="row">
<div class="col-3">
<div class="row align-items-center">
<div class="col-2">
<a href="#" title="Embark" class="top-logo logo-negative navbar-brand"></a>
</div>
<div class="col-9">
<div class="col-10">
<ul class="mainNav onlyDesktop text-right">
<li><a href="#tools">Tools</a></li>
<li><a href="#">Team</a></li>
<li><a href="#community">Community</a></li>
<li><a href="#">Blog</a></li>
<li class="social"><a href="#" target="_blank"><img src="images/status-icon.png"></a></li>
<li class="social"><a href="#" target="_blank"><img src="images/twitter-icon.png"></a></li>
<li class="social"><a href="#" target="_blank"><img src="images/github-icon.png"></a></li>
</ul>
<button type="button" class="c-navigation__trigger u-link-ghost white navbar-toggler onlyMobile ml-auto" title="Open menu" data-toggle="offcanvas" aria-expanded="false" aria-label="Toggle navigation">
<svg class="c-icon white">
<use xlink:href="images/icons.svg#icon-navigation-menu"></use>
</svg>
</button>
</div>
</div>
</div>
<div class="navbar-collapse offcanvas-collapse onlyMobile">
<ul class="navbar-nav mr-auto mobileMenu">
<li class="nav-item active">
<button class="c-navigation__trigger u-link-ghost white close" title="Close menu">
<svg class="c-icon white">
<use xlink:href="images/icons.svg#icon-close"></use>
</svg>
</button>
</li>
<li><a href="#tools">Tools</a></li>
<li><a href="#">Team</a></li>
<li><a href="#community">Community</a></li>
<li><a href="#">Blog</a></li>
<li class="social"><a href="#" target="_blank"><img src="images/status-icon.png"></a></li>
<li class="social"><a href="#" target="_blank"><img src="images/twitter-icon.png"></a></li>
<li class="social"><a href="#" target="_blank"><img src="images/github-icon.png"></a></li>
</ul>
</div>
<div class="container mw-960 pos-rel">
<div class="row">
<div class="col-lg-12">
@@ -43,13 +72,12 @@
</div>
</header>
<div class="righttool">
<div class="righttool" id="tools">
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="right-tool-header text-center">The Right Tool for the Job</h2>
<p class="right-tool-sub">Embark labs is a suite of products and services to help you make a lasting
impact.</p>
<p class="right-tool-sub">The Embark labs project is comprised of products and services to help you make a lasting impact.</p>
</div>
</div>
<div class="right-tool-logos">
@@ -150,7 +178,7 @@
</div>
</div>
<div class="start">
<div class="start" id="community">
<div class="container h-100">
<div class="row align-items-center h-100">
<div class="col-lg-12">
@@ -205,26 +233,46 @@
</div>
<footer>
<section class="footer-links">
<div class="footer-link-cols">
<div class="container">
<div class="row">
<div class="col-lg-12">
<ul>
<li>
<a href="#" title="Embark" class="top-logo logo-negative navbar-brand"></a>
</li>
<li><a href="https://keycard.tech/" target="_blank">Keycard</a></li>
<li><a href="https://dap.ps/" target="_blank">dap.ps</a></li>
<li><a href="https://embark.status.im/" target="_blank">Embark</a></li>
<li><a href="https://subspace.status.im/" target="_blank">Subspace</a></li>
<li><a href="https://vac.dev/" target="_blank">Vac</a></li>
<li><a href="https://status.im/" target="_blank">Status</a></li>
</ul>
<div class="col-lg-4 col-md-4">
<div class="footer-widget">
<span class="widget-header">Social Links</span>
<ul class="social-footer">
<li class="social"><a href="#" target="_blank"><img src="images/status-icon.png"> Status</a></li>
<li class="social"><a href="#" target="_blank"><img src="images/twitter-icon.png"> Twitter</a></li>
<li class="social"><a href="https://get.status.im/chat/public/embark" target="_blank"><img src="images/github-icon.png"> Github</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-4">
<div class="footer-widget">
<span class="widget-header">More</span>
<ul class="links-footer">
<li><a href="#tools">Tools</a></li>
<li><a href="#">Team</a></li>
<li><a href="#community">Community</a></li>
<li><a href="#">Blog</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-4">
<div class="footer-widget">
<span class="widget-header">The Status Network</span>
<ul class="links-footer two-cols">
<li><a href="https://status.im/" target="_blank">Status</a></li>
<li><a href="https://keycard.tech/" target="_blank">Keycard</a></li>
<li><a href="https://dap.ps/" target="_blank">dap.ps</a></li>
<li><a href="https://embark.status.im/" target="_blank">Embark</a></li>
<li><a href="https://subspace.status.im/" target="_blank">Subspace</a></li>
<li><a href="https://vac.dev/" target="_blank">Vac</a></li>
</ul>
</div>
</div>
</div>
</div>
</section>
</div>
</footer>
@@ -236,6 +284,15 @@
<script>
AOS.init();
$(document).ready(function () {
$('[data-toggle="offcanvas"], #navToggle').on('click', function () {
$('.offcanvas-collapse').toggleClass('open')
})
$('.close').on('click', function () {
$('.offcanvas-collapse').removeClass('open');
})
});
</script>
</body>