Skip to content

Commit 4e7a7ce

Browse files
author
Darius Rosendahl
committed
Merge branch 'release/Release_for_1.1.0'
2 parents 2dd2182 + aae6c01 commit 4e7a7ce

File tree

7 files changed

+122
-40
lines changed

7 files changed

+122
-40
lines changed

dist/css/styles.min.css

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/css/styles.min.css.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

index.html

+34-14
Original file line numberDiff line numberDiff line change
@@ -56,21 +56,21 @@ <h1>Hello, world!</h1>
5656
<div class="b0_12 b3_08">
5757
<div class="pt pb">
5858
<h2>Heading</h2>
59-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
59+
<p><i class="fa fa-pied-piper"></i>&nbsp;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
6060
<a href="#">Read more</a>
6161
</div>
6262
</div>
6363
<div class="b0_12 b3_08">
6464
<div class="pt pb">
6565
<h2>Heading</h2>
66-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
66+
<p><i class="fa fa-info-circle"></i>&nbsp;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
6767
<a href="#">Read more</a>
6868
</div>
6969
</div>
7070
<div class="b0_12 b3_08">
7171
<div class="pt pb">
7272
<h2>Heading</h2>
73-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
73+
<p><i class="fa fa-binoculars"></i>&nbsp;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. </p>
7474
<a href="#">Read more</a>
7575
</div>
7676
</div>
@@ -100,31 +100,51 @@ <h2 class="mt-0">Menu</h2>
100100
<h1 class="mt-0">Basic layout</h1>
101101

102102
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
103-
103+
<div class="alert mb">
104+
<i class="fa fa-info-circle"></i>&nbsp;Friendly alert
105+
</div>
104106
<h2>Header Level 2</h2>
105107
<ol>
106108
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
107109
<li>Aliquam tincidunt mauris eu risus.</li>
108110
</ol>
109-
110111
<blockquote>
111112
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
112113
</blockquote>
114+
<div class="alert-warning mb">
115+
<i class="fa fa-warning"></i>&nbsp;This is a warning with a <a href="#">link</a>!
116+
</div>
113117

114-
<h3>Header Level 3</h3>
118+
<h3 class="head2">Header Level 3 met .head2 styling</h3>
115119
<ul>
120+
<li>By using .head, .head1, .head2, etc you can use heading styling on any element you want</li>
116121
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
117122
<li>Aliquam tincidunt mauris eu risus.</li>
118123
</ul>
119124

120-
<!-- Standard buttons -->
121-
<h2>Standard buttons</h2>
122-
<a href="#" class="btn mb">standard button</a></li>
123-
<a href="#" class="btn-theme01 mb">btn-theme01</a>
124-
<a href="#" class="btn-theme02 mb">btn-theme02</a>
125-
<a href="#" class="btn-theme03 mb">btn-theme03</a>
126-
<a href="#" class="btn-theme04 mb">btn-theme04</a>
127-
<a href="#" class="btn-theme05 mb">btn-theme05</a>
125+
<div class="mb-3x">
126+
<!-- Standard buttons -->
127+
<h2 class="head2">Standard buttons</h2>
128+
<a href="#" class="btn mb">standard button</a></li>
129+
<a href="#" class="btn-theme01 mb">btn-theme01</a>
130+
<a href="#" class="btn-theme02 mb">btn-theme02</a>
131+
<a href="#" class="btn-theme03 mb">btn-theme03</a>
132+
<a href="#" class="btn-theme04 mb">btn-theme04</a>
133+
<a href="#" class="btn-theme05 mb">btn-theme05</a>
134+
</div>
135+
136+
<div class="mb-3x">
137+
<h2 class="head2">Example buttons with icons</h2>
138+
<div class="g mb-3x">
139+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn btn-full mb"><i class="fa fa-angle-right"></i> Read more</a></div>
140+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn-theme01 btn-full mb"><i class="fa fa-edit"></i> Edit</a></div>
141+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn-theme02 btn-full mb"><i class="fa fa-cloud"></i> Cloud</a></div>
142+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn-theme03 btn-full mb"><i class="fa fa-globe"></i> Globe</a></div>
143+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn-theme04 btn-full mb"><i class="fa fa-spinner fa-spin"></i> Spin</a></div>
144+
<div class="b0_12 b2_06 b6_04"><a href="#" class="btn-theme05 btn-full mb"><i class="fa fa-list"></i> List</a></div>
145+
</div>
146+
</div>
147+
</div>
128148
</div>
129149
</div>
130150
</div>

package.json

+8-7
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "castlecss-boilerplate",
3-
"version": "1.0.1",
4-
"description": "Boilerplate for CastleCSS",
3+
"version": "1.1.0",
4+
"description": "HMTL5/CSS Boilerplate with CastleCSS",
55
"main": "index.js",
66
"scripts": {
77
"test": "echo \"Error: no test specified\" && exit 1"
@@ -11,7 +11,7 @@
1111
"url": "git+https://github.com/CastleCSS/castlecss-boilerplate.git"
1212
},
1313
"keywords": [
14-
"boilerplate",
14+
"boilerplate",
1515
"castlecss",
1616
"castle",
1717
"css",
@@ -28,17 +28,18 @@
2828
},
2929
"homepage": "http://www.castlecss.com",
3030
"dependencies": {
31-
"castlecss-buttons": "^0.4.1",
32-
"castlecss-core": "^2.0.1",
33-
"castlecss-notifications": "^0.3.0"
31+
"castlecss-buttons": "^0.5.0",
32+
"castlecss-core": "^2.1.0",
33+
"castlecss-icons": "^1.0.2",
34+
"castlecss-notifications": "^1.0.0"
3435
},
3536
"devDependencies": {
3637
"autoprefixer": "^6.3.6",
3738
"cssnano": "^3.7.3",
3839
"grunt": "^1.0.1",
3940
"grunt-contrib-watch": "~1.0.0",
4041
"grunt-postcss": "^0.8.0",
41-
"grunt-sass": "^1.0.0",
42+
"grunt-sass": "^2.0.0",
4243
"jit-grunt": "^0.10.0",
4344
"pixrem": "^3.0.0"
4445
}

scss/layout/example.hero.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Basic hero styling for demo purposes
22
.hero {
33
background: $theme04;
4-
color: $color01;
4+
color: $theme02;
55
padding: $padding-default*6 0;
66
margin-bottom: $margin-default;
77

scss/main.scss

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
@import "node_modules/castlecss-core/sass/main";
99
@import "node_modules/castlecss-buttons/sass/main";
1010
@import "node_modules/castlecss-notifications/sass/main";
11+
@import "node_modules/castlecss-icons/sass/main";
1112

1213
/* Include your own files below this line
1314
--------------------------------------

scss/variables.scss

+76-16
Original file line numberDiff line numberDiff line change
@@ -3,35 +3,69 @@
33
EDIT YOUR SITE VARIABLES HERE
44
*/
55

6+
/*
7+
---------- VARIABLES ----------
8+
Castlecss-core variables
9+
Do not edit this file!
10+
Create a copy and edit or add your own variables there
11+
or download the boilerplate for a ready-to-go setup here: https://github.com/CastleCSS/castlecss-boilerplate
12+
-------------------------------
13+
*/
14+
615
/*
716
Base colors
817
Color 01 and 02 reservered for white and black
918
*/
1019
$color03: #eeeeee;
1120
$color04: #222222;
12-
$radius: 3px;
1321

14-
/* Theme colors */
22+
/*
23+
Theme colors
24+
*/
1525
$theme01: #1B94BF; // Knight blue
1626
$theme02: #093142; // Royal blue
1727
$theme03: #12637F; // Falcon blue
1828
$theme04: #FFC200; // Royal yellow
1929
$theme05: #FFFFFF; // Destroyer white
2030

21-
$alert: #FFD700;
22-
$negative: #FF7878;
23-
$positive: #29C85D;
31+
/*
32+
Notification colors
33+
*/
34+
$alert: #c0dbff;
35+
$warning: #ffe283;
36+
$negative: #feb3b3;
37+
$positive: #c3e5cd;
2438
$disabled: #CDCDC1;
2539

26-
/* Breakpoints */
40+
/*
41+
Breakpoints
42+
You can edit or add breakpoints
43+
*/
2744
$b1: 320px;
2845
$b2: 480px;
2946
$b3: 768px;
3047
$b4: 1024px;
3148
$b5: 1280px;
3249
$b6: 1600px;
3350

34-
/* Container sizes */
51+
/*
52+
Mapping for breakpoint loops
53+
Must be the same amount as breakpoints above
54+
*/
55+
$breakpoint-map: (
56+
1: $b1,
57+
2: $b2,
58+
3: $b3,
59+
4: $b4,
60+
5: $b5,
61+
6: $b6,
62+
);
63+
$amount-breakpoints: length($breakpoint-map);
64+
65+
/*
66+
Container sizes
67+
Must be the same amount of breakpoints and $breakpoint-map as above
68+
*/
3569
$container: 100%;
3670
$container-b1: 100%;
3771
$container-b2: 100%;
@@ -40,8 +74,28 @@ $container-b4: 996px;
4074
$container-b5: 1224px;
4175
$container-b6: 1400px;
4276

43-
/* Grid */
77+
/*
78+
Container map
79+
Must be the same amount of breakpoints and $breakpoint-map as above
80+
*/
81+
$container-map: (
82+
1: $container-b1,
83+
2: $container-b2,
84+
3: $container-b3,
85+
4: $container-b4,
86+
5: $container-b5,
87+
6: $container-b6,
88+
);
89+
90+
/*
91+
Flexbox grid, set to true or false for flexbox
92+
*/
4493
$flexbox-grid: true;
94+
95+
/*
96+
Grid gutters
97+
Must be the same amount of breakpoints $breakpoint-map as above
98+
*/
4599
$grid-gutter: 12px;
46100
$grid-gutter-b1: 12px;
47101
$grid-gutter-b2: 12px;
@@ -50,16 +104,22 @@ $grid-gutter-b4: 12px;
50104
$grid-gutter-b5: 12px;
51105
$grid-gutter-b6: 12px;
52106

53-
/* Default margin, padding, gutter */
107+
/*
108+
Default margin and padding
109+
*/
110+
54111
$padding-default: 12px;
55112
$margin-default: 12px;
56113

57-
/* Standard border-radius */
58-
$radius: 5px;
59-
60-
/* Fonts */
61-
$font-pri: 'Open Sans', Helvetica, Arial;
62-
$font-sec: 'Open Sans', Helvetica, Arial;
114+
/*
115+
Standard border-radius
116+
*/
117+
$radius: 3px;
63118

119+
/*
120+
Fonts
121+
*/
122+
$font-pri: Arial, Helvetica, sans-serif;
123+
$font-sec: Arial, Helvetica, sans-serif;
64124
$font-size-default: 1.6rem;
65-
$line-height-default: 1.5;
125+
$line-height-default: 1.5;

0 commit comments

Comments
 (0)