Main.scss order

Changed order in main.scss so utility classes can overwrite the grid

v1.7.0

Now it's also possible to use float, clear and use text-alignment classes per breakpoint! No longer any need to dirty your SCSS files!

How?

<what you want to do><-breakpoint>
ta-center-b2 (text-align: center; upward of breakpoint 2)
fl-b3 (float: left; upward of breakpoint 3)

More examples:

<div class="fl cl ta-center fr-b3 ta-left-b3">Hello world</div>

This does the following:

• float: right; text-align: left;
• float: left; clear: left; text-align: center; from b3 and up (768px, tablet portait):

All without dirtying your own SCSS files! It's really easy once you get the hang of it.

Remember:

<what you want to do><-breakpoint>

Seperate variable file and grid / container fixes

We just had a busy morning, while working on our own projects we encountered some issues / needed improvements:

• Fixed container and grid widths/gutters per breakpoint. We now support a minimum of 6 breakpoints
• Put the grid variables in variables.scss
• We separated the variable file, it's no longer in base/ or included in main.scss
  Why? Otherwise you can't overwrite the variables in your own project. Your main.scss could/should look similar to this if you want to use your own variables:

    @import 'node_modules/castlecss-core/sass/variables'; core variables
    @import 'base/variables';  // own variables
    @import '/node_modules/castlecss-core/sass/main'; //rest of core files

Included commits:
a1c432b Changed container variables to proper name. Added default container, b1 and b2 container. Changed gutter variables so they can be overwritten per breakpoint
35b2d48 Grid fixes: gutter per breakpoint, b6 widths
056f279 Added container and gutter for b6
VARIABLES NO LONGER IN MAIN.SCSS | Changed $flexbox to $grid-flexbox | Added .gitignore

v1.4.1

Added $b6 spacers. Max-width images, default links, added and correct…

New logo and theme colors

We got a new logo! Check it out:

We also added the following theme colors:
$theme01: #1B94BF; // Knight blue
$theme02: #093142; // Royal blue
$theme03: #12637F; // Falcon blue
$theme04: #FFC200; // Royal yellow
$theme05: #FFFFFF; // Destroyer white

Font-size fix

We're using the REM method in CastleCSS.

HTML has 62.5% font-size so you can easily use REM like this:

p {
// 10 relative pixels
font-size: 1rem
}

code {
// 15 relative pixels
font-size: 1.5rem
}

There was a bug in castlecss-core, fixed this in 1.3.1

Unstyled list and text-alignment classes

1.3.0

Text-align and border-radius classes

Divided all files into folders

• Added static_content to main.scss
• Put all files in base/ and layout/ folders