Merge pull request #10 from CastleCSS/develop

Develop

Author: dariusrosendahl

scss/layout/docs_mainvisual.scss

@@ -89,7 +89,6 @@
 
 	.nav-container {
 		min-height: 100%;
-		height: 100vh;
 		max-height: 100%;
 
 		.nav-wrap {

views/breadcrumbs.html

@@ -61,7 +61,7 @@ <h3>Changing the breadcrumb separator</h3>
 					To set a different character as your separator for all crumbs, please overwrite the variable <code>$breadcrumbs-separator</code>.
 				</p>
 				<p>
-					If you want a different charactor for a specific separator, please add the attribute <code>data-breadcrumbs-separator</code> and give it the vaule of your separator.
+					If you want a different character for a specific separator, please add the attribute <code>data-breadcrumbs-separator</code> and give it the value of your separator.
 				</p>
 				<p>
 					<strong>Example:</strong> <code>data-breadcrumbs-separator="/"</code> sets a / as separator

views/grid.html

@@ -28,7 +28,7 @@ <h2 id="breakpoints" class="head head2">Breakpoints</h2>
 						<li>Set the container width</li>
 					</ul>
 				</p>
-				<p><strong>Make these changes in you own variable file</strong> if you want to continue receiving CastleCSS updates.</p>
+				<p><strong>Make these changes in your own variable file</strong> if you want to continue receiving CastleCSS updates.</p>
 				<div class="specs">
 					<table class="full">
 						<tr>
@@ -237,7 +237,7 @@ <h4>Example of nested <grids></grids></h4>
 			</div>
 			<div id="order" class="block">
 				<h2>Order</h2>
-				<p>You can switch up the order of the items by giving is a class <code>order-{order}</code>.</p>
+				<p>You can switch the order of items by applying the class <code>order-{order}</code>.</p>
 				<table class="specs">
 					<tr>
 						<th>Class</th>
@@ -489,7 +489,7 @@ <h3 class="head head3">Justify content</h3>
 				</div>
 				<div class="block">
 					<h3 class="head head3">Auto fill grid</h3>
-					<p>It's possible to let the grid figure out the widths for itself. When you don't know what the width will be but you want the grid to fill out the <code>auto</code> class is a nice addition to the grid (<code>g</code>).
+					<p>It's possible to let the grid figure out the widths for itself. When you don't know what the width will be but you want the grid to fill out, the <code>auto</code> class is a nice addition to the grid (<code>g</code>).
 					<div>
 						<strong>Example</strong>
 					</div>

views/installation.html

@@ -14,7 +14,7 @@ <h1>Installation</h1>
 			<div class="block block-invert p-3x pt-2x">
 				<h2>Boilerplate</h2>
 				<p>
-					The <strong>easiest way</strong> to start is with the CastleCSS Boilerplate
+					The <strong>easiest way</strong> to start is with the CastleCSS Boilerplate.
 					CastleCSS is a modular, updatable and easy to use HTML and SCSS framework. Use this Boilerplate to get started with your project right away!
 					<div>
 						<a href="https://github.com/castlecss/castlecss-boilerplate" class="btn-theme02" aria-label="Watch castlecss/castlecss-boilerplate on GitHub" target="_blank"><i class="fa fa-github"></i> Watch on github</a>
@@ -39,7 +39,7 @@ <h3>
 			</div>
 			<div class="block mb-3x">
 				<h2>Structure</h2>
-				<p>The basis structure for your website should look similar like this (included in the boilerplate):<br />
+				<p>The basic structure for your website should look similar to this (included in the boilerplate):<br />
 				</p>
 				<code class="code-structure">
 					| Project directory/<br />
@@ -66,7 +66,7 @@ <h2>Structure</h2>
 			</div>
 			<div class="block mb-3x">
 				<h2>Main.scss</h2>
-				<p>Your main.scss should have a setup similair to this (included in the boilerplate):</p>
+				<p>Your main.scss should have a setup similar to this (included in the boilerplate):</p>
 				<pre class="brush: sass;">
 					/*  CastleCSS Core variables */
 					@import "node_modules/castlecss-core/sass/variables";
@@ -92,7 +92,7 @@ <h2>Main.scss</h2>
 					@import "node_modules/castlecss-core/sass/base/utility_spacers";</pre>
 				</div>
 				<div class="block mb-3x">
-					<h2>Install packages seperately</h2>
+					<h2>Install packages separately</h2>
 					<p>Already have a CastleCSS project and want to add a module or just want to add 1 part of CastleCSS? Just include the core and any addon you want.</p>
 					<div class="g">
 

views/style-guidelines.html

@@ -1,4 +1,4 @@
-{% set currentPageId = 'about' %}{% set pageTitle = 'About - CastleCSS' %}{% include "inc/header.html" %}
+{% set currentPageId = 'guidelines' %}{% set pageTitle = 'About - CastleCSS' %}{% include "inc/header.html" %}
 
 	<!-- Main -->
 	<div class="b0_12 b4_14 b4_push_01">
@@ -9,7 +9,7 @@ <h1>Style guidelines</h1>
 			</div>
 			<div class="block">
 				<h2>Sass-lint</h2>
-				<p>For style verifiation we use <a href="https://github.com/sasstools/sass-lint" target="_blank">sass-lint</a>. This ensures us to give you guidelines and warnings about writing mistakes in order, whitespace, nesting, etc</p>
+				<p>For style verification we use <a href="https://github.com/sasstools/sass-lint" target="_blank">sass-lint</a>. This ensures us to give you guidelines and warnings about writing mistakes in order, whitespace, nesting, etc.</p>
 				<p>We have included a sass-lint.yml in the packages and it's connected to the package-json.</p>
 				<p>Example in Visual Studio Code:<br />
 					<img src="img/output-example.png" class="full-img" alt="">