diff --git a/assets/main.scss b/assets/main.scss
index 87689f4b6bd24e6af59be52ad9b0222ff52c95f0..284db65e925d525f2362249c068f8a858fc9287b 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -14,7 +14,7 @@ body {
body:after{
display: none;
- content: url("../images/wide-logo.png") url("../images/logo-text-white.png");
+ content: url("/styleguide/images/wide-logo.png") url("/styleguide/images/logo-text-white.png");
}
a {
@@ -33,9 +33,9 @@ a:hover {
--text: #{$gray-900};
--link: #{$blue-500};
--link-hover: #{$blue-600};
- --logo: url("../images/wide-logo.png");
+ --logo: url("/styleguide/images/wide-logo.png");
--logo-bg: #{$white};
- --header-svg: url("../images/app.svg");
+ --header-svg: url("/styleguide/images/app.svg");
--header-text: #{$gray-950};
--sidebar-bg: #{$gray-100};
--sidebar-inner-bg: #{$gray-50};
@@ -71,9 +71,9 @@ a:hover {
--text: #{$white};
--link: #{$white};
--link-hover: #{$gray-200};
- --logo: url("../images/logo-text-white.png");
+ --logo: url("/styleguide/images/logo-text-white.png");
--logo-bg: #{$night-900};
- --header-svg: url("../images/app-dark.svg");
+ --header-svg: url("/styleguide/images/app-dark.svg");
--header-text: #{$gray-950};
--sidebar-bg: #{$night-800};
--sidebar-inner-bg: #{$night-700};
diff --git a/config.toml b/config.toml
index aac04d1d2c1220c958dc7d1815a9016591e37c4c..8d58e2d9162db745926a6fdcc90b25cebda93bae 100644
--- a/config.toml
+++ b/config.toml
@@ -1,5 +1,5 @@
-baseURL = ""
+baseURL = "/styleguide/"
languageCode = "en-us"
title = "Briar"
[params]
- logo = "/images/logo.svg"
+ logo = "/styleguide/images/logo.svg"
diff --git a/layouts/partials/brand/logo.html b/layouts/partials/brand/logo.html
index 169773162e736dee9a5c2b72dd2216f678d101cc..4429fe345a6ed7f6cf3730d2f8fe14ecaffb353e 100644
--- a/layouts/partials/brand/logo.html
+++ b/layouts/partials/brand/logo.html
@@ -6,13 +6,13 @@
<div class="col-md-6 col-sm-12 mb-3">
<h5 class="pb-3">Composition (Horizontal)</h5>
<div class="bg-box text-center p-5">
- <img src="/images/composition-horizontal.svg" />
+ <img src="/styleguide/images/composition-horizontal.svg" />
</div>
</div>
<div class="col-md-6 col-sm-12">
<h5 class="pb-3">Composition (Vertical)</h5>
<div class="bg-box text-center p-5">
- <img src="/images/composition-vertical.svg" />
+ <img src="/styleguide/images/composition-vertical.svg" />
</div>
</div>
</div>
@@ -21,13 +21,13 @@
<div class="col-md-6 col-sm-12 mb-3">
<h5 class="pb-3">Safe Space (Horizontal)</h5>
<div class="bg-box text-center p-5">
- <img src="/images/safespace-horizontal.svg" />
+ <img src="/styleguide/images/safespace-horizontal.svg" />
</div>
</div>
<div class="col-md-6 col-sm-12">
<h5 class="pb-3">Safe Space (Vertical)</h5>
<div class="bg-box text-center p-5">
- <img src="/images/safespace-vertical.svg" />
+ <img src="/styleguide/images/safespace-vertical.svg" />
</div>
</div>
</div>
@@ -39,7 +39,7 @@
<div class="row mb-5">
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-4">
- <img class="rb-contain" src="/images/briar_horizontal_color.png" alt="Briar Horizontal color logo">
+ <img class="rb-contain" src="/styleguide/images/briar_horizontal_color.png" alt="Briar Horizontal color logo">
</div>
<p class="mb-0 mt-2 caption">Horizontal Color Light Background</p>
<div class="dropdown mb-5">
@@ -47,15 +47,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_horizontal_color.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_horizontal_color.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_color.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_color.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-4">
- <img class="rb-contain" src="/images/briar_horizontal_black.png" alt="Briar Horizontal black logo">
+ <img class="rb-contain" src="/styleguide/images/briar_horizontal_black.png" alt="Briar Horizontal black logo">
</div>
<p class="mb-0 mt-2 caption">Horizontal Black Light Background</p>
<div class="dropdown mb-5">
@@ -63,15 +63,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_horizontal_black.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_horizontal_black.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_black.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_black.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-4 background-night-700">
- <img class="rb-contain" src="/images/briar_horizontal_color_bg.png" alt="Briar Horizontal color logo with light background">
+ <img class="rb-contain" src="/styleguide/images/briar_horizontal_color_bg.png" alt="Briar Horizontal color logo with light background">
</div>
<p class="mb-0 mt-2 caption">Horizontal Color Light Background</p>
<div class="dropdown mb-5">
@@ -79,14 +79,14 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_horizontal_color_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_horizontal_color_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_color_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_color_bg.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-4 background-black">
- <img class="rb-contain" src="/images/briar_horizontal_white.png" alt="Briar Horizontal white logo with black background">
+ <img class="rb-contain" src="/styleguide/images/briar_horizontal_white.png" alt="Briar Horizontal white logo with black background">
</div>
<p class="mb-0 mt-2 caption">Horizontal White Black Background</p>
<div class="dropdown mb-5">
@@ -94,8 +94,8 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_horizontal_white_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_horizontal_white_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_white_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_horizontal_white_bg.svg" download>SVG</a>
</div>
</div>
</div>
@@ -104,7 +104,7 @@
<div class="row pt-2">
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-4">
- <img class="rb-contain" src="/images/briar_vertical_color.png" alt="Briar Vertical color logo">
+ <img class="rb-contain" src="/styleguide/images/briar_vertical_color.png" alt="Briar Vertical color logo">
</div>
<p class="mb-0 mt-2 caption">Vertical Color Light Background</p>
<div class="dropdown mb-5">
@@ -112,15 +112,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_vertical_color.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_vertical_color.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_color.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_color.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-4">
- <img class="rb-contain" src="/images/briar_vertical_black.png" alt="Briar Vertical black logo">
+ <img class="rb-contain" src="/styleguide/images/briar_vertical_black.png" alt="Briar Vertical black logo">
</div>
<p class="mb-0 mt-2 caption">Vertical Black Light Background</p>
<div class="dropdown mb-5">
@@ -128,15 +128,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_vertical_black.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_vertical_black.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_black.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_black.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-4 background-night-700">
- <img class="rb-contain" src="/images/briar_vertical_color_bg.png" alt="Briar Vertical color logo with light background">
+ <img class="rb-contain" src="/styleguide/images/briar_vertical_color_bg.png" alt="Briar Vertical color logo with light background">
</div>
<p class="mb-0 mt-2 caption">Vertical Color Light Background</p>
<div class="dropdown mb-5">
@@ -144,14 +144,14 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_vertical_color_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_vertical_color_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_color_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_color_bg.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-4 background-black">
- <img class="rb-contain" src="/images/briar_vertical_white.png" alt="Briar Vertical white logo with black background">
+ <img class="rb-contain" src="/styleguide/images/briar_vertical_white.png" alt="Briar Vertical white logo with black background">
</div>
<p class="mb-0 mt-2 caption">Vertical White Black Background</p>
<div class="dropdown mb-5">
@@ -159,8 +159,8 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_vertical_white_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_vertical_white_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_white_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_vertical_white_bg.svg" download>SVG</a>
</div>
</div>
</div>
@@ -169,7 +169,7 @@
<div class="row mb-5">
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-5">
- <img class="rb-contain" src="/images/briar_icon_color.png" alt="Briar icon color logo">
+ <img class="rb-contain" src="/styleguide/images/briar_icon_color.png" alt="Briar icon color logo">
</div>
<p class="mb-0 mt-2 caption">Icon Color Light Background</p>
<div class="dropdown mb-5">
@@ -177,15 +177,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_icon_color.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_icon_color.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_color.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_color.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-5">
- <img class="rb-contain" src="/images/briar_icon_black.png" alt="Briar icon black logo">
+ <img class="rb-contain" src="/styleguide/images/briar_icon_black.png" alt="Briar icon black logo">
</div>
<p class="mb-0 mt-2 caption">Icon Black Light Background</p>
<div class="dropdown mb-5">
@@ -193,15 +193,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_icon_black.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_icon_black.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_black.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_black.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-5 background-night-700">
- <img class="rb-contain" src="/images/briar_icon_color.png" alt="Briar icon color logo with light background">
+ <img class="rb-contain" src="/styleguide/images/briar_icon_color.png" alt="Briar icon color logo with light background">
</div>
<p class="mb-0 mt-2 caption">Icon Color Light Background</p>
<div class="dropdown mb-5">
@@ -209,14 +209,14 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_icon_color_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_icon_color_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_color_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_color_bg.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3">
<div class="image border p-5 background-black">
- <img class="rb-contain" src="/images/briar_icon_white.png" alt="Briar icon white logo with black background">
+ <img class="rb-contain" src="/styleguide/images/briar_icon_white.png" alt="Briar icon white logo with black background">
</div>
<p class="mb-0 mt-2 caption">Icon White Black Background</p>
<div class="dropdown mb-5">
@@ -224,8 +224,8 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/briar_icon_white_bg.png" download>PNG</a>
- <a class="dropdown-item" href="/images/briar_icon_white_bg.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_white_bg.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/briar_icon_white_bg.svg" download>SVG</a>
</div>
</div>
</div>
diff --git a/layouts/partials/brand/typography.html b/layouts/partials/brand/typography.html
index dc68c0c33fc122901b0b8e3ef8b269b5eecfb96a..5ef553c43d8a161e8cd44e7a35b372a0c594e3d5 100644
--- a/layouts/partials/brand/typography.html
+++ b/layouts/partials/brand/typography.html
@@ -13,7 +13,7 @@
</div>
<div class="col-md-6 col-sm-12">
<div class="bg-box text-center p-5">
- <img src="/images/briar-wordmark.svg" />
+ <img src="/styleguide/images/briar-wordmark.svg" />
</div>
<div class="alert alert-warning mt-3" role="alert">
<i class="material-icons orange-icon">warning</i> <a class="underline" href="https://www.fontsquirrel.com/fonts/sinkin-sans" target="_blank" rel="noopener">Sinkin Sans</a> is used for the Briar wordmark. Its use is limited to the Briar logo exclusively and should not be used elsewhere.
diff --git a/layouts/partials/design/illustrations.html b/layouts/partials/design/illustrations.html
index 3eae2734c90ea8018d6318156fbbf66fc6665976..057c878454fe8455bc521ff0789d68b20e288009 100644
--- a/layouts/partials/design/illustrations.html
+++ b/layouts/partials/design/illustrations.html
@@ -5,7 +5,7 @@
<div class="row mb-5">
<div class="col-sm-12 col-md-3 col-sm-3 mb-4 pl-lg-0 pl-sm-0">
<div class="image flexing border p-1">
- <img class="rb-contain" src="/images/chat_doodle_black.png" alt="Chat Doodles Black">
+ <img class="rb-contain" src="/styleguide/images/chat_doodle_black.png" alt="Chat Doodles Black">
</div>
<p class="mb-0 mt-2 caption">Chat Doodles Black</p>
<div class="dropdown mb-5">
@@ -13,15 +13,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/chat_doodle_black.png" download>PNG</a>
- <a class="dropdown-item" href="/images/chat_doodle_black.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_black.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_black.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-1">
- <img class="rb-contain" src="/images/chat_doodle_subtle.png" alt="Chat Doodles Subtle">
+ <img class="rb-contain" src="/styleguide/images/chat_doodle_subtle.png" alt="Chat Doodles Subtle">
</div>
<p class="mb-0 mt-2 caption">Chat Doodles Subtle</p>
<div class="dropdown mb-5">
@@ -29,15 +29,15 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/chat_doodle_subtle.png" download>PNG</a>
- <a class="dropdown-item" href="/images/chat_doodle_subtle.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-4">
<div class="image flexing border p-1 background-night-900">
- <img class="rb-contain" src="/images/chat_doodle_subtle_dark.png" alt="Chat Doodles Subtle Dark">
+ <img class="rb-contain" src="/styleguide/images/chat_doodle_subtle_dark.png" alt="Chat Doodles Subtle Dark">
</div>
<p class="mb-0 mt-2 caption">Chat Doodles Subtle Dark</p>
<div class="dropdown mb-5">
@@ -45,14 +45,14 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/chat_doodle_subtle_dark.png" download>PNG</a>
- <a class="dropdown-item" href="/images/chat_doodle_subtle_dark.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle_dark.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle_dark.svg" download>SVG</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 col-sm-3 mb-5">
<div class="image flexing border p-1 background-lime-950">
- <img class="rb-contain" src="/images/chat_doodle_subtle_lime_dark.png" alt="Chat Doodles Subtle Lime Dark">
+ <img class="rb-contain" src="/styleguide/images/chat_doodle_subtle_lime_dark.png" alt="Chat Doodles Subtle Lime Dark">
</div>
<p class="mb-0 mt-2 caption">Chat Doodles Subtle Lime Dark</p>
<div class="dropdown mb-5">
@@ -60,8 +60,8 @@
Download
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
- <a class="dropdown-item" href="/images/chat_doodle_subtle_lime_dark.png" download>PNG</a>
- <a class="dropdown-item" href="/images/chat_doodle_subtle_lime_dark.svg" download>SVG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle_lime_dark.png" download>PNG</a>
+ <a class="dropdown-item" href="/styleguide/images/chat_doodle_subtle_lime_dark.svg" download>SVG</a>
</div>
</div>
</div>
diff --git a/layouts/partials/design/spacing.html b/layouts/partials/design/spacing.html
index 7f6219905fe8174ddc4cd66f8a98a04b682dd458..ba8282e01c934b49862a5ef2160edee33a06b546 100644
--- a/layouts/partials/design/spacing.html
+++ b/layouts/partials/design/spacing.html
@@ -3,5 +3,5 @@
<p>Briar uses <a class="underline" href="https://material.io/design/layout/#usage" target="_blank" rel="noopener">Material Design spacing guidelines</a> for both Web and Android platforms. Material Design layouts encourage consistency across platforms, environments, and screen sizes by using uniform elements and spacing. Material Design layouts are visually balanced. Most measurements align to an 8dp grid applied, which aligns both spacing and the overall layout. Smaller components, such as iconography and typography, can align to a 4dp grid.</p>
</div>
<div class="p-1">
- <img src="/images/grid.png" />
+ <img src="/styleguide/images/grid.png" />
</div>
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 86c70b4fbfbfdf530f812d821b69ddd02cad54e9..96791a1831cbea658486135fce5977c8cd50675d 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -1,17 +1,17 @@
<head>
<meta charset="utf-8">
<title>{{ .Site.Title}}</title>
- <link rel="shortcut icon" type="image/png" href='/images/favicon.png'/>
+ <link rel="shortcut icon" type="image/png" href='/styleguide/images/favicon.png'/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel = 'canonical' href = '{{ .Permalink }}'>
{{- $options := (dict "targetPath" "main.css" "outputStyle" "expanded" "enableSourceMap" "true") -}}
{{- $styles := resources.Get "/main.scss" | resources.ToCSS $options }}
<link rel = 'stylesheet' href = '{{ $styles.Permalink }}' integrity = '{{ $styles.Data.Integrity }}'>
- <link rel="stylesheet" href='/css/bootstrap.min.css'>
- <link rel="stylesheet" href='/css/material-icons.css'>
- <link rel="stylesheet" href='/css/all.min.css'>
- <link rel="stylesheet" href='/fonts/inter.css'>
- <link rel="stylesheet" href='/fonts/roboto.css'>
+ <link rel="stylesheet" href='/styleguide/css/bootstrap.min.css'>
+ <link rel="stylesheet" href='/styleguide/css/material-icons.css'>
+ <link rel="stylesheet" href='/styleguide/css/all.min.css'>
+ <link rel="stylesheet" href='/styleguide/fonts/inter.css'>
+ <link rel="stylesheet" href='/styleguide/fonts/roboto.css'>
<noscript>
<style type="text/css">
.code-snippet {display:block;}
diff --git a/layouts/partials/navbar.html b/layouts/partials/navbar.html
index fb0b02e2da8f11c92d9f26a2534d180f7395347f..5a13af85c0803b2de093ed6d64cf4d17b80a6869 100644
--- a/layouts/partials/navbar.html
+++ b/layouts/partials/navbar.html
@@ -1,5 +1,5 @@
<nav class="navbar navbar-expand-lg navbar-light border-black sticky-top rp-navbar__top">
- <a class="navbar-brand" href="/">
+ <a class="navbar-brand" href="/styleguide/">
<img src="{{ .Site.Params.logo }}" 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">
@@ -8,20 +8,20 @@
<div class="collapse navbar-collapse " id="navbarSupportedContent">
<ul class="navbar-nav mr-auto display-xs">
<li class="nav-item">
- <a class="nav-link" href="/getting-started"><i class="material-icons">navigation</i> Getting Started</a>
+ <a class="nav-link" href="/styleguide/getting-started"><i class="material-icons">navigation</i> Getting Started</a>
</li>
<li class="nav-item">
- <a class="nav-link" href="/brand"><i class="material-icons">star</i> Brand</a>
+ <a class="nav-link" href="/styleguide/brand"><i class="material-icons">star</i> Brand</a>
</li>
<li class="nav-item">
- <a class="nav-link" href="/design/"><i class="material-icons">create</i> Design</a>
+ <a class="nav-link" href="/styleguide/design/"><i class="material-icons">create</i> Design</a>
</li>
<li class="nav-item">
- <a class="nav-link" href="/components/"><i class="material-icons">layers</i> Components</a>
+ <a class="nav-link" href="/styleguide/components/"><i class="material-icons">layers</i> Components</a>
</li>
<!--
<li class="nav-item">
- <a class="nav-link" href="/writing/"><i class="material-icons">text_format</i> Writing</a>
+ <a class="nav-link" href="/styleguide/writing/"><i class="material-icons">text_format</i> Writing</a>
</li>
-->
<li class="nav-item">
diff --git a/layouts/partials/navbar_side.html b/layouts/partials/navbar_side.html
index 685af2f9aed1c429a7e8e4b2d5bcaa7e4f942ab4..a9c71c6289e2b350df6ec32b44d9d83d9dede28a 100644
--- a/layouts/partials/navbar_side.html
+++ b/layouts/partials/navbar_side.html
@@ -1,8 +1,8 @@
<div class="sidebar">
-<a href="/"><div class="navbar-wide-logo"></div></a>
+<a href="/styleguide/"><div class="navbar-wide-logo"></div></a>
<ul class="col-sm-16 col-xs-12 p-0 list-group pt-0">
- <a href="/getting-started/" class="sidebar__link__darkGray">
+ <a href="/styleguide/getting-started/" class="sidebar__link__darkGray">
<li class="list-group-item rb-main-sidebar"><i class="material-icons">navigation</i> Getting Started</li>
{{ range .Params.sidebar_start }}
{{ range . }}
@@ -13,7 +13,7 @@
{{ end }}
</a>
- <a href="/brand/" class="sidebar__link__darkGray">
+ <a href="/styleguide/brand/" class="sidebar__link__darkGray">
<li class="list-group-item rb-main-sidebar"><i class="material-icons">star</i> Brand</li>
{{ range .Params.sidebar_brand }}
{{ range . }}
@@ -24,7 +24,7 @@
{{ end }}
</a>
- <a href="/design/" class="sidebar__link__darkGray">
+ <a href="/styleguide/design/" class="sidebar__link__darkGray">
<li class="list-group-item rb-main-sidebar"><i class="material-icons">create</i> Design</li>
{{ range .Params.sidebar_design }}
{{ range . }}
@@ -35,7 +35,7 @@
{{ end }}
</a>
- <a href="/components/" class="sidebar__link__darkGray">
+ <a href="/styleguide/components/" class="sidebar__link__darkGray">
<li class="list-group-item rb-main-sidebar"><i class="material-icons">layers</i> Components</li>
{{ range .Params.sidebar_components }}
{{ range . }}
@@ -47,7 +47,7 @@
</a>
<!--
- <a href="/writing/" class="sidebar__link__darkGray">
+ <a href="/styleguide/writing/" class="sidebar__link__darkGray">
<li class="list-group-item rb-main-sidebar"><i class="material-icons">text_format</i> Writing</li>
{{ range .Params.sidebar_writing }}
{{ range . }}
diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html
index 1d9200922ff5436486813ee2b7342574f0b9b0b0..7e24f9ec42ed2e6662a924419167f87ac2126b90 100644
--- a/layouts/partials/scripts.html
+++ b/layouts/partials/scripts.html
@@ -1,6 +1,6 @@
-<script src='/js/modernizr.min.js'></script>
-<script src='/js/jquery-3.3.1.slim.min.js'></script>
-<script src='/js/popper.min.js'></script>
-<script src='/js/bootstrap.min.js'></script>
-<!-- <script src='/js/run_prettify.js'></script> /* -->
-<script src="/js/index.js"></script>
+<script src='/styleguide/js/modernizr.min.js'></script>
+<script src='/styleguide/js/jquery-3.3.1.slim.min.js'></script>
+<script src='/styleguide/js/popper.min.js'></script>
+<script src='/styleguide/js/bootstrap.min.js'></script>
+<!-- <script src='/styleguide/js/run_prettify.js'></script> /* -->
+<script src="/styleguide/js/index.js"></script>