Skip to content

Commit ab5669a

Browse files
merge castlecss-breadcrumbs in castlecss-forms
2 parents a7dbd4c + 2ab1794 commit ab5669a

21 files changed

+400
-11
lines changed

README.md

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,10 @@ Sourcecode for www.castlecss.com and the documentation for [CastleCSS](https://g
88
- Download or clone this package
99
- Look in the dist/ folder or build if yourself with GruntJS in your terminal: ```npm install``` + ```grunt```
1010

11-
## Roadmap CastleCSS
12-
You can find the roadmap in the [CastleCSS Meta Package](https://github.com/CastleCSS/castlecss/roadmap.md).
11+
## Roadmap
12+
We're currently working hard on making the CastleCSS expansions and improvements. CastleCSS is made to serve as lightweight basis for tailor made software but we do want to give you the option to install a few modules to make your life easier.
13+
14+
Please see the [ROADMAP.MD](https://github.com/CastleCSS/castlecss/blob/master/ROADMAP.md) for our current plans for the future.
15+
16+
## Contributing
17+
Want to contribute? We'd love your help, please take a look at the roadmap or submit new suggestions.

dist/about.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

dist/breadcrumbs.html

Lines changed: 241 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,241 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<title>Breadcrumbs - CastleCSS</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, maximum-scale=1" />
7+
<link rel="stylesheet" href="css/styles.min.css" />
8+
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css' />
9+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js" type="text/javascript"></script>
10+
</head>
11+
12+
<body>
13+
14+
<!-- Google Tag Manager -->
15+
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-N85PTX"
16+
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
17+
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
18+
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
19+
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
20+
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
21+
})(window,document,'script','dataLayer','GTM-N85PTX');</script>
22+
23+
<div id="wrapper" class="wrapper ">
24+
25+
<div class="g full-height">
26+
27+
<!-- Side -->
28+
<div class="b0_12 b4_08 b5_06 b6_04">
29+
<!-- End Google Tag Manager -->
30+
<header id="header" class="nav-container">
31+
<div class="nav-label">menu</div>
32+
<a class="nav-logo p-b4-3x" href="index.html"><img src="img/logo-castlecss.png"></a>
33+
<div class="nav-wrap pl-3x pr-3x">
34+
35+
<ul class="doc-menu list-unstyled">
36+
37+
<li><a href="/about.html" >About CastleCSS</a>
38+
39+
</li>
40+
41+
<li><a href="/installation.html" >Installation</a>
42+
43+
</li>
44+
45+
<li><a href="/variables.html" >Variables</a>
46+
47+
</li>
48+
49+
<li><a href="/grid.html" >Breakpoints &amp; Grid</a>
50+
51+
<ul class="list-unstyled">
52+
53+
<li><a href="grid.html#basicexamples">The basics</a>
54+
55+
<li><a href="grid.html#breakpoints">Breakpoints</a>
56+
57+
<li><a href="grid.html#basicexamples">Basic grid examples</a>
58+
59+
<li><a href="grid.html#gutters">Gutters</a>
60+
61+
<li><a href="grid.html#directionalignment">Direction and alignment</a>
62+
63+
</ul>
64+
65+
</li>
66+
67+
<li><a href="/utility.html" >Utility classes</a>
68+
69+
</li>
70+
71+
<li><a href="/utility_spacers.html" >Utility spacers</a>
72+
73+
</li>
74+
75+
<li><a href="/icons.html" >Icons</a>
76+
77+
</li>
78+
79+
<li><a href="/buttons.html" >Buttons</a>
80+
81+
</li>
82+
83+
<li><a href="/notifications.html" >Notifications / alerts</a>
84+
85+
</li>
86+
87+
<li><a href="/breadcrumbs.html" class="active">Breadcrumbs</a>
88+
89+
</li>
90+
91+
<li><a href="/mixins.html" >Mixins</a>
92+
93+
</li>
94+
95+
</ul>
96+
</div>
97+
98+
99+
100+
</header>
101+
102+
</div>
103+
<!-- End side -->
104+
105+
106+
<!-- Main -->
107+
<div class="b0_12 b4_14 b4_push_01">
108+
<div class="p p-b3-3x">
109+
<div class="block">
110+
<h1>Breadcrumbs</h1>
111+
<p class="intro">Make sure your visitors never get lost</p>
112+
<p class="alert">
113+
Note: You need castlecss-breadcrumbs or the <a href="https://github.com/CastleCSS/castlecss-boilerplate" target="_blank">castlecss-boilerplate</a> for this.
114+
</p>
115+
<p>Feel free to use these breadcrumbs to get you started. Create your own breadcrumbs.scss to overwrite the standard breadcrumbs or edit your <a href="variables.html">variables document</a> for different colors/styles.</p>
116+
</div>
117+
118+
<div class="block pt tb">
119+
<h2>Example</h2>
120+
<nav class="breadcrumbs">
121+
<ol class="breadcrumbs-wrap">
122+
<li class="breadcrumb breadcrumb-home">
123+
<a href="/"><span>Home</span></a>
124+
</li>
125+
<li class="breadcrumb">
126+
<a href="/category/"><span>Main category</span></a>
127+
</li>
128+
<li class="breadcrumb">
129+
<a href="/category/sub-category/"><span>Sub category</span></a>
130+
</li>
131+
<li class="breadcrumb breadcrumb-current">
132+
<a href="/category/sub-category/this-page/">This page</a>
133+
</li>
134+
</ol>
135+
</nav>
136+
137+
</div>
138+
139+
<div class="mb-2x">
140+
<pre class="brush: xml;">
141+
<nav class="breadcrumbs">
142+
<ol class="breadcrumbs-wrap">
143+
<li class="breadcrumb breadcrumb-home">
144+
<a href="/"><span>Home</span></a>
145+
</li>
146+
<li class="breadcrumb">
147+
<a href="/category/"><span>Main category</span></a>
148+
</li>
149+
<li class="breadcrumb">
150+
<a href="/category/sub-category/"><span>Sub category</span></a>
151+
</li>
152+
<li class="breadcrumb breadcrumb-current">
153+
<a href="/category/sub-category/this-page/">This page</a>
154+
</li>
155+
</ol>
156+
</nav></pre>
157+
</div>
158+
159+
<div class="block mt-2x">
160+
<h2>Options</h2>
161+
<h3>Changing the breadcrumb separator</h3>
162+
<p>
163+
The default separator between the breadcrumbs is the double arrow <code>&raquo;</code>. <br />
164+
To set a different character as your separator for all crumbs, please overwrite the variable <code>$breadcrumbs-separator</code>.
165+
</p>
166+
<p>
167+
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.
168+
</p>
169+
<p>
170+
<strong>Example:</strong> <code>data-breadcrumbs-separator="/"</code> sets a / as separator
171+
</p>
172+
</div>
173+
<div class="block">
174+
<h3>Breadcrumbs font-size</h3>
175+
<table class="specs">
176+
<tr>
177+
<th>Class</th>
178+
<th>Value</th>
179+
</tr>
180+
<tr>
181+
<td><code>breadcrumbs</code></td>
182+
<td><a href="/variables.html">$font-size-default</a></td>
183+
</tr>
184+
<tr>
185+
<td><code>breadcrumbs-small</code></td>
186+
<td>font-size: 1.4rem;</td>
187+
</tr>
188+
</table>
189+
</div>
190+
<div class="block">
191+
<h2>Seo</h2>
192+
<p>Please take a look at the <a href="https://developers.google.com/search/docs/data-types/breadcrumbs" target="_blank">Google Developer</a> website for making breadcrumbs SEO friendly</p>
193+
</div>
194+
</div>
195+
</div>
196+
<!-- End main -->
197+
198+
<!-- Scripts for documentation -->
199+
<footer id="footer">
200+
201+
</footer>
202+
<script>
203+
$(function () {
204+
navOpen();
205+
206+
window.onscroll = function(e) {
207+
offSetManager();
208+
}
209+
});
210+
211+
function offSetManager(){
212+
213+
var yOffset = 110;
214+
var currYOffSet = window.pageYOffset;
215+
var menuHeight = $('.doc-menu').height();
216+
var windowHeight = $(window).height();
217+
218+
if((yOffset < currYOffSet) && (menuHeight < windowHeight)) {
219+
$('.nav-wrap').addClass('fixed');
220+
} else if(yOffset > currYOffSet){
221+
$('.nav-wrap').removeClass('fixed');
222+
}
223+
}
224+
225+
function navOpen() {
226+
$('.nav-label, .open-documentation').on('click', function(e) {
227+
$('.nav-container').toggleClass('nav-container-active');
228+
e.preventDefault();
229+
});
230+
}
231+
232+
</script>
233+
234+
<script src="js/shCore.js"></script>
235+
<script src="js/shBrushXml.js"></script>
236+
<script src="js/shBrushSass.js"></script>
237+
<script src="js/shBrushJScript.js"></script>
238+
<script type="text/javascript">SyntaxHighlighter.all();</script>
239+
<script async defer src="https://buttons.github.io/buttons.js"></script>
240+
</body>
241+
</html>

dist/buttons.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

dist/css/styles.min.css

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/css/styles.min.css.map

Lines changed: 3 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/grid.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

dist/icons.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

dist/index.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

dist/installation.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,10 @@
8181

8282
</li>
8383

84+
<li><a href="/breadcrumbs.html" >Breadcrumbs</a>
85+
86+
</li>
87+
8488
<li><a href="/mixins.html" >Mixins</a>
8589

8690
</li>

0 commit comments

Comments
 (0)