Update _settings.scss as per Foundation 5.2

Gruntfile.js

@@ -138,5 +138,5 @@ module.exports = function(grunt) {
    // grunt.registerTask('default', ['wordpressdeploy']);

    // Register Task
    grunt.registerTask('default', ['fontello', 'imagemin', 'watch']);
    grunt.registerTask('default', ['fontello', 'watch']);
};

assets/rtpanel/scss/_settings.scss

@@ -13,7 +13,7 @@
// $experimental: true;

// The default font-size is set to 100% of the browser style sheet (usually 16px)
// for compatibility with brower-based text zoom or user-set defaults.
// for compatibility with browser-based text zoom or user-set defaults.

// Since the typical default browser font-size is 16px, that makes the calculation for grid size.
// If you want your base font-size to be different and not have it affect the grid breakpoints,
@@ -34,6 +34,7 @@ $rem-base: 16px;
// Grid

// $include-html-grid-classes: $include-html-classes;
// $include-xl-html-grid-classes: false;

$row-width: rem-calc(1200);
$column-gutter: rem-calc(20);
@@ -103,42 +104,54 @@ $global-radius: 5px;
// $xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})";
// $xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";

// Legacy
// $small: $medium-up;
// $medium: $medium-up;
// $large: $large-up;

//We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet
// $cursor-crosshair-value: crosshair;
// $cursor-default-value: default;
// $cursor-pointer-value: pointer;
// $cursor-help-value: help;
// $cursor-text-value: text;

//
// Typography Variables
// TYPOGRAPHY
//

// Control header font styles
// $include-html-type-classes: $include-html-classes;

// We use these to control header font styles
$header-font-family: 'Open Sans', sans-serif;
$header-font-weight: 400;
// $header-font-style: normal;
// $header-font-color: #222;
// $header-line-height: 1.4;
// $header-top-margin: .2em;
// $header-bottom-margin: .5em;
// $header-top-margin: .2rem;
// $header-bottom-margin: .5rem;
// $header-text-rendering: optimizeLegibility;

// Control header font sizes

// We use these to control header font sizes
$h1-font-size: rem-calc(34);
$h2-font-size: rem-calc(28);
$h3-font-size: rem-calc(24);
$h4-font-size: rem-calc(20);
$h5-font-size: rem-calc(18);
$h6-font-size: rem-calc(14);

// Control how subheaders are styled.

// These control how subheaders are styled.
// $subheader-line-height: 1.4;
// $subheader-font-color: lighten($header-font-color, 30%);
// $subheader-font-color: scale-color($header-font-color, $lightness: 35%);
// $subheader-font-weight: 300;
// $subheader-top-margin: .2em;
// $subheader-bottom-margin: .5em;
// $subheader-top-margin: .2rem;
// $subheader-bottom-margin: .5rem;

// A general <small> styling
// $small-font-size: 60%;
// $small-font-color: scale-color($header-font-color, $lightness: 35%);

// Style paragraphs

// We use these to style paragraphs
// $paragraph-font-family: inherit;
// $paragraph-font-weight: inherit;
// $paragraph-font-size: 1em;
@@ -149,33 +162,65 @@ $paragraph-margin-bottom: rem-calc(28);
// $paragraph-aside-font-style: italic;
// $paragraph-text-rendering: optimizeLegibility;

// We use these to style <code> tags
// $code-color: scale-color($alert-color, $lightness: -27%);
// $code-font-family: Consolas, 'Liberation Mono', Courier, monospace;
// $code-font-weight: bold;

// Style the <hr> element
// We use these to style anchors
// $anchor-text-decoration: none;
// $anchor-font-color: $primary-color;
// $anchor-font-color-hover: scale-color($primary-color, $lightness: -14%);

// We use these to style the <hr> element
// $hr-border-width: 1px;
$hr-border-style: dotted;
$hr-border-color: $border-color;
$hr-margin: rem-calc(30);

// We use these to style lists
// $list-style-position: outside !default;
// $list-style-position: outside;
$list-side-margin: 2rem;
$list-ordered-side-margin: 2rem;
// $list-side-margin-no-bullet: 0 !default;
// $list-nested-margin: rem-calc(20) !default;
// $list-side-margin-no-bullet: 0;
// $list-nested-margin: rem-calc(20);
// $definition-list-header-weight: bold;
// $definition-list-header-margin-bottom: .3rem;
// $definition-list-margin-bottom: rem-calc(12);

// We use these to style blockquotes
// $blockquote-font-color: scale-color($header-font-color, $lightness: 35%);
// $blockquote-padding: rem-calc(9 20 0 19);
// $blockquote-border: 1px solid #ddd;
// $blockquote-cite-font-size: rem-calc(13);
// $blockquote-cite-font-color: scale-color($header-font-color, $lightness: 23%);
// $blockquote-cite-link-color: $blockquote-cite-font-color;

// Acronym styles
// $acronym-underline: 1px dotted #ddd;

// We use these to control padding and margin
// $microformat-padding: rem-calc(10 12);
// $microformat-margin: rem-calc(0 0 20 0);

// We use these to control the border styles
// $microformat-border-width: 1px;
// $microformat-border-style: solid;
// $microformat-border-color: #ddd;

// Legacy
// $small: $medium-up;
// $medium: $medium-up;
// $large: $large-up;
// We use these to control full name font styles
// $microformat-fullname-font-weight: bold;
// $microformat-fullname-font-size: rem-calc(15);

// We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet
// $cursor-crosshair-value: crosshair;
// $cursor-default-value: default;
// $cursor-pointer-value: pointer;
// $cursor-help-value: help;
// $cursor-text-value: text;
// We use this to control the summary font styles
// $microformat-summary-font-weight: bold;

// We use this to control abbr padding
// $microformat-abbr-padding: rem-calc(0 1);

// We use this to control abbr font styles
// $microformat-abbr-font-weight: bold;
// $microformat-abbr-font-decoration: none;

// Accordion

@@ -443,8 +488,9 @@ $button-margin-bottom: rem-calc(10);
// $form-label-pointer: pointer;
// $form-label-font-size: rem-calc(14);
// $form-label-font-weight: normal;
// $form-label-line-height: 1.5;
// $form-label-font-color: scale-color(#000, $lightness: 30%);
// $form-label-bottom-margin: rem-calc(8);
// $form-label-bottom-margin: 0;
// $input-font-family: inherit;
// $input-font-color: rgba(0,0,0,0.75);
// $input-font-size: rem-calc(14);
@@ -454,6 +500,7 @@ $button-margin-bottom: rem-calc(10);
// $input-focus-border-color: scale-color(#fff, $lightness: -40%);
// $input-border-style: solid;
// $input-border-width: 1px;
// $input-border-radius: $global-radius;
// $input-disabled-bg: #ddd;
// $input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
// $input-include-glowing-effect: true;
@@ -864,7 +911,8 @@ $button-margin-bottom: rem-calc(10);

// We use these to control link styles.
// $side-nav-link-color: $primary-color;
// $side-nav-link-color-active: scale-color(#000, $lightness: 30%);
// $side-nav-link-color-active: scale-color($side-nav-link-color, $lightness: 30%);
// $side-nav-link-color-hover: scale-color($side-nav-link-color, $lightness: 30%);
// $side-nav-font-size: rem-calc(14);
// $side-nav-font-weight: normal;
// $side-nav-font-family: $body-font-family;
@@ -1075,6 +1123,7 @@ $button-margin-bottom: rem-calc(10);
// $tooltip-close-font-color: #777;
// $tooltip-font-size-sml: rem-calc(14);
// $tooltip-radius: $global-radius;
// $tooltip-rounded: $global-rounded;
// $tooltip-pip-size: 5px;

//
@@ -1108,15 +1157,19 @@ $button-margin-bottom: rem-calc(10);
// $topbar-link-color: #fff;
// $topbar-link-color-hover: #fff;
// $topbar-link-color-active: #fff;
// $topbar-link-color-active-hover: #fff;
// $topbar-link-weight: normal;
// $topbar-link-font-size: rem-calc(13);
// $topbar-link-hover-lightness: -10%; // Darken by 10%
// $topbar-link-bg-hover: #272727  ;
// $topbar-link-bg-hover: #272727;
// $topbar-link-bg-active: $primary-color;
// $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%);
// $topbar-link-font-family: $body-font-family;
// $topbar-link-text-transform: none;
// $topbar-link-padding: $topbar-height / 3;

// $topbar-button-font-size: 0.75rem;
// $topbar-button-top: 7px;

// $topbar-dropdown-label-color: #777;
// $topbar-dropdown-label-text-transform: uppercase;
@@ -1146,3 +1199,11 @@ $button-margin-bottom: rem-calc(10);
// Sticky Class
// $topbar-sticky-class: ".sticky";
// $topbar-arrows: true; //Set false to remove the triangle icon from the menu item

//
// VISIBILITY CLASSES
//

// $include-html-visibility-classes: $include-html-classes;
// $include-table-visibility-classes: true;
// $include-legacy-visibility-classes: true;