mirror of
https://github.com/hacks-guide/Guide_3DS.git
synced 2025-08-30 11:49:52 +02:00
mm upgrade and feature updates
This commit is contained in:
Plailect
@@ -1,153 +0,0 @@
|
||||
/* ==========================================================================
|
||||
BUTTONS
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Default button
|
||||
========================================================================== */
|
||||
|
||||
.btn {
|
||||
/* default button */
|
||||
display: inline-block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
color: #fff !important;
|
||||
font-family: $sans-serif;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
background-color: $primary-color;
|
||||
border: 0 !important;
|
||||
border-radius: $border-radius;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(white, #000, 20%);
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.icon + .hidden {
|
||||
margin-left: -0.5em; /* override for hidden text*/
|
||||
}
|
||||
|
||||
/* fills width of parent container */
|
||||
|
||||
&--block {
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
+ .btn--block {
|
||||
margin-top: 0.25em;
|
||||
}
|
||||
}
|
||||
|
||||
/* for dark backgrounds */
|
||||
|
||||
&--inverse {
|
||||
color: $gray !important;
|
||||
border: 1px solid $light-gray !important; /* override*/
|
||||
background-color: #fff;
|
||||
|
||||
&:hover {
|
||||
color: #fff !important;
|
||||
border-color: $gray;
|
||||
}
|
||||
}
|
||||
|
||||
/* light outline */
|
||||
|
||||
&--light-outline {
|
||||
border: 1px solid #fff !important; /* override*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* information */
|
||||
|
||||
&--info {
|
||||
background-color: $info-color;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(#000, $info-color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
/* warning */
|
||||
|
||||
&--warning {
|
||||
background-color: $warning-color;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(#000, $warning-color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
/* success */
|
||||
|
||||
&--success {
|
||||
background-color: $success-color;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(#000, $success-color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
/* danger */
|
||||
|
||||
&--danger {
|
||||
background-color: $danger-color;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(#000, $danger-color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
/* disabled */
|
||||
|
||||
&--disabled {
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
filter: alpha(opacity=65);
|
||||
box-shadow: none;
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
/* social buttons */
|
||||
|
||||
$social:
|
||||
(facebook, $facebook-color),
|
||||
(twitter, $twitter-color),
|
||||
(google-plus, $google-plus-color),
|
||||
(linkedin, $linkedin-color);
|
||||
|
||||
@each $socialnetwork, $color in $social {
|
||||
&--#{$socialnetwork} {
|
||||
background-color: $color;
|
||||
|
||||
&:hover {
|
||||
background-color: mix(#000, $color, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* extra large button */
|
||||
|
||||
&--x-large {
|
||||
font-size: $type-size-4;
|
||||
}
|
||||
|
||||
/* large button */
|
||||
|
||||
&--large {
|
||||
font-size: $type-size-5;
|
||||
}
|
||||
|
||||
/* small button */
|
||||
|
||||
&--small {
|
||||
font-size: $type-size-7;
|
||||
}
|
||||
}
|
||||
@@ -1,552 +0,0 @@
|
||||
/* ==========================================================================
|
||||
NAVIGATION
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Breadcrumb navigation links
|
||||
========================================================================== */
|
||||
|
||||
.breadcrumbs {
|
||||
@include container;
|
||||
@include clearfix;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
font-family: $sans-serif;
|
||||
-webkit-animation: intro 0.3s both;
|
||||
animation: intro 0.3s both;
|
||||
-webkit-animation-delay: 0.30s;
|
||||
animation-delay: 0.30s;
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
max-width: $x-large;
|
||||
}
|
||||
|
||||
ol {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
font-size: $type-size-6;
|
||||
|
||||
@include breakpoint($large) {
|
||||
@include span(10 of 12 last);
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
@include prefix(0.5 of 12);
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.current {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Post pagination navigation links
|
||||
========================================================================== */
|
||||
|
||||
.pagination {
|
||||
@include full();
|
||||
@include clearfix();
|
||||
margin-top: 1em;
|
||||
padding-top: 1em;
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
font-family: $sans-serif;
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: -1px;
|
||||
|
||||
a {
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-family: $sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: mix(#fff, $gray, 25%);
|
||||
border: 1px solid $light-gray;
|
||||
border-radius: 0;
|
||||
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
|
||||
&.current {
|
||||
color: #fff;
|
||||
background: $nord1;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: mix(#fff, $gray, 75%);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
|
||||
a {
|
||||
border-top-left-radius: $border-radius;
|
||||
border-bottom-left-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
a {
|
||||
border-top-right-radius: $border-radius;
|
||||
border-bottom-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* next/previous buttons */
|
||||
&--pager {
|
||||
display: block;
|
||||
padding: 1em 2em;
|
||||
float: left;
|
||||
width: 50%;
|
||||
font-family: $sans-serif;
|
||||
font-size: $type-size-5;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: $link-color;
|
||||
border: 1px solid $light-gray;
|
||||
border-radius: $border-radius;
|
||||
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-left: -1px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: mix(#fff, $gray, 75%);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page__content + .pagination,
|
||||
.page__meta + .pagination,
|
||||
.page__share + .pagination,
|
||||
.page__comments + .pagination {
|
||||
margin-top: 2em;
|
||||
padding-top: 2em;
|
||||
border-top: 1px solid $border-color;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Priority plus navigation
|
||||
========================================================================== */
|
||||
|
||||
.greedy-nav {
|
||||
position: relative;
|
||||
min-width: 250px;
|
||||
background: $nord1;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
margin: 0 1rem;
|
||||
padding: 0.5rem 0;
|
||||
color: $masthead-link-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $masthead-link-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
padding: 0 0.5rem;
|
||||
border: 0;
|
||||
outline: none;
|
||||
background: transparent;
|
||||
color: $nord0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.nav-selector {
|
||||
right: 3rem;
|
||||
}
|
||||
|
||||
.visible-links {
|
||||
display: table;
|
||||
|
||||
li {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
|
||||
&:first-child {
|
||||
font-weight: bold;
|
||||
|
||||
a {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
a {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 4px;
|
||||
background: mix(#fff, $primary-color, 50%);
|
||||
width: 100%;
|
||||
-webkit-transition: $global-transition;
|
||||
transition: $global-transition;
|
||||
-webkit-transform: scaleX(0) translate3d(0, 0 , 0);
|
||||
-ms-transform: scaleX(0) translate3d(0, 0 , 0);
|
||||
transform: scaleX(0) translate3d(0, 0 , 0); /* hide*/
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1); /* reveal*/
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hidden-links {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
margin-top: 15px;
|
||||
padding: 5px;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
background: $nord1;
|
||||
box-shadow: 0 0 10px rgba(#000, 0.25);
|
||||
|
||||
a {
|
||||
margin: 0;
|
||||
padding: 10px 20px;
|
||||
font-size: $type-size-5;
|
||||
|
||||
&:hover {
|
||||
color: $masthead-link-color-hover;
|
||||
background: mix(#000, $primary-color, 75%);
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
right: 14px;
|
||||
width: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 10px 10px;
|
||||
border-color: mix(#000, $border-color, 55%) transparent;
|
||||
display: block;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: 14px;
|
||||
width: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 10px 10px;
|
||||
border-color: #fff transparent;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
border-bottom: 1px solid $nord3;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.links-menu {
|
||||
right: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Navigation list
|
||||
========================================================================== */
|
||||
|
||||
.nav__list {
|
||||
margin-bottom: 1.5em;
|
||||
|
||||
input[type="checkbox"],
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding: 0.5em 2.5em 0.5em 1em;
|
||||
color: $gray;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
border: 1px solid $light-gray;
|
||||
border-radius: $border-radius;
|
||||
z-index: 20;
|
||||
-webkit-transition: 0.2s ease-out;
|
||||
transition: 0.2s ease-out;
|
||||
cursor: pointer;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
top: 1.25em;
|
||||
width: 0.75em;
|
||||
height: 0.125em;
|
||||
line-height: 1;
|
||||
background-color: $gray;
|
||||
transition: 0.2s ease-out;
|
||||
}
|
||||
|
||||
&:after {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
border-color: $gray;
|
||||
background-color: mix(white, #000, 20%);
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* selected*/
|
||||
input:checked + label {
|
||||
color: white;
|
||||
background-color: mix(white, #000, 20%);
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// on hover show expand
|
||||
label:hover:after {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
input:checked + label:hover:after {
|
||||
transform: rotate(0);
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 0.25em 0;
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding-top: 0.125em;
|
||||
padding-bottom: 0.125em;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav__list .nav__items {
|
||||
margin: 0;
|
||||
font-size: 1.25rem;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.active {
|
||||
margin-left: -0.5em;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
background: $primary-color;
|
||||
border-radius: $border-radius;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
position: relative;
|
||||
max-height: 0;
|
||||
opacity: 0%;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
-webkit-transition: 0.3s ease-in-out;
|
||||
transition: 0.3s ease-in-out;
|
||||
-webkit-transform: translate(0, 10%);
|
||||
-ms-transform: translate(0, 10%);
|
||||
transform: translate(0, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
.nav__list input:checked ~ .nav__items {
|
||||
-webkit-transition: 0.5s ease-in-out;
|
||||
transition: 0.5s ease-in-out;
|
||||
max-height: 9999px; // exaggerate max-height to accommodate tall lists
|
||||
overflow: visible;
|
||||
opacity: 1;
|
||||
margin-top: 1em;
|
||||
-webkit-transform: translate(0, 0);
|
||||
-ms-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.nav__title {
|
||||
margin: 0;
|
||||
padding: 0.5rem 1rem;
|
||||
font-family: $sans-serif-narrow;
|
||||
font-size: $type-size-5;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.nav__sub-title {
|
||||
display: block;
|
||||
margin: 0.5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
font-family: $sans-serif-narrow;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
border-bottom: 1px solid $border-color;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Table of contents navigation
|
||||
========================================================================== */
|
||||
|
||||
.toc {
|
||||
font-family: $sans-serif-narrow;
|
||||
color: $gray;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
background-color: #fff;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
box-shadow: $box-shadow;
|
||||
|
||||
.nav__title {
|
||||
color: #fff;
|
||||
font-size: $type-size-6;
|
||||
background: $primary-color;
|
||||
border-top-left-radius: $border-radius;
|
||||
border-top-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
.toc__menu {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
font-size: 0.8rem;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 0.5rem 1rem;
|
||||
color: $gray;
|
||||
font-size: $type-size-7;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
border-bottom: 1px solid $border-color;
|
||||
|
||||
&:hover {
|
||||
color: #000;
|
||||
background: $lighter-gray;
|
||||
}
|
||||
}
|
||||
|
||||
> li:last-child {
|
||||
a {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
li ul > li a {
|
||||
padding-left: 2rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/* hide sub sub links on small screens*/
|
||||
li > ul li {
|
||||
display: none;
|
||||
|
||||
@include breakpoint($medium) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
241
_sass/_nord.scss
241
_sass/_nord.scss
@@ -1,241 +0,0 @@
|
||||
//
|
||||
// ++++++++++++++++++++++++++++++++++++++++++++++++++++
|
||||
// title Nord +
|
||||
// project nord +
|
||||
// version 0.2.0 +
|
||||
// repository https://github.com/arcticicestudio/nord +
|
||||
// author Arctic Ice Studio +
|
||||
// email development@arcticicestudio.com +
|
||||
// copyright Copyright (C) 2017 +
|
||||
// ++++++++++++++++++++++++++++++++++++++++++++++++++++
|
||||
//
|
||||
// [References]
|
||||
// Sass
|
||||
// (http://sass-lang.com)
|
||||
// SassDoc
|
||||
// (http://sassdoc.com)
|
||||
|
||||
////
|
||||
/// An arctic, north-bluish color palette.
|
||||
/// Created for the clean- and minimal flat design pattern to achieve a optimal focus and readability for code syntax
|
||||
/// highlighting and UI.
|
||||
/// It consists of a total of sixteen, carefully selected, dimmed pastel colors for a eye-comfortable, but yet colorful
|
||||
/// ambiance.
|
||||
///
|
||||
/// @author Arctic Ice Studio <development@arcticicestudio.com>
|
||||
////
|
||||
|
||||
/// Base component color of "Polar Night".
|
||||
///
|
||||
/// Used for texts, backgrounds, carets and structuring characters like curly- and square brackets.
|
||||
///
|
||||
/// @access public
|
||||
/// @example scss - SCSS
|
||||
/// /* For dark ambiance themes */
|
||||
/// .background {
|
||||
/// background-color: $nord0;
|
||||
/// }
|
||||
/// /* For light ambiance themes */
|
||||
/// .text {
|
||||
/// color: $nord0;
|
||||
/// }
|
||||
/// @group polarnight
|
||||
/// @since 0.1.0
|
||||
$nord0: #2E3440;
|
||||
|
||||
/// Lighter shade color of the base component color.
|
||||
///
|
||||
/// Used as a lighter background color for UI elements like status bars.
|
||||
///
|
||||
/// @access public
|
||||
/// @group polarnight
|
||||
/// @see $nord0
|
||||
/// @since 0.1.0
|
||||
$nord1: #3B4252;
|
||||
|
||||
/// Lighter shade color of the base component color.
|
||||
///
|
||||
/// Used as line highlighting in the editor.
|
||||
/// In the UI scope it may be used as selection- and hightlight color.
|
||||
///
|
||||
/// @access public
|
||||
/// @example scss - SCSS
|
||||
/// /* Code Syntax Highlighting scope */
|
||||
/// .editor {
|
||||
/// &.line {
|
||||
/// background-color: $nord2;
|
||||
/// }
|
||||
/// }
|
||||
///
|
||||
/// /* UI scope */
|
||||
/// button {
|
||||
/// &:selected {
|
||||
/// background-color: $nord2;
|
||||
/// }
|
||||
/// }
|
||||
/// @group polarnight
|
||||
/// @see $nord0
|
||||
/// @since 0.1.0
|
||||
$nord2: #434C5E;
|
||||
|
||||
/// Lighter shade color of the base component color.
|
||||
///
|
||||
/// Used for comments, invisibles, indent- and wrap guide marker.
|
||||
/// In the UI scope used as pseudoclass color for disabled elements.
|
||||
///
|
||||
/// @access public
|
||||
/// @example scss - SCSS
|
||||
/// /* Code Syntax Highlighting scope */
|
||||
/// .editor {
|
||||
/// &.indent-guide,
|
||||
/// &.wrap-guide {
|
||||
/// &.marker {
|
||||
/// color: $nord3;
|
||||
/// }
|
||||
/// }
|
||||
/// }
|
||||
/// .comment,
|
||||
/// .invisible {
|
||||
/// color: $nord3;
|
||||
/// }
|
||||
///
|
||||
/// /* UI scope */
|
||||
/// button {
|
||||
/// &:disabled {
|
||||
/// background-color: $nord3;
|
||||
/// }
|
||||
/// }
|
||||
/// @group polarnight
|
||||
/// @see $nord0
|
||||
/// @since 0.1.0
|
||||
$nord3: #4C566A;
|
||||
|
||||
/// Base component color of "Snow Storm".
|
||||
///
|
||||
/// Main color for text, variables, constants and attributes.
|
||||
/// In the UI scope used as semi-light background depending on the theme shading design.
|
||||
///
|
||||
/// @access public
|
||||
/// @example scss - SCSS
|
||||
/// /* For light ambiance themes */
|
||||
/// .background {
|
||||
/// background-color: $nord4;
|
||||
/// }
|
||||
/// /* For dark ambiance themes */
|
||||
/// .text {
|
||||
/// color: $nord4;
|
||||
/// }
|
||||
/// @group snowstorm
|
||||
/// @since 0.1.0
|
||||
$nord4: #D8DEE9;
|
||||
|
||||
/// Lighter shade color of the base component color.
|
||||
///
|
||||
/// Used as a lighter background color for UI elements like status bars.
|
||||
/// Used as semi-light background depending on the theme shading design.
|
||||
///
|
||||
/// @access public
|
||||
/// @group snowstorm
|
||||
/// @see $nord4
|
||||
/// @since 0.1.0
|
||||
$nord5: #E5E9F0;
|
||||
|
||||
/// Lighter shade color of the base component color.
|
||||
///
|
||||
/// Used for punctuations, carets and structuring characters like curly- and square brackets.
|
||||
/// In the UI scope used as background, selection- and hightlight color depending on the theme shading design.
|
||||
///
|
||||
/// @access public
|
||||
/// @group snowstorm
|
||||
/// @see $nord4
|
||||
/// @since 0.1.0
|
||||
$nord6: #ECEFF4;
|
||||
|
||||
/// Bluish core color.
|
||||
///
|
||||
/// Used for classes, types and documentation tags.
|
||||
///
|
||||
/// @access public
|
||||
/// @group frost
|
||||
/// @since 0.1.0
|
||||
$nord7: #8FBCBB;
|
||||
|
||||
/// Bluish core accent color.
|
||||
///
|
||||
/// Represents the accent color of the color palette.
|
||||
/// Main color for primary UI elements and methods/functions.
|
||||
///
|
||||
/// Can be used for
|
||||
/// - Markup quotes
|
||||
/// - Markup link URLs
|
||||
///
|
||||
/// @access public
|
||||
/// @group frost
|
||||
/// @since 0.1.0
|
||||
$nord8: #88C0D0;
|
||||
|
||||
/// Bluish core color.
|
||||
///
|
||||
/// Used for language-specific syntactic/reserved support characters and keywords, operators, tags, units and
|
||||
/// punctuations like (semi)colons,commas and braces.
|
||||
///
|
||||
/// @access public
|
||||
/// @group frost
|
||||
/// @since 0.1.0
|
||||
$nord9: #81A1C1;
|
||||
|
||||
/// Bluish core color.
|
||||
///
|
||||
/// Used for markup doctypes, import/include/require statements, pre-processor statements and at-rules (`@`).
|
||||
///
|
||||
/// @access public
|
||||
/// @group frost
|
||||
/// @since 0.1.0
|
||||
$nord10: #5E81AC;
|
||||
|
||||
/// Colorful component color.
|
||||
///
|
||||
/// Used for errors, git/diff deletion and linter marker.
|
||||
///
|
||||
/// @access public
|
||||
/// @group aurora
|
||||
/// @since 0.1.0
|
||||
$nord11: #BF616A;
|
||||
|
||||
/// Colorful component color.
|
||||
///
|
||||
/// Used for annotations.
|
||||
///
|
||||
/// @access public
|
||||
/// @group aurora
|
||||
/// @since 0.1.0
|
||||
$nord12: #D08770;
|
||||
|
||||
/// Colorful component color.
|
||||
///
|
||||
/// Used for escape characters, regular expressions and markup entities.
|
||||
/// In the UI scope used for warnings and git/diff renamings.
|
||||
///
|
||||
/// @access public
|
||||
/// @group aurora
|
||||
/// @since 0.1.0
|
||||
$nord13: #EBCB8B;
|
||||
|
||||
/// Colorful component color.
|
||||
///
|
||||
/// Main color for strings and attribute values.
|
||||
/// In the UI scope used for git/diff additions and success visualizations.
|
||||
///
|
||||
/// @access public
|
||||
/// @group aurora
|
||||
/// @since 0.1.0
|
||||
$nord14: #A3BE8C;
|
||||
|
||||
/// Colorful component color.
|
||||
///
|
||||
/// Used for numbers.
|
||||
///
|
||||
/// @access public
|
||||
/// @group aurora
|
||||
/// @since 0.1.0
|
||||
$nord15: #B48EAD;
|
||||
@@ -1,18 +0,0 @@
|
||||
/* ==========================================================================
|
||||
PRINT STYLES
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Hide the following elements on print
|
||||
========================================================================== */
|
||||
|
||||
@media print {
|
||||
.masthead,
|
||||
.toc,
|
||||
.page__share,
|
||||
.page__related,
|
||||
.ads,
|
||||
.page__footer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -1,130 +0,0 @@
|
||||
/* ==========================================================================
|
||||
Variables
|
||||
========================================================================== */
|
||||
|
||||
@import "nord";
|
||||
|
||||
/*
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
$doc-font-size : 16 !default;
|
||||
|
||||
/* paragraph indention */
|
||||
$paragraph-indent : false !default; // true, false (default)
|
||||
$indent-var : 1.3em !default;
|
||||
|
||||
/* system typefaces */
|
||||
$serif : Georgia, Times, serif !default;
|
||||
$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif !default;
|
||||
$monospace : Monaco, Consolas, "Lucida Console", monospace !default;
|
||||
|
||||
/* sans serif typefaces */
|
||||
$sans-serif-narrow : $sans-serif !default;
|
||||
$helvetica : Helvetica, "Helvetica Neue", Arial, sans-serif !default;
|
||||
|
||||
/* serif typefaces */
|
||||
$georgia : Georgia, serif !default;
|
||||
$times : Times, serif !default;
|
||||
$bodoni : "Bodoni MT", serif !default;
|
||||
$calisto : "Calisto MT", serif !default;
|
||||
$garamond : Garamond, serif !default;
|
||||
|
||||
$global-font-family : $sans-serif !default;
|
||||
$header-font-family : $sans-serif !default;
|
||||
$caption-font-family : $serif !default;
|
||||
|
||||
/* type scale */
|
||||
$type-size-1 : 2.441em !default; // ~39.056px
|
||||
$type-size-2 : 1.953em !default; // ~31.248px
|
||||
$type-size-3 : 1.563em !default; // ~25.008px
|
||||
$type-size-4 : 1.25em !default; // ~20px
|
||||
$type-size-5 : .9em !default; // ~16px
|
||||
$type-size-6 : 0.75em !default; // ~12px
|
||||
$type-size-7 : 0.6875em !default; // ~11px
|
||||
$type-size-8 : 0.625em !default; // ~10px
|
||||
|
||||
|
||||
/*
|
||||
Colors
|
||||
========================================================================== */
|
||||
|
||||
$gray : #7a8288 !default;
|
||||
$dark-gray : mix(#000, $gray, 40%) !default;
|
||||
$darker-gray : mix(#000, $gray, 60%) !default;
|
||||
$light-gray : mix(#fff, $gray, 50%) !default;
|
||||
$lighter-gray : mix(#fff, $gray, 90%) !default;
|
||||
|
||||
$body-color : $nord0 !default;
|
||||
$background-color : $nord0 !default;
|
||||
$code-background-color : $nord2 !default;
|
||||
$code-background-color-dark : $nord1 !default;
|
||||
$text-color : $nord4 !default;
|
||||
$border-color : $nord5 !default;
|
||||
|
||||
$primary-color : $nord4 !default;
|
||||
$success-color : $nord14 !default;
|
||||
$warning-color : $nord12 !default;
|
||||
$danger-color : $nord11 !default;
|
||||
$info-color : $nord10 !default;
|
||||
|
||||
/* brands */
|
||||
$behance-color : #1769FF !default;
|
||||
$dribbble-color : #ea4c89 !default;
|
||||
$facebook-color : #3b5998 !default;
|
||||
$flickr-color : #ff0084 !default;
|
||||
$foursquare-color : #0072b1 !default;
|
||||
$github-color : #171516 !default;
|
||||
$google-plus-color : #dd4b39 !default;
|
||||
$instagram-color : #517fa4 !default;
|
||||
$lastfm-color : #d51007 !default;
|
||||
$linkedin-color : #007bb6 !default;
|
||||
$pinterest-color : #cb2027 !default;
|
||||
$rss-color : #fa9b39 !default;
|
||||
$soundcloud-color : #ff3300 !default;
|
||||
$stackoverflow-color : #fe7a15 !default;
|
||||
$tumblr-color : #32506d !default;
|
||||
$twitter-color : #55acee !default;
|
||||
$vimeo-color : #1ab7ea !default;
|
||||
$vine-color : #00bf8f !default;
|
||||
$youtube-color : #bb0000 !default;
|
||||
$xing-color : #006567 !default;
|
||||
|
||||
|
||||
/* links */
|
||||
$link-color : mix(#fff, $info-color, 15%) !default;
|
||||
$link-color-hover : mix(#fff, $link-color, 25%) !default;
|
||||
$link-color-visited : mix(#000, $link-color, 25%) !default;
|
||||
$masthead-link-color : $primary-color !default;
|
||||
$masthead-link-color-hover : mix(#fff, $primary-color, 25%) !default;
|
||||
|
||||
|
||||
/*
|
||||
Breakpoints
|
||||
========================================================================== */
|
||||
|
||||
$small : 768px !default;
|
||||
$medium : 900px !default;
|
||||
$medium-wide : 1024px !default;
|
||||
$large : 1280px !default;
|
||||
$x-large : 1400px !default;
|
||||
|
||||
|
||||
/*
|
||||
Grid
|
||||
========================================================================== */
|
||||
|
||||
$right-sidebar-width-narrow : 200px !default;
|
||||
$right-sidebar-width : 300px !default;
|
||||
$right-sidebar-width-wide : 400px !default;
|
||||
|
||||
|
||||
/*
|
||||
Other
|
||||
========================================================================== */
|
||||
|
||||
$border-radius : 4px !default;
|
||||
$box-shadow : 0 1px 1px rgba(0, 0, 0, 0.125) !default;
|
||||
$navicon-width : 28px !default;
|
||||
$navicon-height : 4px !default;
|
||||
$global-transition : all 0.2s ease-in-out !default;
|
||||
40
_sass/minimal-mistakes.scss
Normal file
40
_sass/minimal-mistakes.scss
Normal file
@@ -0,0 +1,40 @@
|
||||
/*!
|
||||
* Minimal Mistakes Jekyll Theme 4.6.0 by Michael Rose
|
||||
* Copyright 2017 Michael Rose - mademistakes.com | @mmistakes
|
||||
* Licensed under MIT (https://github.com/mmistakes/minimal-mistakes/blob/master/LICENSE.txt)
|
||||
*/
|
||||
|
||||
/* Variables */
|
||||
@import "minimal-mistakes/variables";
|
||||
|
||||
/* Mixins and functions */
|
||||
@import "minimal-mistakes/vendor/breakpoint/breakpoint";
|
||||
@include breakpoint-set("to ems", true);
|
||||
@import "minimal-mistakes/vendor/font-awesome/font-awesome";
|
||||
@import "minimal-mistakes/vendor/magnific-popup/magnific-popup"; // Magnific Popup
|
||||
@import "minimal-mistakes/vendor/susy/susy";
|
||||
@import "minimal-mistakes/mixins";
|
||||
|
||||
/* Core CSS */
|
||||
@import "minimal-mistakes/reset";
|
||||
@import "minimal-mistakes/base";
|
||||
@import "minimal-mistakes/forms";
|
||||
@import "minimal-mistakes/tables";
|
||||
@import "minimal-mistakes/animations";
|
||||
|
||||
/* Components */
|
||||
@import "minimal-mistakes/buttons";
|
||||
@import "minimal-mistakes/notices";
|
||||
@import "minimal-mistakes/masthead";
|
||||
@import "minimal-mistakes/navigation";
|
||||
@import "minimal-mistakes/footer";
|
||||
@import "minimal-mistakes/syntax";
|
||||
|
||||
/* Utility classes */
|
||||
@import "minimal-mistakes/utilities";
|
||||
|
||||
/* Layout specific */
|
||||
@import "minimal-mistakes/page";
|
||||
@import "minimal-mistakes/archive";
|
||||
@import "minimal-mistakes/sidebar";
|
||||
@import "minimal-mistakes/print";
|
||||
@@ -5,13 +5,15 @@
|
||||
.archive {
|
||||
margin-bottom: 2em;
|
||||
|
||||
@include breakpoint($medium) {
|
||||
@include span(12 of 12);
|
||||
@include breakpoint($large) {
|
||||
float: right;
|
||||
width: calc(100% - #{$right-sidebar-width-narrow});
|
||||
padding-right: $right-sidebar-width-narrow;
|
||||
}
|
||||
|
||||
@include breakpoint($large) {
|
||||
@include span(10 of 12 last);
|
||||
@include prefix(0.5 of 12);
|
||||
@include breakpoint($x-large) {
|
||||
width: calc(100% - #{$right-sidebar-width});
|
||||
padding-right: $right-sidebar-width;
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -24,7 +26,7 @@
|
||||
margin: 1.414em 0 0;
|
||||
padding-bottom: 0.5em;
|
||||
font-size: $type-size-5;
|
||||
color: mix(#fff, $gray, 25%);
|
||||
color: $muted-text-color;
|
||||
border-bottom: 1px solid $border-color;
|
||||
|
||||
+ .list__item .archive__item-title {
|
||||
@@ -35,6 +37,8 @@
|
||||
.archive__item-title {
|
||||
margin-bottom: 0.25em;
|
||||
font-family: $sans-serif-narrow;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
a + a {
|
||||
opacity: 0.5;
|
||||
@@ -68,6 +72,7 @@
|
||||
}
|
||||
|
||||
.archive__item:hover {
|
||||
|
||||
.archive__item-teaser {
|
||||
box-shadow: 0 0 10px rgba(#000, 0.25);
|
||||
}
|
||||
@@ -83,17 +88,6 @@
|
||||
========================================================================== */
|
||||
|
||||
.list__item {
|
||||
@include breakpoint($medium) {
|
||||
padding-right: $right-sidebar-width-narrow;
|
||||
}
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding-right: $right-sidebar-width;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
padding-right: $right-sidebar-width-wide;
|
||||
}
|
||||
|
||||
.page__meta {
|
||||
margin: 0 0 4px;
|
||||
@@ -105,9 +99,68 @@
|
||||
Grid view
|
||||
========================================================================== */
|
||||
|
||||
.archive {
|
||||
|
||||
.grid__wrapper {
|
||||
/* extend grid elements to the right */
|
||||
|
||||
@include breakpoint($large) {
|
||||
margin-right: -1 * $right-sidebar-width-narrow;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
margin-right: -1 * $right-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.grid__item {
|
||||
margin-bottom: 2em;
|
||||
|
||||
@include breakpoint($small) {
|
||||
float: left;
|
||||
width: span(5 of 10);
|
||||
|
||||
&:nth-child(2n+1) {
|
||||
clear: both;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:nth-child(2n+2) {
|
||||
clear: none;
|
||||
margin-left: gutter(of 10);
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint($medium) {
|
||||
margin-left: 0; /* override margin*/
|
||||
margin-right: 0; /* override margin*/
|
||||
width: span(3 of 12);
|
||||
|
||||
&:nth-child(2n+1) {
|
||||
clear: none;
|
||||
}
|
||||
|
||||
&:nth-child(4n+1) {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
&:nth-child(4n+2) {
|
||||
clear: none;
|
||||
margin-left: gutter(1 of 12);
|
||||
}
|
||||
|
||||
&:nth-child(4n+3) {
|
||||
clear: none;
|
||||
margin-left: gutter(1 of 12);
|
||||
}
|
||||
|
||||
&:nth-child(4n+4) {
|
||||
clear: none;
|
||||
margin-left: gutter(1 of 12);
|
||||
}
|
||||
}
|
||||
|
||||
.page__meta {
|
||||
margin: 0 0 4px;
|
||||
}
|
||||
@@ -119,29 +172,23 @@
|
||||
|
||||
.archive__item-excerpt {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include breakpoint($small) {
|
||||
@include gallery(5 of 10);
|
||||
.archive__item-teaser {
|
||||
max-height: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint($medium) {
|
||||
margin-left: 0; /* reset before mixin does its thing*/
|
||||
margin-right: 0; /* reset before mixin does its thing*/
|
||||
@include gallery(2.5 of 10);
|
||||
|
||||
.archive__item-teaser {
|
||||
max-height: 120px;
|
||||
}
|
||||
|
||||
.archive__item-excerpt {
|
||||
@include breakpoint($medium) {
|
||||
display: block;
|
||||
font-size: $type-size-6;
|
||||
}
|
||||
}
|
||||
|
||||
.archive__item-teaser {
|
||||
|
||||
@include breakpoint($small) {
|
||||
max-height: 200px;
|
||||
}
|
||||
|
||||
@include breakpoint($medium) {
|
||||
max-height: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -160,8 +207,24 @@
|
||||
font-size: 1.25rem;
|
||||
|
||||
@include breakpoint($small) {
|
||||
float: left;
|
||||
margin-bottom: 0;
|
||||
@include gallery(4 of 12);
|
||||
width: span(4 of 12);
|
||||
|
||||
&:nth-child(3n+1) {
|
||||
clear: both;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
&:nth-child(3n+2) {
|
||||
clear: none;
|
||||
margin-left: gutter(of 12);
|
||||
}
|
||||
|
||||
&:nth-child(3n+3) {
|
||||
clear: none;
|
||||
margin-left: gutter(of 12);
|
||||
}
|
||||
|
||||
.feature__item-teaser {
|
||||
max-height: 200px;
|
||||
@@ -170,7 +233,11 @@
|
||||
}
|
||||
|
||||
&--left {
|
||||
@include full();
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
font-size: 1.25rem;
|
||||
|
||||
.archive__item-teaser {
|
||||
@@ -178,20 +245,27 @@
|
||||
}
|
||||
|
||||
@include breakpoint($small) {
|
||||
|
||||
.archive__item-teaser {
|
||||
@include span(5 of 12);
|
||||
float: left;
|
||||
width: span(5 of 12);
|
||||
}
|
||||
|
||||
.archive__item-body {
|
||||
@include span(7 of 12 last);
|
||||
@include prefix(0.5 of 12);
|
||||
@include suffix(1 of 12);
|
||||
float: right;
|
||||
padding-left: gutter(0.5 of 12);
|
||||
padding-right: gutter(1 of 12);
|
||||
width: span(7 of 12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--right {
|
||||
@include full();
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
font-size: 1.25rem;
|
||||
|
||||
.archive__item-teaser {
|
||||
@@ -202,19 +276,25 @@
|
||||
text-align: right;
|
||||
|
||||
.archive__item-teaser {
|
||||
@include span(5 of 12 rtl);
|
||||
float: right;
|
||||
width: span(5 of 12);
|
||||
}
|
||||
|
||||
.archive__item-body {
|
||||
@include span(7 of 12 last rtl);
|
||||
@include prefix(0.5 of 12);
|
||||
@include suffix(1 of 12);
|
||||
float: right;
|
||||
width: span(7 of 12);
|
||||
padding-left: gutter(0.5 of 12);
|
||||
padding-right: gutter(1 of 12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--center {
|
||||
@include full();
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
font-size: 1.25rem;
|
||||
|
||||
.archive__item-teaser {
|
||||
@@ -235,4 +315,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -118,8 +118,13 @@ a {
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
color: $link-color-hover;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
&:visited {
|
||||
color: $link-color-visited;
|
||||
}
|
||||
}
|
||||
|
||||
/* code */
|
||||
@@ -141,7 +146,7 @@ td > code {
|
||||
padding-bottom: 0.1rem;
|
||||
font-size: $type-size-6;
|
||||
background: $code-background-color;
|
||||
border: 1px solid $lighter-gray;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
box-shadow: $box-shadow;
|
||||
|
||||
@@ -236,20 +241,16 @@ figure {
|
||||
|
||||
figcaption {
|
||||
margin-bottom: 0.5em;
|
||||
color: mix(#fff, $text-color, 25%);
|
||||
color: $muted-text-color;
|
||||
font-family: $caption-font-family;
|
||||
font-size: $type-size-6;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid $light-gray;
|
||||
-webkit-transition: $global-transition;
|
||||
transition: $global-transition;
|
||||
|
||||
&:hover {
|
||||
color: #000;
|
||||
border-bottom-color: #000;
|
||||
color: $link-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
98
_sass/minimal-mistakes/_buttons.scss
Normal file
98
_sass/minimal-mistakes/_buttons.scss
Normal file
@@ -0,0 +1,98 @@
|
||||
/* ==========================================================================
|
||||
BUTTONS
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Default button
|
||||
========================================================================== */
|
||||
|
||||
.btn {
|
||||
/* default */
|
||||
display: inline-block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-family: $sans-serif;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
border-width: 0;
|
||||
border-radius: $border-radius;
|
||||
cursor: pointer;
|
||||
|
||||
.icon {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.icon + .hidden {
|
||||
margin-left: -0.5em; /* override for hidden text*/
|
||||
}
|
||||
|
||||
/* button colors */
|
||||
$buttoncolors:
|
||||
(primary, $primary-color),
|
||||
(inverse, #fff),
|
||||
(light-outline, transparent),
|
||||
(success, $success-color),
|
||||
(warning, $warning-color),
|
||||
(danger, $danger-color),
|
||||
(info, $info-color),
|
||||
(facebook, $facebook-color),
|
||||
(twitter, $twitter-color),
|
||||
(google-plus, $google-plus-color),
|
||||
(linkedin, $linkedin-color);
|
||||
|
||||
@each $buttoncolor, $color in $buttoncolors {
|
||||
&--#{$buttoncolor} {
|
||||
@include yiq-contrasted($color);
|
||||
@if ($buttoncolor == inverse) {
|
||||
border: 1px solid $border-color;
|
||||
}
|
||||
@if ($buttoncolor == light-outline) {
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include yiq-contrasted(mix(#000, $color, 20%));
|
||||
}
|
||||
|
||||
&:visited {
|
||||
@include yiq-contrasted($color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* fills width of parent container */
|
||||
&--block {
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
+ .btn--block {
|
||||
margin-top: 0.25em;
|
||||
}
|
||||
}
|
||||
|
||||
/* disabled */
|
||||
&--disabled {
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
filter: alpha(opacity=65);
|
||||
box-shadow: none;
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
/* extra large button */
|
||||
&--x-large {
|
||||
font-size: $type-size-4;
|
||||
}
|
||||
|
||||
/* large button */
|
||||
&--large {
|
||||
font-size: $type-size-5;
|
||||
}
|
||||
|
||||
/* small button */
|
||||
&--small {
|
||||
font-size: $type-size-7;
|
||||
}
|
||||
}
|
||||
@@ -3,28 +3,31 @@
|
||||
========================================================================== */
|
||||
|
||||
.page__footer {
|
||||
@include full();
|
||||
@include clearfix;
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
/* sticky footer fix start */
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
height: auto;
|
||||
/* sticky footer fix end */
|
||||
margin-top: 3em;
|
||||
color: $primary-color;
|
||||
-webkit-animation: intro 0.3s both;
|
||||
animation: intro 0.3s both;
|
||||
color: $muted-text-color;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
-webkit-animation-delay: 0.45s;
|
||||
animation-delay: 0.45s;
|
||||
background-color: $nord1;
|
||||
border-top: 1px solid $light-gray;
|
||||
background-color: $footer-background-color;
|
||||
|
||||
footer {
|
||||
@include container;
|
||||
@include clearfix;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 2em;
|
||||
max-width: 100%;
|
||||
padding: 0 1em 2em;
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
@@ -33,7 +36,7 @@
|
||||
}
|
||||
|
||||
a {
|
||||
color: mix(#fff, $link-color, 20%);
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
@@ -42,7 +45,7 @@
|
||||
}
|
||||
|
||||
.fa {
|
||||
color: mix(#fff, $gray, 25%);
|
||||
color: $muted-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,8 @@
|
||||
|
||||
form {
|
||||
margin: 0 0 5px 0;
|
||||
padding: 1em;
|
||||
background-color: $form-background-color;
|
||||
|
||||
fieldset {
|
||||
margin-bottom: 5px;
|
||||
@@ -19,7 +21,6 @@ form {
|
||||
padding: 0;
|
||||
color: $text-color;
|
||||
border: 0;
|
||||
border-bottom: 1px solid mix(#fff, #000, 80%);
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
@@ -80,14 +81,10 @@ select {
|
||||
padding: 0.25em;
|
||||
margin-bottom: 0.5em;
|
||||
color: $text-color;
|
||||
background-color: #fff;
|
||||
border: 1px solid mix(#fff, #000, 80%);
|
||||
background-color: $background-color;
|
||||
border: $border-color;
|
||||
border-radius: $border-radius;
|
||||
box-shadow: $box-shadow;
|
||||
|
||||
&:hover {
|
||||
border-color: mix(#fff, $primary-color, 50%);
|
||||
}
|
||||
}
|
||||
|
||||
.input-mini {
|
||||
@@ -224,6 +221,7 @@ textarea:focus {
|
||||
border-color: $primary-color;
|
||||
outline: 0;
|
||||
outline: thin dotted \9;
|
||||
box-shadow: inset 0 1px 3px rgba($text-color, 0.06), 0 0 5px rgba($primary-color, 0.7);
|
||||
}
|
||||
|
||||
input[type="file"]:focus,
|
||||
@@ -240,7 +238,7 @@ select:focus {
|
||||
|
||||
.help-block,
|
||||
.help-inline {
|
||||
color: $info-color;
|
||||
color: $muted-text-color;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
@@ -382,7 +380,7 @@ select:focus {
|
||||
color: #000;
|
||||
border-width: 2px !important;
|
||||
border-style: solid !important;
|
||||
border-color: lighten(#000,50);
|
||||
border-color: $border-color;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
@@ -4,18 +4,23 @@
|
||||
|
||||
.masthead {
|
||||
position: relative;
|
||||
background: $nord1;
|
||||
border-bottom: 1px solid $border-color;
|
||||
-webkit-animation: intro 0.3s both;
|
||||
animation: intro 0.3s both;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
-webkit-animation-delay: 0.15s;
|
||||
animation-delay: 0.15s;
|
||||
z-index: 20;
|
||||
|
||||
&__inner-wrap {
|
||||
@include container;
|
||||
@include clearfix;
|
||||
padding: 1em 1em 1em;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding: 1em;
|
||||
max-width: 100%;
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
font-family: $sans-serif-narrow;
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
@@ -32,7 +37,31 @@
|
||||
}
|
||||
}
|
||||
|
||||
.site-title {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
padding: 0.5rem 0;
|
||||
align-self: stretch;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.masthead__menu {
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
|
||||
.site-nav {
|
||||
margin-left: 0;
|
||||
|
||||
@include breakpoint($small) {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
@@ -51,4 +80,4 @@
|
||||
padding-right: 2em;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -50,4 +50,43 @@
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Compass YIQ Color Contrast
|
||||
https://github.com/easy-designs/yiq-color-contrast
|
||||
========================================================================== */
|
||||
|
||||
@function yiq-is-light(
|
||||
$color,
|
||||
$threshold: $yiq-contrasted-threshold
|
||||
) {
|
||||
$red: red($color);
|
||||
$green: green($color);
|
||||
$blue: blue($color);
|
||||
|
||||
$yiq: (($red*299)+($green*587)+($blue*114))/1000;
|
||||
|
||||
@if $yiq-debug { @debug $yiq, $threshold; }
|
||||
|
||||
@return if($yiq >= $threshold, true, false);
|
||||
}
|
||||
|
||||
@function yiq-contrast-color(
|
||||
$color,
|
||||
$dark: $yiq-contrasted-dark-default,
|
||||
$light: $yiq-contrasted-light-default,
|
||||
$threshold: $yiq-contrasted-threshold
|
||||
) {
|
||||
@return if(yiq-is-light($color, $threshold), $yiq-contrasted-dark-default, $yiq-contrasted-light-default);
|
||||
}
|
||||
|
||||
@mixin yiq-contrasted(
|
||||
$background-color,
|
||||
$dark: $yiq-contrasted-dark-default,
|
||||
$light: $yiq-contrasted-light-default,
|
||||
$threshold: $yiq-contrasted-threshold
|
||||
) {
|
||||
background-color: $background-color;
|
||||
color: yiq-contrast-color($background-color, $dark, $light, $threshold);
|
||||
}
|
||||
569
_sass/minimal-mistakes/_navigation.scss
Normal file
569
_sass/minimal-mistakes/_navigation.scss
Normal file
@@ -0,0 +1,569 @@
|
||||
/* ==========================================================================
|
||||
NAVIGATION
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Breadcrumb navigation links
|
||||
========================================================================== */
|
||||
|
||||
.breadcrumbs {
|
||||
@include clearfix;
|
||||
margin: 0 auto;
|
||||
max-width: 100%;
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
font-family: $sans-serif;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
-webkit-animation-delay: 0.30s;
|
||||
animation-delay: 0.30s;
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
max-width: $x-large;
|
||||
}
|
||||
|
||||
ol {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
font-size: $type-size-6;
|
||||
|
||||
@include breakpoint($large) {
|
||||
float: right;
|
||||
width: span(10 of 12);
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
padding-left: gutter(0.5 of 12);
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.current {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Post pagination navigation links
|
||||
========================================================================== */
|
||||
|
||||
.pagination {
|
||||
@include clearfix();
|
||||
float: left;
|
||||
margin-top: 1em;
|
||||
padding-top: 1em;
|
||||
width: 100%;
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
font-family: $sans-serif;
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin-left: -1px;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
margin-bottom: 0.25em;
|
||||
padding: 0.5em 1em;
|
||||
font-family: $sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: $muted-text-color;
|
||||
border: 1px solid mix(#000, $border-color, 25%);
|
||||
border-radius: 0;
|
||||
|
||||
&:hover {
|
||||
color: $link-color-hover;
|
||||
}
|
||||
|
||||
&.current,
|
||||
&.current.disabled {
|
||||
color: #fff;
|
||||
background: $primary-color;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: rgba($muted-text-color, 0.5);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
|
||||
a {
|
||||
border-top-left-radius: $border-radius;
|
||||
border-bottom-left-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
a {
|
||||
border-top-right-radius: $border-radius;
|
||||
border-bottom-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* next/previous buttons */
|
||||
&--pager {
|
||||
display: block;
|
||||
padding: 1em 2em;
|
||||
float: left;
|
||||
width: 50%;
|
||||
font-family: $sans-serif;
|
||||
font-size: $type-size-5;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: $muted-text-color;
|
||||
border: 1px solid mix(#000, $border-color, 25%);
|
||||
border-radius: $border-radius;
|
||||
|
||||
&:hover {
|
||||
@include yiq-contrasted($muted-text-color);
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-left: -1px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: rgba($muted-text-color, 0.5);
|
||||
pointer-events: none;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page__content + .pagination,
|
||||
.page__meta + .pagination,
|
||||
.page__share + .pagination,
|
||||
.page__comments + .pagination {
|
||||
margin-top: 2em;
|
||||
padding-top: 2em;
|
||||
border-top: 1px solid $border-color;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Priority plus navigation
|
||||
========================================================================== */
|
||||
|
||||
.greedy-nav {
|
||||
position: relative;
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
background: $background-color;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
margin: 0 1rem;
|
||||
padding: 0.5rem 0;
|
||||
color: $masthead-link-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $masthead-link-color-hover;
|
||||
}
|
||||
|
||||
&.site-title {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 0 0.5rem;
|
||||
align-self: stretch;
|
||||
border: 0;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.visible-links {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-pack: end;
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1;
|
||||
padding-right: 2rem;
|
||||
overflow: hidden;
|
||||
|
||||
li {
|
||||
-webkit-box-flex: 0;
|
||||
flex: none;
|
||||
|
||||
&:first-child {
|
||||
a {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
a {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 4px;
|
||||
background: $primary-color;
|
||||
width: 100%;
|
||||
-webkit-transition: $global-transition;
|
||||
transition: $global-transition;
|
||||
-webkit-transform: scaleX(0) translate3d(0, 0 , 0);
|
||||
transform: scaleX(0) translate3d(0, 0 , 0); /* hide*/
|
||||
}
|
||||
|
||||
&:hover:before {
|
||||
-webkit-transform: scaleX(1);
|
||||
-ms-transform: scaleX(1);
|
||||
transform: scaleX(1); /* reveal*/
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.links-menu{
|
||||
right: 2.5rem;
|
||||
}
|
||||
|
||||
.lang-menu{
|
||||
right: .2rem;
|
||||
}
|
||||
|
||||
.hidden-links {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
margin-top: 15px;
|
||||
padding: 5px;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
background: $background-color;
|
||||
box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
|
||||
|
||||
&.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
margin: 0;
|
||||
padding: 10px 20px;
|
||||
font-size: $type-size-5;
|
||||
|
||||
&:hover {
|
||||
color: $masthead-link-color-hover;
|
||||
background: $navicon-link-color-hover;
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
right: 5px;
|
||||
width: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 10px 10px;
|
||||
border-color: $border-color transparent;
|
||||
display: block;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: 5px;
|
||||
width: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 10px 10px;
|
||||
border-color: $background-color transparent;
|
||||
display: block;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
li {
|
||||
display: block;
|
||||
border-bottom: 1px solid $border-color;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Navigation list
|
||||
========================================================================== */
|
||||
|
||||
.nav__list {
|
||||
margin-bottom: 1.5em;
|
||||
|
||||
input[type="checkbox"],
|
||||
label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding: 0.5em 2.5em 0.5em 1em;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
border: 1px solid $light-gray;
|
||||
border-radius: $border-radius;
|
||||
z-index: 20;
|
||||
-webkit-transition: 0.2s ease-out;
|
||||
transition: 0.2s ease-out;
|
||||
cursor: pointer;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
top: 1.25em;
|
||||
width: 0.75em;
|
||||
height: 0.125em;
|
||||
line-height: 1;
|
||||
background-color: $gray;
|
||||
-webkit-transition: 0.2s ease-out;
|
||||
transition: 0.2s ease-out;
|
||||
}
|
||||
|
||||
&:after {
|
||||
-webkit-transform: rotate(90deg);
|
||||
-ms-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
border-color: $gray;
|
||||
background-color: mix(white, #000, 20%);
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* selected*/
|
||||
input:checked + label {
|
||||
color: white;
|
||||
background-color: mix(white, #000, 20%);
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
/* on hover show expand*/
|
||||
label:hover:after {
|
||||
-webkit-transform: rotate(90deg);
|
||||
-ms-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
input:checked + label:hover:after {
|
||||
-webkit-transform: rotate(0);
|
||||
-ms-transform: rotate(0);
|
||||
transform: rotate(0);
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 0.25em 0;
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding-top: 0.125em;
|
||||
padding-bottom: 0.125em;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav__list .nav__items {
|
||||
margin: 0;
|
||||
font-size: 1.4rem;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
ol {
|
||||
padding-left: 0.9rem;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: inherit;
|
||||
}
|
||||
|
||||
.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.completed {
|
||||
color: $gray;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
position: relative;
|
||||
max-height: 0;
|
||||
opacity: 0%;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
-webkit-transition: 0.3s ease-in-out;
|
||||
transition: 0.3s ease-in-out;
|
||||
-webkit-transform: translate(0, 10%);
|
||||
-ms-transform: translate(0, 10%);
|
||||
transform: translate(0, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint(max-width ($large - 1px)) {
|
||||
.nav__list input:checked ~ .nav__items {
|
||||
-webkit-transition: 0.5s ease-in-out;
|
||||
transition: 0.5s ease-in-out;
|
||||
max-height: 9999px; /* exaggerate max-height to accommodate tall lists*/
|
||||
overflow: visible;
|
||||
opacity: 1;
|
||||
margin-top: 1em;
|
||||
-webkit-transform: translate(0, 0);
|
||||
-ms-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.nav__title {
|
||||
margin: 0;
|
||||
padding: 0.5rem 1rem;
|
||||
font-family: $sans-serif-narrow;
|
||||
font-size: $type-size-5;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.nav__sub-title {
|
||||
display: block;
|
||||
margin: 0.5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
font-family: $sans-serif-narrow;
|
||||
font-size: $type-size-6;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
border-bottom: 1px solid $border-color;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Table of contents navigation
|
||||
========================================================================== */
|
||||
|
||||
.toc {
|
||||
font-family: $sans-serif-narrow;
|
||||
color: $gray;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
background-color: $background-color;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
box-shadow: $box-shadow;
|
||||
|
||||
.nav__title {
|
||||
color: #fff;
|
||||
font-size: $type-size-6;
|
||||
background: $primary-color;
|
||||
border-top-left-radius: $border-radius;
|
||||
border-top-right-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
.toc__menu {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
font-size: 1rem;
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 0.5rem 1rem;
|
||||
color: $text-color;
|
||||
font-size: $type-size-7;
|
||||
font-weight: bold;
|
||||
line-height: 1.5;
|
||||
border-bottom: 1px solid $border-color;
|
||||
}
|
||||
|
||||
> li:last-child {
|
||||
a {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
li ul > li a {
|
||||
padding-left: 1.75rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/* hide sub sub links on small screens*/
|
||||
li > ul li {
|
||||
display: none;
|
||||
|
||||
@include breakpoint($medium) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -15,9 +15,9 @@
|
||||
padding: 1em;
|
||||
font-family: $global-font-family;
|
||||
font-size: $type-size-6 !important;
|
||||
font-weight: bold;
|
||||
text-indent: initial; /* override*/
|
||||
background-color: mix($body-color, $notice-color, 45%);
|
||||
font-weight: bold;
|
||||
background-color: mix($background-color, $notice-color, 45%);
|
||||
border-radius: $border-radius;
|
||||
box-shadow: 0 1px 1px rgba($notice-color, 0.25);
|
||||
|
||||
@@ -63,13 +63,13 @@
|
||||
/* Default notice */
|
||||
|
||||
.notice {
|
||||
@include notice($nord3);
|
||||
@include notice($light-gray);
|
||||
}
|
||||
|
||||
/* Primary notice */
|
||||
|
||||
.notice--primary {
|
||||
@include notice($nord8);
|
||||
@include notice($primary-color);
|
||||
}
|
||||
|
||||
/* Info notice */
|
||||
@@ -3,13 +3,17 @@
|
||||
========================================================================== */
|
||||
|
||||
#main {
|
||||
@include container;
|
||||
@include clearfix;
|
||||
margin-left: auto;
|
||||
margin-top: 2em;
|
||||
margin-right: auto;
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
animation: intro 0.3s both;
|
||||
animation-delay: 0.35s;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
max-width: 100%;
|
||||
-webkit-animation-delay: 0.35s;
|
||||
animation-delay: 0.35s;
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
max-width: $x-large;
|
||||
@@ -17,19 +21,34 @@
|
||||
}
|
||||
|
||||
.page {
|
||||
|
||||
@include breakpoint($large) {
|
||||
@include span(10 of 12 last);
|
||||
@include prefix(0.5 of 12);
|
||||
@include suffix(2 of 12);
|
||||
float: right;
|
||||
width: calc(100% - #{$right-sidebar-width-narrow});
|
||||
padding-right: $right-sidebar-width-narrow;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
width: calc(100% - #{$right-sidebar-width});
|
||||
padding-right: $right-sidebar-width;
|
||||
}
|
||||
|
||||
.page__inner-wrap {
|
||||
@include full();
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
|
||||
.page__content,
|
||||
.page__meta,
|
||||
.page__share {
|
||||
@include full();
|
||||
position: relative;
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -56,7 +75,7 @@
|
||||
}
|
||||
|
||||
p, li, dl {
|
||||
font-size: .9em;
|
||||
font-size: .85em;
|
||||
}
|
||||
|
||||
/* paragraph indents */
|
||||
@@ -72,8 +91,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
a:not(.btn) {
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
@@ -84,10 +102,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top-color: $nord3;
|
||||
}
|
||||
|
||||
dt {
|
||||
margin-top: 1em;
|
||||
font-family: $sans-serif;
|
||||
@@ -115,8 +129,10 @@
|
||||
position: relative;
|
||||
margin-bottom: 2em;
|
||||
@include clearfix;
|
||||
animation: intro 0.3s both;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
|
||||
&--overlay {
|
||||
position: relative;
|
||||
@@ -126,8 +142,10 @@
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
animation: intro 0.3s both;
|
||||
animation-delay: 0.25s;
|
||||
-webkit-animation: $intro-transition;
|
||||
animation: $intro-transition;
|
||||
-webkit-animation-delay: 0.25s;
|
||||
animation-delay: 0.25s;
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
@@ -183,7 +201,7 @@
|
||||
text-align: right;
|
||||
z-index: 5;
|
||||
opacity: 0.5;
|
||||
border-radius: $border-radius 0 $border-radius 0;
|
||||
border-radius: $border-radius 0 0 0;
|
||||
|
||||
@include breakpoint($large) {
|
||||
padding: 5px 10px;
|
||||
@@ -231,7 +249,7 @@
|
||||
|
||||
.page__meta {
|
||||
margin-top: 2em;
|
||||
color: mix(#fff, $gray, 25%);
|
||||
color: $muted-text-color;
|
||||
font-family: $sans-serif;
|
||||
font-size: $type-size-6;
|
||||
|
||||
@@ -271,7 +289,7 @@
|
||||
margin-bottom: 8px;
|
||||
padding: 5px 10px;
|
||||
text-decoration: none;
|
||||
border: 1px solid $light-gray;
|
||||
border: 1px solid mix(#000, $border-color, 25%);
|
||||
border-radius: $border-radius;
|
||||
|
||||
&:hover {
|
||||
@@ -286,7 +304,11 @@
|
||||
========================================================================== */
|
||||
|
||||
.page__comments {
|
||||
@include full();
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.page__comments-title {
|
||||
@@ -299,8 +321,7 @@
|
||||
}
|
||||
|
||||
.page__comments-form {
|
||||
padding: 1em;
|
||||
background: $lighter-gray;
|
||||
-webkit-transition: $global-transition;
|
||||
transition: $global-transition;
|
||||
|
||||
&.disabled {
|
||||
@@ -382,14 +403,19 @@
|
||||
========================================================================== */
|
||||
|
||||
.page__related {
|
||||
@include clearfix();
|
||||
float: left;
|
||||
margin-top: 2em;
|
||||
padding-top: 1em;
|
||||
border-top: 1px solid $border-color;
|
||||
@include clearfix();
|
||||
float: left;
|
||||
|
||||
@include breakpoint($large) {
|
||||
@include pre(2.5 of 12);
|
||||
float: right;
|
||||
width: calc(100% - #{$right-sidebar-width-narrow});
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
width: calc(100% - #{$right-sidebar-width});
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -402,4 +428,4 @@
|
||||
margin-bottom: 10px;
|
||||
font-size: $type-size-6;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
252
_sass/minimal-mistakes/_print.scss
Normal file
252
_sass/minimal-mistakes/_print.scss
Normal file
@@ -0,0 +1,252 @@
|
||||
/* ==========================================================================
|
||||
PRINT STYLES
|
||||
========================================================================== */
|
||||
|
||||
@media print {
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
* {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
min-height: auto !important;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0 auto;
|
||||
background: #fff !important;
|
||||
color: #000 !important;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: #000;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 0.75rem;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #000;
|
||||
text-decoration: underline;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border-bottom: 1px solid #000;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
display: block;
|
||||
max-width: 100% !important;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-bottom: 2px solid #bbb;
|
||||
height: 0;
|
||||
margin: 2.25rem 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin: 0;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
abbr[title],
|
||||
acronym[title] {
|
||||
border: 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
table,
|
||||
blockquote,
|
||||
pre,
|
||||
code,
|
||||
figure,
|
||||
li,
|
||||
hr,
|
||||
ul,
|
||||
ol,
|
||||
a,
|
||||
tr {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
p,
|
||||
a {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
page-break-after: avoid;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
h1 + p,
|
||||
h2 + p,
|
||||
h3 + p {
|
||||
page-break-before: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
page-break-after: auto;
|
||||
page-break-before: auto;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre-wrap !important;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
a[href^='http://']:after,
|
||||
a[href^='https://']:after,
|
||||
a[href^='ftp://']:after {
|
||||
content: " (" attr(href) ")";
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
abbr[title]:after,
|
||||
acronym[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
#main {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.page {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.page-break,
|
||||
.page-break-before {
|
||||
page-break-before: always;
|
||||
}
|
||||
|
||||
.page-break-after {
|
||||
page-break-after: always;
|
||||
}
|
||||
|
||||
.no-print {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a.no-reformat:after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
abbr[title].no-reformat:after,
|
||||
acronym[title].no-reformat:after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
.page__hero-caption {
|
||||
color: #000 !important;
|
||||
background: #fff !important;
|
||||
opacity: 1;
|
||||
|
||||
a {
|
||||
color: #000 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Hide the following elements on print
|
||||
========================================================================== */
|
||||
|
||||
.masthead,
|
||||
.toc,
|
||||
.page__share,
|
||||
.page__related,
|
||||
.pagination,
|
||||
.ads,
|
||||
.page__footer,
|
||||
.page__comments-form,
|
||||
.author__avatar,
|
||||
.author__content,
|
||||
.author__urls-wrapper,
|
||||
.nav__list,
|
||||
.sidebar,
|
||||
.adsbygoogle {
|
||||
display: none !important;
|
||||
height: 1px !important;
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
STYLE RESETS
|
||||
========================================================================== */
|
||||
|
||||
@include border-box-sizing;
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
html {
|
||||
/* apply a natural box layout model to all elements */
|
||||
@@ -184,4 +184,4 @@ input[type="search"]::-webkit-search-cancel-button {
|
||||
textarea {
|
||||
overflow: auto; /* remove vertical scrollbar in IE6-9*/
|
||||
vertical-align: top; /* readability and alignment cross-browser*/
|
||||
}
|
||||
}
|
||||
@@ -7,25 +7,39 @@
|
||||
========================================================================== */
|
||||
|
||||
.sidebar {
|
||||
@include clearfix();
|
||||
margin-bottom: 1em;
|
||||
-webkit-transform: translate3d(0, 0 , 0);
|
||||
transform: translate3d(0, 0 , 0);
|
||||
|
||||
@include clearfix();
|
||||
margin-bottom: 1em;
|
||||
@include breakpoint(max-width $large) {
|
||||
/* fix z-index order of follow links */
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
@include breakpoint($large) {
|
||||
@include span(2 of 12);
|
||||
opacity: 0.75;
|
||||
float: left;
|
||||
width: calc(#{$right-sidebar-width-narrow} - 1em);
|
||||
opacity: 1;
|
||||
-webkit-transition: opacity 0.2s ease-in-out;
|
||||
transition: opacity 0.2s ease-in-out;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
a {
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
&.sticky {
|
||||
overflow-y: auto;
|
||||
/* calculate height of nav list */
|
||||
height: calc(100vh - 90px - 2em); // viewport height - approx. masthead height - main content top margin
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
padding-right: 0;
|
||||
width: calc(#{$right-sidebar-width} - 1em);
|
||||
}
|
||||
|
||||
h2, h3, h4, h5, h6 {
|
||||
@@ -48,15 +62,31 @@
|
||||
margin-bottom: 1em;
|
||||
|
||||
@include breakpoint($large) {
|
||||
position: relative;
|
||||
float: right;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: $right-sidebar-width-narrow;
|
||||
margin-left: span(0.5 of 12);
|
||||
margin-right: -1 * $right-sidebar-width-narrow;
|
||||
padding-left: 1em;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
width: $right-sidebar-width;
|
||||
margin-right: -1 * $right-sidebar-width;
|
||||
}
|
||||
}
|
||||
|
||||
.splash .sidebar__right {
|
||||
|
||||
@include breakpoint($large) {
|
||||
position: relative;
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
@include breakpoint($x-large) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -161,11 +191,15 @@
|
||||
list-style-type: none;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
background: #fff;
|
||||
background: $background-color;
|
||||
z-index: -1;
|
||||
box-shadow: 0 0 10px rgba(#000, 0.25);
|
||||
box-shadow: 0 2px 4px 0 rgba(#000, 0.16), 0 2px 10px 0 rgba(#000, 0.12);
|
||||
cursor: default;
|
||||
|
||||
&.is--visible {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@include breakpoint($large) {
|
||||
display: block;
|
||||
position: relative;
|
||||
@@ -202,7 +236,7 @@
|
||||
width: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 10px 10px;
|
||||
border-color: #fff transparent;
|
||||
border-color: $background-color transparent;
|
||||
z-index: 1;
|
||||
|
||||
@include breakpoint($large) {
|
||||
@@ -228,4 +262,4 @@
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -5,10 +5,9 @@
|
||||
div.highlighter-rouge,
|
||||
figure.highlight {
|
||||
position: relative;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-family: $monospace;
|
||||
font-size: $type-size-7;
|
||||
font-size: $type-size-6;
|
||||
line-height: 1.8;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
@@ -26,7 +25,6 @@ figure.highlight {
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
speak: none;
|
||||
color: $background-color;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
@@ -48,10 +46,10 @@ figure.highlight {
|
||||
padding: 5px;
|
||||
border: 0;
|
||||
|
||||
// line numbers
|
||||
/* line numbers*/
|
||||
&.gutter {
|
||||
padding-right: 1em;
|
||||
color: $light-gray;
|
||||
color: rgba($muted-text-color, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -16,7 +16,7 @@ table {
|
||||
}
|
||||
|
||||
thead {
|
||||
background-color: $nord1;
|
||||
background-color: mix($background-color, $dark-gray, 45%);;
|
||||
border-bottom: 1px solid $light-gray;
|
||||
color: $primary-color;
|
||||
}
|
||||
@@ -57,7 +57,7 @@ body:hover .visually-hidden button {
|
||||
background: #fff;
|
||||
z-index: 100000;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
|
||||
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
|
||||
@@ -114,7 +114,9 @@ body:hover .visually-hidden button {
|
||||
.cf { clear: both; }
|
||||
|
||||
.wrapper {
|
||||
@include container();
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
@@ -183,7 +185,7 @@ body:hover .visually-hidden button {
|
||||
|
||||
.social-icons {
|
||||
.fa {
|
||||
color: #000;
|
||||
color: $text-color;
|
||||
}
|
||||
|
||||
.fa-behance,
|
||||
@@ -191,6 +193,11 @@ body:hover .visually-hidden button {
|
||||
color: $behance-color;
|
||||
}
|
||||
|
||||
.fa-bitbucket,
|
||||
.fa-bitbucket-square {
|
||||
color: $bitbucket-color;
|
||||
}
|
||||
|
||||
.fa-dribbble {
|
||||
color: $dribbble-color;
|
||||
}
|
||||
@@ -286,14 +293,15 @@ body:hover .visually-hidden button {
|
||||
|
||||
|
||||
/*
|
||||
Navicons
|
||||
========================================================================== */
|
||||
Navicons
|
||||
========================================================================== */
|
||||
|
||||
.navicon {
|
||||
position: relative;
|
||||
width: $navicon-width;
|
||||
height: $navicon-height;
|
||||
background: $primary-color;
|
||||
top: ($navicon-height / 2);
|
||||
background: $text-color;
|
||||
margin: auto;
|
||||
|
||||
&:before,
|
||||
@@ -303,7 +311,7 @@ body:hover .visually-hidden button {
|
||||
left: 0;
|
||||
width: $navicon-width;
|
||||
height: $navicon-height;
|
||||
background: $primary-color;
|
||||
background: $text-color;
|
||||
}
|
||||
|
||||
&:before {
|
||||
@@ -337,17 +345,18 @@ body:hover .visually-hidden button {
|
||||
transform: rotate3d(0,0,1,-45deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Langicons
|
||||
========================================================================== */
|
||||
|
||||
Langicons
|
||||
========================================================================== */
|
||||
|
||||
.langicon {
|
||||
position: relative;
|
||||
width: $navicon-width;
|
||||
display: inline-block;
|
||||
background: transparent;
|
||||
margin: auto;
|
||||
color: $primary-color;
|
||||
color: $text-color;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
@@ -356,30 +365,19 @@ body:hover .visually-hidden button {
|
||||
left: 0;
|
||||
width: $navicon-width;
|
||||
height: $navicon-height;
|
||||
background: $primary-color;
|
||||
background: $text-color;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* overlay the lines by setting both their top values to 0*/
|
||||
&:before, &:after{
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
top: 0;
|
||||
width: $navicon-width;
|
||||
&:before {
|
||||
top: (-2 * $navicon-height);
|
||||
}
|
||||
|
||||
/* rotate the lines to form the x shape*/
|
||||
&:before{
|
||||
-webkit-transform: rotate3d(0,0,1,45deg);
|
||||
transform: rotate3d(0,0,1,45deg);
|
||||
}
|
||||
&:after{
|
||||
-webkit-transform: rotate3d(0,0,1,-45deg);
|
||||
transform: rotate3d(0,0,1,-45deg);
|
||||
&:after {
|
||||
bottom: (-2 * $navicon-height);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.close .langicon {
|
||||
/* hide the middle line*/
|
||||
background: transparent;
|
||||
@@ -395,14 +393,23 @@ body:hover .visually-hidden button {
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
top: 0;
|
||||
width: $navicon-width;
|
||||
display: block;
|
||||
-webkit-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
display: inherit;
|
||||
}
|
||||
|
||||
/* rotate the lines to form the x shape*/
|
||||
&:before{
|
||||
-webkit-transform: rotate3d(0,0,1,45deg);
|
||||
transform: rotate3d(0,0,1,45deg);
|
||||
}
|
||||
&:after{
|
||||
top: (-2 * $navicon-height);
|
||||
-webkit-transform: rotate3d(0,0,1,-45deg);
|
||||
transform: rotate3d(0,0,1,-45deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Sticky, fixed to top content
|
||||
========================================================================== */
|
||||
@@ -529,6 +536,48 @@ a.reversefootnote {
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Google Custom Search Engine
|
||||
========================================================================== */
|
||||
|
||||
.gsc-control-cse {
|
||||
|
||||
table, tr, td {
|
||||
border: 0; /* remove table borders widget */
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Responsive Video Embed
|
||||
========================================================================== */
|
||||
|
||||
.responsive-video-container {
|
||||
position: relative;
|
||||
margin-bottom: 1em;
|
||||
padding-bottom: 56.25%;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
max-width: 100%;
|
||||
|
||||
iframe,
|
||||
object,
|
||||
embed {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// full screen video fixes
|
||||
:-webkit-full-screen-ancestor {
|
||||
.masthead,
|
||||
.page__footer {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
Ads
|
||||
========================================================================== */
|
||||
137
_sass/minimal-mistakes/_variables.scss
Normal file
137
_sass/minimal-mistakes/_variables.scss
Normal file
@@ -0,0 +1,137 @@
|
||||
/* ==========================================================================
|
||||
Variables
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
$doc-font-size : 16 !default;
|
||||
|
||||
/* paragraph indention */
|
||||
$paragraph-indent : false !default; // true, false (default)
|
||||
$indent-var : 1.3em !default;
|
||||
|
||||
/* system typefaces */
|
||||
$serif : Georgia, Times, serif !default;
|
||||
$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif !default;
|
||||
$monospace : Monaco, Consolas, "Lucida Console", monospace !default;
|
||||
|
||||
/* sans serif typefaces */
|
||||
$sans-serif-narrow : $sans-serif !default;
|
||||
$helvetica : Helvetica, "Helvetica Neue", Arial, sans-serif !default;
|
||||
|
||||
/* serif typefaces */
|
||||
$georgia : Georgia, serif !default;
|
||||
$times : Times, serif !default;
|
||||
$bodoni : "Bodoni MT", serif !default;
|
||||
$calisto : "Calisto MT", serif !default;
|
||||
$garamond : Garamond, serif !default;
|
||||
|
||||
$global-font-family : $sans-serif !default;
|
||||
$header-font-family : $sans-serif !default;
|
||||
$caption-font-family : $serif !default;
|
||||
|
||||
/* type scale */
|
||||
$type-size-1 : 2.441em !default; // ~39.056px
|
||||
$type-size-2 : 1.953em !default; // ~31.248px
|
||||
$type-size-3 : 1.563em !default; // ~25.008px
|
||||
$type-size-4 : 1.25em !default; // ~20px
|
||||
$type-size-5 : 1em !default;
|
||||
$type-size-6 : 0.75em !default; // ~12px
|
||||
$type-size-7 : 0.6875em !default; // ~11px
|
||||
$type-size-8 : 0.625em !default; // ~10px
|
||||
|
||||
|
||||
/*
|
||||
Colors
|
||||
========================================================================== */
|
||||
|
||||
$gray : #7a8288 !default;
|
||||
$dark-gray : mix(#000, $gray, 40%) !default;
|
||||
$darker-gray : mix(#000, $gray, 60%) !default;
|
||||
$light-gray : mix(#fff, $gray, 50%) !default;
|
||||
$lighter-gray : mix(#fff, $gray, 90%) !default;
|
||||
|
||||
$background-color : #fff !default;
|
||||
$code-background-color : #fafafa !default;
|
||||
$code-background-color-dark : $light-gray !default;
|
||||
$text-color : $dark-gray !default;
|
||||
$muted-text-color : mix(#fff, $text-color, 35%) !default;
|
||||
$border-color : $lighter-gray !default;
|
||||
$form-background-color : $lighter-gray !default;
|
||||
$footer-background-color : $lighter-gray !default;
|
||||
|
||||
$primary-color : #88C0D0 !default;
|
||||
$success-color : #A3BE8C !default;
|
||||
$warning-color : #D08770 !default;
|
||||
$danger-color : #BF616A !default;
|
||||
$info-color : #5E81AC !default;
|
||||
|
||||
/* YIQ color contrast */
|
||||
$yiq-contrasted-dark-default : $dark-gray !default;
|
||||
$yiq-contrasted-light-default : #fff !default;
|
||||
$yiq-contrasted-threshold : 175 !default;
|
||||
$yiq-debug : false !default;
|
||||
|
||||
/* brands */
|
||||
$behance-color : #1769FF !default;
|
||||
$bitbucket-color : #205081 !default;
|
||||
$dribbble-color : #ea4c89 !default;
|
||||
$facebook-color : #3b5998 !default;
|
||||
$flickr-color : #ff0084 !default;
|
||||
$foursquare-color : #0072b1 !default;
|
||||
$github-color : #171516 !default;
|
||||
$google-plus-color : #dd4b39 !default;
|
||||
$instagram-color : #517fa4 !default;
|
||||
$lastfm-color : #d51007 !default;
|
||||
$linkedin-color : #007bb6 !default;
|
||||
$pinterest-color : #cb2027 !default;
|
||||
$rss-color : #fa9b39 !default;
|
||||
$soundcloud-color : #ff3300 !default;
|
||||
$stackoverflow-color : #fe7a15 !default;
|
||||
$tumblr-color : #32506d !default;
|
||||
$twitter-color : #55acee !default;
|
||||
$vimeo-color : #1ab7ea !default;
|
||||
$vine-color : #00bf8f !default;
|
||||
$youtube-color : #bb0000 !default;
|
||||
$xing-color : #006567 !default;
|
||||
|
||||
/* links */
|
||||
$link-color : mix(#fff, $info-color, 15%) !default;
|
||||
$link-color-hover : mix(#fff, $link-color, 25%) !default;
|
||||
$link-color-visited : mix(#000, $link-color, 25%) !default;
|
||||
$masthead-link-color : $primary-color !default;
|
||||
$masthead-link-color-hover : mix(#fff, $primary-color, 25%) !default;
|
||||
$navicon-link-color-hover : mix(#fff, $primary-color, 75%) !default;
|
||||
|
||||
/*
|
||||
Breakpoints
|
||||
========================================================================== */
|
||||
|
||||
$small : 600px !default;
|
||||
$medium : 768px !default;
|
||||
$medium-wide : 900px !default;
|
||||
$large : 1024px !default;
|
||||
$x-large : 1280px !default;
|
||||
|
||||
|
||||
/*
|
||||
Grid
|
||||
========================================================================== */
|
||||
|
||||
$right-sidebar-width-narrow : 200px !default;
|
||||
$right-sidebar-width : 300px !default;
|
||||
$right-sidebar-width-wide : 400px !default;
|
||||
|
||||
|
||||
/*
|
||||
Other
|
||||
========================================================================== */
|
||||
|
||||
$border-radius : 4px !default;
|
||||
$box-shadow : 0 1px 1px rgba(0, 0, 0, 0.125) !default;
|
||||
$navicon-width : 1.3rem !default;
|
||||
$navicon-height : 0.22rem !default;
|
||||
$global-transition : all 0.2s ease-in-out !default;
|
||||
$intro-transition : intro 0.3s both !default;
|
||||
23
_sass/minimal-mistakes/skins/_air.scss
Normal file
23
_sass/minimal-mistakes/skins/_air.scss
Normal file
@@ -0,0 +1,23 @@
|
||||
/* ==========================================================================
|
||||
Air skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$background-color: #eeeeee !default;
|
||||
$text-color: #222831 !default;
|
||||
$muted-text-color: #393e46 !default;
|
||||
$primary-color: #0092ca !default;
|
||||
$border-color: mix(#fff, #393e46, 75%) !default;
|
||||
$footer-background-color: $primary-color !default;
|
||||
$link-color: #393e46 !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: $text-color !default;
|
||||
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
|
||||
|
||||
.page__footer {
|
||||
color: #fff !important; // override
|
||||
}
|
||||
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
34
_sass/minimal-mistakes/skins/_contrast.scss
Normal file
34
_sass/minimal-mistakes/skins/_contrast.scss
Normal file
@@ -0,0 +1,34 @@
|
||||
/* ==========================================================================
|
||||
Contrast skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$text-color: #000 !default;
|
||||
$muted-text-color: $text-color !default;
|
||||
$primary-color: #ff0000 !default;
|
||||
$border-color: mix(#fff, $text-color, 75%) !default;
|
||||
$footer-background-color: #000 !default;
|
||||
$link-color: #0000ff !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: $text-color !default;
|
||||
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
|
||||
|
||||
.page__content {
|
||||
|
||||
.notice,
|
||||
.notice--primary,
|
||||
.notice--info,
|
||||
.notice--warning,
|
||||
.notice--success,
|
||||
.notice--danger {
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
|
||||
.page__footer {
|
||||
color: #fff !important; // override
|
||||
}
|
||||
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
24
_sass/minimal-mistakes/skins/_dark.scss
Normal file
24
_sass/minimal-mistakes/skins/_dark.scss
Normal file
@@ -0,0 +1,24 @@
|
||||
/* ==========================================================================
|
||||
Dark skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$background-color: #252a34 !default;
|
||||
$text-color: #eaeaea !default;
|
||||
$primary-color: #00adb5 !default;
|
||||
$border-color: mix(#fff, $background-color, 20%) !default;
|
||||
$code-background-color: mix(#000, $background-color, 15%) !default;
|
||||
$code-background-color-dark: mix(#000, $background-color, 20%) !default;
|
||||
$form-background-color: mix(#000, $background-color, 15%) !default;
|
||||
$footer-background-color: mix(#000, $background-color, 30%) !default;
|
||||
$link-color: mix($primary-color, $text-color, 40%) !default;
|
||||
$link-color-hover: mix(#fff, $link-color, 25%) !default;
|
||||
$link-color-visited: mix(#000, $link-color, 25%) !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
|
||||
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
|
||||
|
||||
.author__urls.social-icons .fa,
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
5
_sass/minimal-mistakes/skins/_default.scss
Normal file
5
_sass/minimal-mistakes/skins/_default.scss
Normal file
@@ -0,0 +1,5 @@
|
||||
/* ==========================================================================
|
||||
Default skin
|
||||
========================================================================== */
|
||||
|
||||
// Intentionally left blank
|
||||
15
_sass/minimal-mistakes/skins/_dirt.scss
Normal file
15
_sass/minimal-mistakes/skins/_dirt.scss
Normal file
@@ -0,0 +1,15 @@
|
||||
/* ==========================================================================
|
||||
Dirt skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$background-color: #f3f3f3 !default;
|
||||
$text-color: #343434 !default;
|
||||
$muted-text-color: #8e8b82 !default;
|
||||
$primary-color: #343434 !default;
|
||||
$border-color: #e9dcbe !default;
|
||||
$footer-background-color: #e9dcbe !default;
|
||||
$link-color: #343434 !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: $text-color !default;
|
||||
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
|
||||
23
_sass/minimal-mistakes/skins/_mint.scss
Normal file
23
_sass/minimal-mistakes/skins/_mint.scss
Normal file
@@ -0,0 +1,23 @@
|
||||
/* ==========================================================================
|
||||
Mint skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$background-color: #f3f6f6 !default;
|
||||
$text-color: #40514e !default;
|
||||
$muted-text-color: #40514e !default;
|
||||
$primary-color: #11999e !default;
|
||||
$border-color: mix(#fff, #40514e, 75%) !default;
|
||||
$footer-background-color: #30e3ca !default;
|
||||
$link-color: #11999e !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: $text-color !default;
|
||||
$navicon-link-color-hover: mix(#fff, $text-color, 80%) !default;
|
||||
|
||||
.page__footer {
|
||||
color: #fff !important; // override
|
||||
}
|
||||
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
24
_sass/minimal-mistakes/skins/_nord.scss
Normal file
24
_sass/minimal-mistakes/skins/_nord.scss
Normal file
@@ -0,0 +1,24 @@
|
||||
/* ==========================================================================
|
||||
Nord skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$background-color: #2E3440 !default;
|
||||
$text-color: #D8DEE9 !default;
|
||||
$primary-color: #88C0D0 !default;
|
||||
$border-color: mix(#fff, $background-color, 20%) !default;
|
||||
$code-background-color: mix(#000, $background-color, 15%) !default;
|
||||
$code-background-color-dark: mix(#000, $background-color, 20%) !default;
|
||||
$form-background-color: mix(#000, $background-color, 15%) !default;
|
||||
$footer-background-color: mix(#000, $background-color, 30%) !default;
|
||||
$link-color: mix($primary-color, $text-color, 40%) !default;
|
||||
$link-color-hover: mix(#fff, $link-color, 25%) !default;
|
||||
$link-color-visited: mix(#000, $link-color, 25%) !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
|
||||
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
|
||||
|
||||
.author__urls.social-icons .fa,
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
26
_sass/minimal-mistakes/skins/_sunrise.scss
Normal file
26
_sass/minimal-mistakes/skins/_sunrise.scss
Normal file
@@ -0,0 +1,26 @@
|
||||
/* ==========================================================================
|
||||
Sunrise skin
|
||||
========================================================================== */
|
||||
|
||||
/* Colors */
|
||||
$dark-gray: #0e2431 !default;
|
||||
$background-color: #e8d5b7 !default;
|
||||
$text-color: #000 !default;
|
||||
$muted-text-color: $dark-gray !default;
|
||||
$primary-color: #fc3a52 !default;
|
||||
$border-color: mix(#000, $background-color, 20%) !default;
|
||||
$code-background-color: mix(#fff, $background-color, 20%) !default;
|
||||
$code-background-color-dark: mix(#000, $background-color, 10%) !default;
|
||||
$form-background-color: mix(#fff, $background-color, 15%) !default;
|
||||
$footer-background-color: #f9b248 !default;
|
||||
$link-color: mix(#000, $primary-color, 10%) !default;
|
||||
$link-color-hover: mix(#fff, $link-color, 25%) !default;
|
||||
$link-color-visited: mix(#000, $link-color, 25%) !default;
|
||||
$masthead-link-color: $text-color !default;
|
||||
$masthead-link-color-hover: mix(#000, $text-color, 20%) !default;
|
||||
$navicon-link-color-hover: mix(#000, $background-color, 30%) !default;
|
||||
|
||||
.author__urls.social-icons .fa,
|
||||
.page__footer-follow .social-icons .fa {
|
||||
color: inherit;
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Font Awesome 4.6.3 by @davegandy - http://fontawesome.io - @fontawesome
|
||||
* Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
|
||||
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
|
||||
*/
|
||||
|
||||
@@ -605,6 +605,7 @@
|
||||
.#{$fa-css-prefix}-opencart:before { content: $fa-var-opencart; }
|
||||
.#{$fa-css-prefix}-expeditedssl:before { content: $fa-var-expeditedssl; }
|
||||
.#{$fa-css-prefix}-battery-4:before,
|
||||
.#{$fa-css-prefix}-battery:before,
|
||||
.#{$fa-css-prefix}-battery-full:before { content: $fa-var-battery-full; }
|
||||
.#{$fa-css-prefix}-battery-3:before,
|
||||
.#{$fa-css-prefix}-battery-three-quarters:before { content: $fa-var-battery-three-quarters; }
|
||||
@@ -731,3 +732,58 @@
|
||||
.#{$fa-css-prefix}-google-plus-official:before { content: $fa-var-google-plus-official; }
|
||||
.#{$fa-css-prefix}-fa:before,
|
||||
.#{$fa-css-prefix}-font-awesome:before { content: $fa-var-font-awesome; }
|
||||
.#{$fa-css-prefix}-handshake-o:before { content: $fa-var-handshake-o; }
|
||||
.#{$fa-css-prefix}-envelope-open:before { content: $fa-var-envelope-open; }
|
||||
.#{$fa-css-prefix}-envelope-open-o:before { content: $fa-var-envelope-open-o; }
|
||||
.#{$fa-css-prefix}-linode:before { content: $fa-var-linode; }
|
||||
.#{$fa-css-prefix}-address-book:before { content: $fa-var-address-book; }
|
||||
.#{$fa-css-prefix}-address-book-o:before { content: $fa-var-address-book-o; }
|
||||
.#{$fa-css-prefix}-vcard:before,
|
||||
.#{$fa-css-prefix}-address-card:before { content: $fa-var-address-card; }
|
||||
.#{$fa-css-prefix}-vcard-o:before,
|
||||
.#{$fa-css-prefix}-address-card-o:before { content: $fa-var-address-card-o; }
|
||||
.#{$fa-css-prefix}-user-circle:before { content: $fa-var-user-circle; }
|
||||
.#{$fa-css-prefix}-user-circle-o:before { content: $fa-var-user-circle-o; }
|
||||
.#{$fa-css-prefix}-user-o:before { content: $fa-var-user-o; }
|
||||
.#{$fa-css-prefix}-id-badge:before { content: $fa-var-id-badge; }
|
||||
.#{$fa-css-prefix}-drivers-license:before,
|
||||
.#{$fa-css-prefix}-id-card:before { content: $fa-var-id-card; }
|
||||
.#{$fa-css-prefix}-drivers-license-o:before,
|
||||
.#{$fa-css-prefix}-id-card-o:before { content: $fa-var-id-card-o; }
|
||||
.#{$fa-css-prefix}-quora:before { content: $fa-var-quora; }
|
||||
.#{$fa-css-prefix}-free-code-camp:before { content: $fa-var-free-code-camp; }
|
||||
.#{$fa-css-prefix}-telegram:before { content: $fa-var-telegram; }
|
||||
.#{$fa-css-prefix}-thermometer-4:before,
|
||||
.#{$fa-css-prefix}-thermometer:before,
|
||||
.#{$fa-css-prefix}-thermometer-full:before { content: $fa-var-thermometer-full; }
|
||||
.#{$fa-css-prefix}-thermometer-3:before,
|
||||
.#{$fa-css-prefix}-thermometer-three-quarters:before { content: $fa-var-thermometer-three-quarters; }
|
||||
.#{$fa-css-prefix}-thermometer-2:before,
|
||||
.#{$fa-css-prefix}-thermometer-half:before { content: $fa-var-thermometer-half; }
|
||||
.#{$fa-css-prefix}-thermometer-1:before,
|
||||
.#{$fa-css-prefix}-thermometer-quarter:before { content: $fa-var-thermometer-quarter; }
|
||||
.#{$fa-css-prefix}-thermometer-0:before,
|
||||
.#{$fa-css-prefix}-thermometer-empty:before { content: $fa-var-thermometer-empty; }
|
||||
.#{$fa-css-prefix}-shower:before { content: $fa-var-shower; }
|
||||
.#{$fa-css-prefix}-bathtub:before,
|
||||
.#{$fa-css-prefix}-s15:before,
|
||||
.#{$fa-css-prefix}-bath:before { content: $fa-var-bath; }
|
||||
.#{$fa-css-prefix}-podcast:before { content: $fa-var-podcast; }
|
||||
.#{$fa-css-prefix}-window-maximize:before { content: $fa-var-window-maximize; }
|
||||
.#{$fa-css-prefix}-window-minimize:before { content: $fa-var-window-minimize; }
|
||||
.#{$fa-css-prefix}-window-restore:before { content: $fa-var-window-restore; }
|
||||
.#{$fa-css-prefix}-times-rectangle:before,
|
||||
.#{$fa-css-prefix}-window-close:before { content: $fa-var-window-close; }
|
||||
.#{$fa-css-prefix}-times-rectangle-o:before,
|
||||
.#{$fa-css-prefix}-window-close-o:before { content: $fa-var-window-close-o; }
|
||||
.#{$fa-css-prefix}-bandcamp:before { content: $fa-var-bandcamp; }
|
||||
.#{$fa-css-prefix}-grav:before { content: $fa-var-grav; }
|
||||
.#{$fa-css-prefix}-etsy:before { content: $fa-var-etsy; }
|
||||
.#{$fa-css-prefix}-imdb:before { content: $fa-var-imdb; }
|
||||
.#{$fa-css-prefix}-ravelry:before { content: $fa-var-ravelry; }
|
||||
.#{$fa-css-prefix}-eercast:before { content: $fa-var-eercast; }
|
||||
.#{$fa-css-prefix}-microchip:before { content: $fa-var-microchip; }
|
||||
.#{$fa-css-prefix}-snowflake-o:before { content: $fa-var-snowflake-o; }
|
||||
.#{$fa-css-prefix}-superpowers:before { content: $fa-var-superpowers; }
|
||||
.#{$fa-css-prefix}-wpexplorer:before { content: $fa-var-wpexplorer; }
|
||||
.#{$fa-css-prefix}-meetup:before { content: $fa-var-meetup; }
|
||||
@@ -4,14 +4,18 @@
|
||||
$fa-font-path: "../fonts" !default;
|
||||
$fa-font-size-base: 14px !default;
|
||||
$fa-line-height-base: 1 !default;
|
||||
//$fa-font-path: "//netdna.bootstrapcdn.com/font-awesome/4.6.3/fonts" !default; // for referencing Bootstrap CDN font files directly
|
||||
//$fa-font-path: "//netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts" !default; // for referencing Bootstrap CDN font files directly
|
||||
$fa-css-prefix: fa !default;
|
||||
$fa-version: "4.6.3" !default;
|
||||
$fa-version: "4.7.0" !default;
|
||||
$fa-border-color: #eee !default;
|
||||
$fa-inverse: #fff !default;
|
||||
$fa-li-width: (30em / 14) !default;
|
||||
|
||||
$fa-var-500px: "\f26e";
|
||||
$fa-var-address-book: "\f2b9";
|
||||
$fa-var-address-book-o: "\f2ba";
|
||||
$fa-var-address-card: "\f2bb";
|
||||
$fa-var-address-card-o: "\f2bc";
|
||||
$fa-var-adjust: "\f042";
|
||||
$fa-var-adn: "\f170";
|
||||
$fa-var-align-center: "\f037";
|
||||
@@ -60,11 +64,15 @@ $fa-var-automobile: "\f1b9";
|
||||
$fa-var-backward: "\f04a";
|
||||
$fa-var-balance-scale: "\f24e";
|
||||
$fa-var-ban: "\f05e";
|
||||
$fa-var-bandcamp: "\f2d5";
|
||||
$fa-var-bank: "\f19c";
|
||||
$fa-var-bar-chart: "\f080";
|
||||
$fa-var-bar-chart-o: "\f080";
|
||||
$fa-var-barcode: "\f02a";
|
||||
$fa-var-bars: "\f0c9";
|
||||
$fa-var-bath: "\f2cd";
|
||||
$fa-var-bathtub: "\f2cd";
|
||||
$fa-var-battery: "\f240";
|
||||
$fa-var-battery-0: "\f244";
|
||||
$fa-var-battery-1: "\f243";
|
||||
$fa-var-battery-2: "\f242";
|
||||
@@ -214,19 +222,25 @@ $fa-var-dollar: "\f155";
|
||||
$fa-var-dot-circle-o: "\f192";
|
||||
$fa-var-download: "\f019";
|
||||
$fa-var-dribbble: "\f17d";
|
||||
$fa-var-drivers-license: "\f2c2";
|
||||
$fa-var-drivers-license-o: "\f2c3";
|
||||
$fa-var-dropbox: "\f16b";
|
||||
$fa-var-drupal: "\f1a9";
|
||||
$fa-var-edge: "\f282";
|
||||
$fa-var-edit: "\f044";
|
||||
$fa-var-eercast: "\f2da";
|
||||
$fa-var-eject: "\f052";
|
||||
$fa-var-ellipsis-h: "\f141";
|
||||
$fa-var-ellipsis-v: "\f142";
|
||||
$fa-var-empire: "\f1d1";
|
||||
$fa-var-envelope: "\f0e0";
|
||||
$fa-var-envelope-o: "\f003";
|
||||
$fa-var-envelope-open: "\f2b6";
|
||||
$fa-var-envelope-open-o: "\f2b7";
|
||||
$fa-var-envelope-square: "\f199";
|
||||
$fa-var-envira: "\f299";
|
||||
$fa-var-eraser: "\f12d";
|
||||
$fa-var-etsy: "\f2d7";
|
||||
$fa-var-eur: "\f153";
|
||||
$fa-var-euro: "\f153";
|
||||
$fa-var-exchange: "\f0ec";
|
||||
@@ -294,6 +308,7 @@ $fa-var-fort-awesome: "\f286";
|
||||
$fa-var-forumbee: "\f211";
|
||||
$fa-var-forward: "\f04e";
|
||||
$fa-var-foursquare: "\f180";
|
||||
$fa-var-free-code-camp: "\f2c5";
|
||||
$fa-var-frown-o: "\f119";
|
||||
$fa-var-futbol-o: "\f1e3";
|
||||
$fa-var-gamepad: "\f11b";
|
||||
@@ -326,6 +341,7 @@ $fa-var-google-plus-square: "\f0d4";
|
||||
$fa-var-google-wallet: "\f1ee";
|
||||
$fa-var-graduation-cap: "\f19d";
|
||||
$fa-var-gratipay: "\f184";
|
||||
$fa-var-grav: "\f2d6";
|
||||
$fa-var-group: "\f0c0";
|
||||
$fa-var-h-square: "\f0fd";
|
||||
$fa-var-hacker-news: "\f1d4";
|
||||
@@ -342,6 +358,7 @@ $fa-var-hand-rock-o: "\f255";
|
||||
$fa-var-hand-scissors-o: "\f257";
|
||||
$fa-var-hand-spock-o: "\f259";
|
||||
$fa-var-hand-stop-o: "\f256";
|
||||
$fa-var-handshake-o: "\f2b5";
|
||||
$fa-var-hard-of-hearing: "\f2a4";
|
||||
$fa-var-hashtag: "\f292";
|
||||
$fa-var-hdd-o: "\f0a0";
|
||||
@@ -365,8 +382,12 @@ $fa-var-hourglass-start: "\f251";
|
||||
$fa-var-houzz: "\f27c";
|
||||
$fa-var-html5: "\f13b";
|
||||
$fa-var-i-cursor: "\f246";
|
||||
$fa-var-id-badge: "\f2c1";
|
||||
$fa-var-id-card: "\f2c2";
|
||||
$fa-var-id-card-o: "\f2c3";
|
||||
$fa-var-ils: "\f20b";
|
||||
$fa-var-image: "\f03e";
|
||||
$fa-var-imdb: "\f2d8";
|
||||
$fa-var-inbox: "\f01c";
|
||||
$fa-var-indent: "\f03c";
|
||||
$fa-var-industry: "\f275";
|
||||
@@ -404,6 +425,7 @@ $fa-var-line-chart: "\f201";
|
||||
$fa-var-link: "\f0c1";
|
||||
$fa-var-linkedin: "\f0e1";
|
||||
$fa-var-linkedin-square: "\f08c";
|
||||
$fa-var-linode: "\f2b8";
|
||||
$fa-var-linux: "\f17c";
|
||||
$fa-var-list: "\f03a";
|
||||
$fa-var-list-alt: "\f022";
|
||||
@@ -436,8 +458,10 @@ $fa-var-maxcdn: "\f136";
|
||||
$fa-var-meanpath: "\f20c";
|
||||
$fa-var-medium: "\f23a";
|
||||
$fa-var-medkit: "\f0fa";
|
||||
$fa-var-meetup: "\f2e0";
|
||||
$fa-var-meh-o: "\f11a";
|
||||
$fa-var-mercury: "\f223";
|
||||
$fa-var-microchip: "\f2db";
|
||||
$fa-var-microphone: "\f130";
|
||||
$fa-var-microphone-slash: "\f131";
|
||||
$fa-var-minus: "\f068";
|
||||
@@ -502,6 +526,7 @@ $fa-var-plus: "\f067";
|
||||
$fa-var-plus-circle: "\f055";
|
||||
$fa-var-plus-square: "\f0fe";
|
||||
$fa-var-plus-square-o: "\f196";
|
||||
$fa-var-podcast: "\f2ce";
|
||||
$fa-var-power-off: "\f011";
|
||||
$fa-var-print: "\f02f";
|
||||
$fa-var-product-hunt: "\f288";
|
||||
@@ -511,10 +536,12 @@ $fa-var-qrcode: "\f029";
|
||||
$fa-var-question: "\f128";
|
||||
$fa-var-question-circle: "\f059";
|
||||
$fa-var-question-circle-o: "\f29c";
|
||||
$fa-var-quora: "\f2c4";
|
||||
$fa-var-quote-left: "\f10d";
|
||||
$fa-var-quote-right: "\f10e";
|
||||
$fa-var-ra: "\f1d0";
|
||||
$fa-var-random: "\f074";
|
||||
$fa-var-ravelry: "\f2d9";
|
||||
$fa-var-rebel: "\f1d0";
|
||||
$fa-var-recycle: "\f1b8";
|
||||
$fa-var-reddit: "\f1a1";
|
||||
@@ -541,6 +568,7 @@ $fa-var-rss-square: "\f143";
|
||||
$fa-var-rub: "\f158";
|
||||
$fa-var-ruble: "\f158";
|
||||
$fa-var-rupee: "\f156";
|
||||
$fa-var-s15: "\f2cd";
|
||||
$fa-var-safari: "\f267";
|
||||
$fa-var-save: "\f0c7";
|
||||
$fa-var-scissors: "\f0c4";
|
||||
@@ -565,6 +593,7 @@ $fa-var-shirtsinbulk: "\f214";
|
||||
$fa-var-shopping-bag: "\f290";
|
||||
$fa-var-shopping-basket: "\f291";
|
||||
$fa-var-shopping-cart: "\f07a";
|
||||
$fa-var-shower: "\f2cc";
|
||||
$fa-var-sign-in: "\f090";
|
||||
$fa-var-sign-language: "\f2a7";
|
||||
$fa-var-sign-out: "\f08b";
|
||||
@@ -581,6 +610,7 @@ $fa-var-smile-o: "\f118";
|
||||
$fa-var-snapchat: "\f2ab";
|
||||
$fa-var-snapchat-ghost: "\f2ac";
|
||||
$fa-var-snapchat-square: "\f2ad";
|
||||
$fa-var-snowflake-o: "\f2dc";
|
||||
$fa-var-soccer-ball-o: "\f1e3";
|
||||
$fa-var-sort: "\f0dc";
|
||||
$fa-var-sort-alpha-asc: "\f15d";
|
||||
@@ -626,6 +656,7 @@ $fa-var-subscript: "\f12c";
|
||||
$fa-var-subway: "\f239";
|
||||
$fa-var-suitcase: "\f0f2";
|
||||
$fa-var-sun-o: "\f185";
|
||||
$fa-var-superpowers: "\f2dd";
|
||||
$fa-var-superscript: "\f12b";
|
||||
$fa-var-support: "\f1cd";
|
||||
$fa-var-table: "\f0ce";
|
||||
@@ -635,6 +666,7 @@ $fa-var-tag: "\f02b";
|
||||
$fa-var-tags: "\f02c";
|
||||
$fa-var-tasks: "\f0ae";
|
||||
$fa-var-taxi: "\f1ba";
|
||||
$fa-var-telegram: "\f2c6";
|
||||
$fa-var-television: "\f26c";
|
||||
$fa-var-tencent-weibo: "\f1d5";
|
||||
$fa-var-terminal: "\f120";
|
||||
@@ -644,6 +676,17 @@ $fa-var-th: "\f00a";
|
||||
$fa-var-th-large: "\f009";
|
||||
$fa-var-th-list: "\f00b";
|
||||
$fa-var-themeisle: "\f2b2";
|
||||
$fa-var-thermometer: "\f2c7";
|
||||
$fa-var-thermometer-0: "\f2cb";
|
||||
$fa-var-thermometer-1: "\f2ca";
|
||||
$fa-var-thermometer-2: "\f2c9";
|
||||
$fa-var-thermometer-3: "\f2c8";
|
||||
$fa-var-thermometer-4: "\f2c7";
|
||||
$fa-var-thermometer-empty: "\f2cb";
|
||||
$fa-var-thermometer-full: "\f2c7";
|
||||
$fa-var-thermometer-half: "\f2c9";
|
||||
$fa-var-thermometer-quarter: "\f2ca";
|
||||
$fa-var-thermometer-three-quarters: "\f2c8";
|
||||
$fa-var-thumb-tack: "\f08d";
|
||||
$fa-var-thumbs-down: "\f165";
|
||||
$fa-var-thumbs-o-down: "\f088";
|
||||
@@ -653,6 +696,8 @@ $fa-var-ticket: "\f145";
|
||||
$fa-var-times: "\f00d";
|
||||
$fa-var-times-circle: "\f057";
|
||||
$fa-var-times-circle-o: "\f05c";
|
||||
$fa-var-times-rectangle: "\f2d3";
|
||||
$fa-var-times-rectangle-o: "\f2d4";
|
||||
$fa-var-tint: "\f043";
|
||||
$fa-var-toggle-down: "\f150";
|
||||
$fa-var-toggle-left: "\f191";
|
||||
@@ -693,11 +738,16 @@ $fa-var-upload: "\f093";
|
||||
$fa-var-usb: "\f287";
|
||||
$fa-var-usd: "\f155";
|
||||
$fa-var-user: "\f007";
|
||||
$fa-var-user-circle: "\f2bd";
|
||||
$fa-var-user-circle-o: "\f2be";
|
||||
$fa-var-user-md: "\f0f0";
|
||||
$fa-var-user-o: "\f2c0";
|
||||
$fa-var-user-plus: "\f234";
|
||||
$fa-var-user-secret: "\f21b";
|
||||
$fa-var-user-times: "\f235";
|
||||
$fa-var-users: "\f0c0";
|
||||
$fa-var-vcard: "\f2bb";
|
||||
$fa-var-vcard-o: "\f2bc";
|
||||
$fa-var-venus: "\f221";
|
||||
$fa-var-venus-double: "\f226";
|
||||
$fa-var-venus-mars: "\f228";
|
||||
@@ -722,10 +772,16 @@ $fa-var-wheelchair: "\f193";
|
||||
$fa-var-wheelchair-alt: "\f29b";
|
||||
$fa-var-wifi: "\f1eb";
|
||||
$fa-var-wikipedia-w: "\f266";
|
||||
$fa-var-window-close: "\f2d3";
|
||||
$fa-var-window-close-o: "\f2d4";
|
||||
$fa-var-window-maximize: "\f2d0";
|
||||
$fa-var-window-minimize: "\f2d1";
|
||||
$fa-var-window-restore: "\f2d2";
|
||||
$fa-var-windows: "\f17a";
|
||||
$fa-var-won: "\f159";
|
||||
$fa-var-wordpress: "\f19a";
|
||||
$fa-var-wpbeginner: "\f297";
|
||||
$fa-var-wpexplorer: "\f2de";
|
||||
$fa-var-wpforms: "\f298";
|
||||
$fa-var-wrench: "\f0ad";
|
||||
$fa-var-xing: "\f168";
|
||||
@@ -43,4 +43,4 @@ $mfp-caption-subtitle-color: #bdbdbd; // Caption sub
|
||||
.mfp-counter { font-family: $serif; } // Caption font family
|
||||
|
||||
// A11y
|
||||
$mfp-use-visuallyhidden: false;
|
||||
$mfp-use-visuallyhidden: false;
|
||||
13
_sass/minimal-mistakes/vendor/susy/_susy-prefix.scss
vendored
Normal file
13
_sass/minimal-mistakes/vendor/susy/_susy-prefix.scss
vendored
Normal file
@@ -0,0 +1,13 @@
|
||||
// Susy (Prefixed)
|
||||
// ===============
|
||||
|
||||
$susy-version: 3;
|
||||
|
||||
@import 'susy/utilities';
|
||||
@import 'susy/su-validate';
|
||||
@import 'susy/su-math';
|
||||
@import 'susy/settings';
|
||||
@import 'susy/normalize';
|
||||
@import 'susy/parse';
|
||||
@import 'susy/syntax-helpers';
|
||||
@import 'susy/api';
|
||||
5
_sass/minimal-mistakes/vendor/susy/_susy.scss
vendored
Normal file
5
_sass/minimal-mistakes/vendor/susy/_susy.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
// Susy (Un-Prefixed)
|
||||
// ==================
|
||||
|
||||
@import 'susy-prefix';
|
||||
@import 'susy/unprefix';
|
||||
5
_sass/minimal-mistakes/vendor/susy/plugins/_svg-grid.scss
vendored
Normal file
5
_sass/minimal-mistakes/vendor/susy/plugins/_svg-grid.scss
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
// SVG Grid Background
|
||||
// ===================
|
||||
|
||||
@import 'svg-grid/prefix';
|
||||
@import 'svg-grid/svg-unprefix';
|
||||
7
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_prefix.scss
vendored
Normal file
7
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_prefix.scss
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
// Prefixed SVG Plugin
|
||||
// ===================
|
||||
|
||||
@import 'svg-settings';
|
||||
@import 'svg-utilities';
|
||||
@import 'svg-grid-math';
|
||||
@import 'svg-api';
|
||||
114
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-api.scss
vendored
Normal file
114
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-api.scss
vendored
Normal file
@@ -0,0 +1,114 @@
|
||||
/// Plugin: SVG Grid Image
|
||||
/// ======================
|
||||
/// @group plugin_svg-grid
|
||||
/// @see susy-svg-grid
|
||||
|
||||
|
||||
|
||||
/// ## Overview
|
||||
/// If you want to generate svg-backgrounds
|
||||
/// for help visualizing and debugging your grids,
|
||||
/// import the SVG Grid Plugin.
|
||||
///
|
||||
/// The plugin adds `svg-grid-colors` setting
|
||||
/// to your global defaults,
|
||||
/// which you can override in `$susy`.
|
||||
/// It also provides you with a new function,
|
||||
/// `susy-svg-grid()`,
|
||||
/// which will return inline svg for use in
|
||||
/// backgrounds or generated content.
|
||||
///
|
||||
/// This function come with an unprefixed alias by default,
|
||||
/// using the `svg-grid` import.
|
||||
/// If you only only want prefixed versions of the API,
|
||||
/// import the `svg-grid/prefix` partial instead.
|
||||
///
|
||||
/// @group plugin_svg-grid
|
||||
///
|
||||
/// @example scss - importing the plugin
|
||||
/// // The full path to import Susy will depend on your setup…
|
||||
///
|
||||
/// // unprefixed
|
||||
/// @import 'plugins/svg-grid';
|
||||
///
|
||||
/// // prefixed
|
||||
/// @import 'plugins/svg-grid/prefix';
|
||||
///
|
||||
/// @example scss - generating background grids
|
||||
/// .grid {
|
||||
/// background: susy-svg-grid() no-repeat scroll;
|
||||
/// }
|
||||
|
||||
|
||||
|
||||
// SVG Grid
|
||||
// --------
|
||||
/// Return inline svg-data in to display the grid.
|
||||
///
|
||||
/// @group plugin_svg-grid
|
||||
///
|
||||
/// @param {Map | List} $grid [$susy] -
|
||||
/// Map or shorthand defining the current grid
|
||||
/// @param {Color | List | null} $colors [null] -
|
||||
/// Column color, or list of colors for column-gradient,
|
||||
/// used to override the global `svg-grid-colors` setting
|
||||
/// @param {Length | null} $offset [null] -
|
||||
/// Manually override the default grid-image offset,
|
||||
/// to account for grid edges
|
||||
///
|
||||
/// @return {String} -
|
||||
/// CSS inline-data SVG string, in `url(<svg>)` format,
|
||||
/// for use in image or content properties
|
||||
/// @example scss
|
||||
/// .grid {
|
||||
/// background: susy-svg-grid() no-repeat scroll;
|
||||
/// }
|
||||
@function susy-svg-grid(
|
||||
$grid: $susy,
|
||||
$colors: null,
|
||||
$offset: null
|
||||
) {
|
||||
// Grid parsing & normalizing
|
||||
$grid: susy-compile($grid, $context-only: true);
|
||||
|
||||
// Color and gradient handling
|
||||
$gradient: '';
|
||||
|
||||
@if (not $colors) {
|
||||
$colors: susy-get('svg-grid-colors');
|
||||
}
|
||||
|
||||
@if length($colors) > 1 {
|
||||
$gradient: _susy-svg-gradient($colors);
|
||||
$colors: 'url(%23susy-svg-gradient)';
|
||||
} @else {
|
||||
$colors: _susy-svg-color($colors);
|
||||
}
|
||||
|
||||
// Get a default image-width
|
||||
$span: (
|
||||
'span': map-get($grid, 'columns'),
|
||||
'spread': map-get($grid, 'container-spread'),
|
||||
);
|
||||
$span: map-merge($grid, $span);
|
||||
$image-width: su-call('su-span', $span);
|
||||
$image-width: if((type-of($image-width) == 'number'), $image-width, 100%);
|
||||
|
||||
// SVG construction
|
||||
$columns: map-get($grid, 'columns');
|
||||
$offset: $offset or _susy-svg-offset($grid);
|
||||
|
||||
$attrs: 'fill="#{$colors}" width="#{$image-width}"';
|
||||
$svg: 'data:image/svg+xml,';
|
||||
$svg: $svg + '%3Csvg xmlns="http://www.w3.org/2000/svg" #{$attrs} %3E';
|
||||
$svg: $svg + $gradient;
|
||||
|
||||
@for $column from 1 through length($columns) {
|
||||
$width: susy-span(1 narrow at $column, $grid);
|
||||
$x: _susy-svg-column-position($column, $grid);
|
||||
|
||||
$svg: $svg + _susy-svg-rect($x, $width, $offset);
|
||||
}
|
||||
|
||||
@return url('#{$svg}%3C/svg%3E');
|
||||
}
|
||||
67
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-grid-math.scss
vendored
Normal file
67
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-grid-math.scss
vendored
Normal file
@@ -0,0 +1,67 @@
|
||||
// SVG Grid Math
|
||||
// =============
|
||||
|
||||
|
||||
|
||||
// SVG Column Position
|
||||
// -------------------
|
||||
/// Determine the proper horizontal position
|
||||
/// for a column rectangle
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {Integer} $column -
|
||||
/// 1-indexed column location on the grid
|
||||
/// @param {Map} $grid -
|
||||
/// Normalized settings map representing the current grid
|
||||
///
|
||||
/// @return {Length} -
|
||||
/// Horizontal position of svg column rectangle,
|
||||
/// as distance from the grid edge
|
||||
@function _susy-svg-column-position(
|
||||
$column,
|
||||
$grid
|
||||
) {
|
||||
$x: $column - 1;
|
||||
|
||||
@if ($x > 0) {
|
||||
$x: susy-span(first $x wide, $grid);
|
||||
}
|
||||
|
||||
@return $x;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// SVG Offset
|
||||
// ----------
|
||||
/// Determine if a grid image needs to be offset,
|
||||
/// to account for edge gutters.
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {Map} $grid -
|
||||
/// Normalized settings map representing the current grid
|
||||
///
|
||||
/// @return {Length | null} -
|
||||
/// Expected distance from container edge to first column,
|
||||
/// based on spread values and gutter-widths
|
||||
@function _susy-svg-offset(
|
||||
$grid
|
||||
) {
|
||||
$columns: su-valid-columns(map-get($grid, 'columns'));
|
||||
$gutters: su-valid-gutters(map-get($grid, 'gutters'));
|
||||
$container: su-valid-spread(map-get($grid, 'container-spread')) + 1;
|
||||
|
||||
@if ($container == 0) {
|
||||
@return null;
|
||||
}
|
||||
|
||||
$gutter: su-call('su-gutter', $grid);
|
||||
|
||||
@if (type-of($gutter) == 'string') {
|
||||
@return 'calc(#{$container} * #{$gutter} / 2)';
|
||||
}
|
||||
|
||||
@return $container * $gutter / 2;
|
||||
}
|
||||
14
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-settings.scss
vendored
Normal file
14
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-settings.scss
vendored
Normal file
@@ -0,0 +1,14 @@
|
||||
// SVG Settings
|
||||
// ============
|
||||
|
||||
|
||||
// Susy SVG Defaults
|
||||
// =================
|
||||
/// This plugin adds the `svg-grid-colors` property
|
||||
/// and default value to `$_susy-defaults` —
|
||||
/// you can override that value in `$susy`
|
||||
/// or any other grid settings map.
|
||||
/// @group plugin_svg-grid
|
||||
$_susy-defaults: map-merge((
|
||||
'svg-grid-colors': hsla(120, 50%, 50%, 0.5) hsla(120, 50%, 75%, 0.5),
|
||||
), $_susy-defaults);
|
||||
18
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-unprefix.scss
vendored
Normal file
18
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-unprefix.scss
vendored
Normal file
@@ -0,0 +1,18 @@
|
||||
// Unprefix Susy SVG Grid
|
||||
// ======================
|
||||
|
||||
|
||||
|
||||
// SVG Grid
|
||||
// --------
|
||||
/// Un-prefixed alias for `susy-svg-grid`
|
||||
///
|
||||
/// @group plugin_svg-grid
|
||||
/// @alias susy-svg-grid
|
||||
@function svg-grid(
|
||||
$grid: $susy,
|
||||
$colors: susy-get('svg-grid-colors'),
|
||||
$offset: null
|
||||
) {
|
||||
@return susy-svg-grid($grid, $colors, $offset);
|
||||
}
|
||||
133
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-utilities.scss
vendored
Normal file
133
_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-utilities.scss
vendored
Normal file
@@ -0,0 +1,133 @@
|
||||
// SVG Utilities
|
||||
// =============
|
||||
|
||||
|
||||
|
||||
// SVG Validate Units
|
||||
// ------------------
|
||||
/// Make sure a length is supported in svg
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {Length} $length -
|
||||
/// The length to validate
|
||||
/// @param {String} $name [null] -
|
||||
/// Optional name of length origin,
|
||||
/// for error reporting
|
||||
///
|
||||
/// @return {Length} -
|
||||
/// An svg-validated length, or comparable valid length
|
||||
@function _susy-svg-validate-units(
|
||||
$length,
|
||||
$name: null
|
||||
) {
|
||||
$_svg-units: ('em', 'ex', 'px', 'pt', 'pc', 'cm', 'mm', 'in', '%');
|
||||
$string: type-of($length) == 'string';
|
||||
|
||||
@if ($length == 0) or ($string) or index($_svg-units, unit($length)) {
|
||||
@return $length;
|
||||
}
|
||||
|
||||
@return _susy-error(
|
||||
'`#{unit($length)}` #{$name} units are not supported in SVG',
|
||||
'_susy-svg-validate-units');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// SVG Rect
|
||||
// --------
|
||||
/// Build a single svg rectangle
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {Length} $x -
|
||||
/// Horizontal position for the rectangle
|
||||
/// @param {Length} $width -
|
||||
/// Width of the rectangle
|
||||
/// @param {Length} $offset [null] -
|
||||
/// Offset the rectangle, to account for edge gutters
|
||||
///
|
||||
/// @return {String} -
|
||||
/// Escaped string representing one svg rectangle
|
||||
@function _susy-svg-rect(
|
||||
$x,
|
||||
$width,
|
||||
$offset: null
|
||||
) {
|
||||
$x: _susy-svg-validate-units($x);
|
||||
$width: _susy-svg-validate-units($width);
|
||||
$offset: if($offset == 0, null, $offset);
|
||||
|
||||
@if (type-of($offset) == 'number') and (type-of($x) == 'number') {
|
||||
@if comparable($x, $offset) {
|
||||
$x: $x + $offset;
|
||||
} @else {
|
||||
$x: 'calc(#{$x} + #{$offset})';
|
||||
}
|
||||
} @else if $offset and ($x != 0) {
|
||||
$x: 'calc(#{$x} + #{$offset})';
|
||||
} @else if $offset {
|
||||
$x: $offset;
|
||||
}
|
||||
|
||||
@return '%3Crect x="#{$x}" width="#{$width}" height="100%"/%3E';
|
||||
}
|
||||
|
||||
|
||||
|
||||
// SVG Color
|
||||
// ---------
|
||||
/// Stringify colors, and escape hex symbol
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {Color} $color -
|
||||
/// Color to stringify and escape
|
||||
///
|
||||
/// @return {String} -
|
||||
/// Escaped string value of color
|
||||
@function _susy-svg-color(
|
||||
$color
|
||||
) {
|
||||
$color: inspect($color); // convert to string
|
||||
|
||||
@if (str-index($color, '#') == 1) {
|
||||
$color: '%23' + str-slice($color, 2);
|
||||
}
|
||||
|
||||
@return $color;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// SVG Gradient
|
||||
// ------------
|
||||
/// Create a multi-color svg gradient
|
||||
///
|
||||
/// @access private
|
||||
///
|
||||
/// @param {List} $colors -
|
||||
/// List of colors to be equally spaced from `0%` to `100%`
|
||||
/// in each column rectangle
|
||||
///
|
||||
/// @return {String} -
|
||||
/// Escaped string representing one svg gradient
|
||||
/// (`id="susy-svg-gradient"`)
|
||||
@function _susy-svg-gradient(
|
||||
$colors
|
||||
) {
|
||||
$gradient: '%3Cdefs%3E%3ClinearGradient spreadMethod="pad"';
|
||||
$gradient: '#{$gradient} id="susy-svg-gradient"';
|
||||
$gradient: '#{$gradient} x1="0%" y1="0%" x2="100%" y2="0%"%3E';
|
||||
|
||||
@for $i from 1 through length($colors) {
|
||||
$color: _susy-svg-color(nth($colors, $i));
|
||||
$offset: percentage(($i - 1) / (length($colors) - 1));
|
||||
$stop: '%3Cstop offset="#{$offset}" style="stop-color:#{$color};" /%3E';
|
||||
|
||||
$gradient: $gradient + $stop;
|
||||
}
|
||||
|
||||
@return $gradient + '%3C/linearGradient%3E%3C/defs%3E';
|
||||
}
|
||||
318
_sass/minimal-mistakes/vendor/susy/susy/_api.scss
vendored
Normal file
318
_sass/minimal-mistakes/vendor/susy/susy/_api.scss
vendored
Normal file
@@ -0,0 +1,318 @@
|
||||
/// Susy3 API Functions
|
||||
/// ===================
|
||||
/// These three functions form the core of Susy's
|
||||
/// layout-building grid API.
|
||||
///
|
||||
/// - Use `span()` and `gutter()` to return any grid-width,
|
||||
/// and apply the results wherever you need them:
|
||||
/// CSS `width`, `margin`, `padding`, `flex-basis`, `transform`, etc.
|
||||
/// - For asymmetrical-fluid grids,
|
||||
/// `slice()` can help manage your nesting context.
|
||||
///
|
||||
/// All three functions come with an unprefixed alias by default,
|
||||
/// using the `susy` import.
|
||||
/// Import the `susy-prefix` partial instead,
|
||||
/// if you only only want prefixed versions of the API.
|
||||
///
|
||||
/// This is a thin syntax-sugar shell around
|
||||
/// the "Su" core-math functions: `su-span`, `su-gutter`, and `su-slice`.
|
||||
/// If you prefer the more constrained syntax of the math engine,
|
||||
/// you are welcome to use those functions instead.
|
||||
///
|
||||
/// @group b-api
|
||||
/// @see susy-span
|
||||
/// @see susy-gutter
|
||||
/// @see susy-slice
|
||||
/// @see su-span
|
||||
/// @see su-gutter
|
||||
/// @see su-slice
|
||||
|
||||
|
||||
|
||||
/// ## Shorthand
|
||||
///
|
||||
/// All functions draw on the same shorthand syntax in two parts,
|
||||
/// seperated by the word `of`.
|
||||
///
|
||||
/// ### Span Syntax: `<width>` [`<location>` `<spread>`]
|
||||
/// The first part describes the
|
||||
/// **span** width, location, and spread in any order.
|
||||
/// Only the width is required:
|
||||
///
|
||||
/// - `span(2)` will return the width of 2 columns.
|
||||
/// - `span(3 wide)` will return 3-columns, with an additional gutter.
|
||||
/// - location is only needed with asymmetrical grids,
|
||||
/// where `span(3 at 2)` will return the width of
|
||||
/// specific columns on the grid.
|
||||
/// Since these are functions, they will not handle placement for you.
|
||||
///
|
||||
/// ### Context Syntax: `[of <columns> <container-spread> <gutters>]`
|
||||
/// The second half of Susy's shorthand
|
||||
/// describes the grid-**context** –
|
||||
/// available columns, container-spread, and optional gutter override –
|
||||
/// in any order.
|
||||
/// All of these settings have globally-defined defaults:
|
||||
///
|
||||
/// - `span(2 of 6)` will set the context to
|
||||
/// a slice of 6 columns from the global grid.
|
||||
/// More details below.
|
||||
/// - `span(2 of 12 wide)` changes the container-spread
|
||||
/// as well as the column-context.
|
||||
/// - `span(2 of 12 set-gutters 0.5em)`
|
||||
/// will override the global gutters setting
|
||||
/// for this one calculation.
|
||||
///
|
||||
/// A single unitless number for `columns`
|
||||
/// will be treated as a slice of the parent grid.
|
||||
/// On a grid with `columns: susy-repeat(12, 120px)`,
|
||||
/// the shorthand `of 4` will use the parent `120px` column-width.
|
||||
/// You can also be more explicit,
|
||||
/// and say `of susy-repeat(4, 100px)`.
|
||||
/// If you are using asymmetrical grids,
|
||||
/// like `columns: (1 1 2 3 5 8)`,
|
||||
/// Susy can't slice it for you without knowing which columns you want.
|
||||
/// The `slice` function accepts exactly the same syntax as `span`,
|
||||
/// but returns a list of columns rather than a width.
|
||||
/// Use it in your context like `of slice(first 3)`.
|
||||
///
|
||||
/// @group b-api
|
||||
|
||||
|
||||
|
||||
// Susy Span
|
||||
// ---------
|
||||
/// This is the primary function in Susy —
|
||||
/// used to return the width of a span across one or more columns,
|
||||
/// and any relevant gutters along the way.
|
||||
/// With the default settings,
|
||||
/// `span(3)` will return the width of 3 columns,
|
||||
/// and the 2 intermediate gutters.
|
||||
/// This can be used to set the `width` property of grid elements,
|
||||
/// or `margin` and `padding`
|
||||
/// to push, pull, and pad your elements.
|
||||
///
|
||||
/// - This is a thin syntax-sugar shell around
|
||||
/// the core-math `su-span()` function.
|
||||
/// - The un-prefixed alias `span()` is available by default.
|
||||
///
|
||||
/// @group b-api
|
||||
/// @see su-span
|
||||
/// @see $susy
|
||||
///
|
||||
/// @param {list} $span -
|
||||
/// Shorthand expression to define the width of the span,
|
||||
/// optionally containing:
|
||||
/// - a count, length, or column-list span.
|
||||
/// - `at $n`, `first`, or `last` location on asymmetrical grids,
|
||||
/// where `at 1 == first`,
|
||||
/// and `last` will calculate the proper location
|
||||
/// based on columns and span.
|
||||
/// - `narrow`, `wide`, or `wider` for optionally spreading
|
||||
/// across adjacent gutters.
|
||||
/// - `of $n <spread>` for available grid columns
|
||||
/// and spread of the container.
|
||||
/// Span counts like `of 6` are valid
|
||||
/// in the context of symmetrical grids,
|
||||
/// where Susy can safely infer a slice of the parent columns.
|
||||
/// - and `set-gutters $n` to override global gutter settings.
|
||||
///
|
||||
/// @param {map} $config [()] -
|
||||
/// Optional map of Susy grid configuration settings.
|
||||
/// See `$susy` documentation for details.
|
||||
///
|
||||
/// @return {length} -
|
||||
/// Calculated length value, using the units given,
|
||||
/// or converting to `%` for fraction-based grids,
|
||||
/// or a full `calc` function when units/fractions
|
||||
/// are not comparable outside the browser.
|
||||
///
|
||||
/// @example scss - span half the grid
|
||||
/// .foo {
|
||||
/// // the result is a bit under 50% to account for gutters
|
||||
/// width: susy-span(6 of 12);
|
||||
/// }
|
||||
///
|
||||
/// @example scss - span a specific segment of asymmetrical grid
|
||||
/// .foo {
|
||||
/// width: susy-span(3 at 3 of (1 2 3 5 8));
|
||||
/// }
|
||||
@function susy-span(
|
||||
$span,
|
||||
$config: ()
|
||||
) {
|
||||
$output: susy-compile($span, $config);
|
||||
|
||||
@if map-get($output, 'span') {
|
||||
@return su-call('su-span', $output);
|
||||
}
|
||||
|
||||
$actual: '[#{type-of($span)}] `#{inspect($span)}`';
|
||||
@return _susy-error(
|
||||
'Unable to determine span value from #{$actual}.',
|
||||
'susy-span');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Susy Gutter
|
||||
// -----------
|
||||
/// The gutter function returns
|
||||
/// the width of a single gutter on your grid,
|
||||
/// to be applied where you see fit –
|
||||
/// on `margins`, `padding`, `transform`, or element `width`.
|
||||
///
|
||||
/// - This is a thin syntax-sugar shell around
|
||||
/// the core-math `su-gutter()` function.
|
||||
/// - The un-prefixed alias `gutter()` is available by default.
|
||||
///
|
||||
/// @group b-api
|
||||
/// @see su-gutter
|
||||
/// @see $susy
|
||||
///
|
||||
/// @param {list | number} $context [null] -
|
||||
/// Optional context for nested gutters,
|
||||
/// including shorthand for
|
||||
/// `columns`, `gutters`, and `container-spread`
|
||||
/// (additional shorthand will be ignored)
|
||||
///
|
||||
/// @param {map} $config [()] -
|
||||
/// Optional map of Susy grid configuration settings.
|
||||
/// See `$susy` documentation for details.
|
||||
///
|
||||
/// @return {length} -
|
||||
/// Width of a gutter as `%` of current context,
|
||||
/// or in the units defined by `column-width` when available
|
||||
///
|
||||
/// @example scss - add gutters before or after an element
|
||||
/// .floats {
|
||||
/// float: left;
|
||||
/// width: span(3 of 6);
|
||||
/// margin-left: gutter(of 6);
|
||||
/// }
|
||||
///
|
||||
/// @example scss - add gutters to padding
|
||||
/// .flexbox {
|
||||
/// flex: 1 1 span(3 wide of 6 wide);
|
||||
/// padding: gutter(of 6) / 2;
|
||||
/// }
|
||||
///
|
||||
@function susy-gutter(
|
||||
$context: susy-get('columns'),
|
||||
$config: ()
|
||||
) {
|
||||
$context: susy-compile($context, $config, 'context-only');
|
||||
|
||||
@return su-call('su-gutter', $context);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Susy Slice
|
||||
// ----------
|
||||
/// Working with asymmetrical grids (un-equal column widths)
|
||||
/// can be challenging –
|
||||
/// expecially when they involve fluid/fractional elements.
|
||||
/// Describing a context `of (15em 6em 6em 6em 15em)` is a lot
|
||||
/// to put inside the span or gutter function shorthand.
|
||||
/// This slice function returns a sub-slice of asymmetrical columns to use
|
||||
/// for a nested context.
|
||||
/// `slice(3 at 2)` will give you a subset of the global grid,
|
||||
/// spanning 3 columns, starting with the second.
|
||||
///
|
||||
/// - This is a thin syntax-sugar shell around
|
||||
/// the core-math `su-slice()` function.
|
||||
/// - The un-prefixed alias `slice()` is available by default.
|
||||
///
|
||||
/// @group b-api
|
||||
/// @see su-slice
|
||||
/// @see $susy
|
||||
///
|
||||
/// @param {list} $span -
|
||||
/// Shorthand expression to define the subset span, optionally containing:
|
||||
/// - `at $n`, `first`, or `last` location on asymmetrical grids;
|
||||
/// - `of $n <spread>` for available grid columns
|
||||
/// and spread of the container
|
||||
/// - Span-counts like `of 6` are only valid
|
||||
/// in the context of symmetrical grids
|
||||
/// - Valid spreads include `narrow`, `wide`, or `wider`
|
||||
///
|
||||
/// @param {map} $config [()] -
|
||||
/// Optional map of Susy grid configuration settings.
|
||||
/// See `$susy` documentation for details.
|
||||
///
|
||||
/// @return {list} -
|
||||
/// Subset list of columns for use for a nested context
|
||||
///
|
||||
/// @example scss - Return a nested segment of asymmetrical grid
|
||||
/// $context: susy-slice(3 at 3 of (1 2 3 5 8));
|
||||
/// /* $context: #{$context}; */
|
||||
@function susy-slice(
|
||||
$span,
|
||||
$config: ()
|
||||
) {
|
||||
$span: susy-compile($span, $config);
|
||||
|
||||
@return su-call('su-slice', $span);
|
||||
}
|
||||
|
||||
|
||||
|
||||
/// ## Building Grids
|
||||
/// The web has come a long way
|
||||
/// since the days of double-margin-hacks
|
||||
/// and inconsistent subpixel rounding.
|
||||
/// In addition to floats and tables,
|
||||
/// we can now use much more powerful tools,
|
||||
/// like flexbox and CSS grid,
|
||||
/// to build more interesting and responsive layouts.
|
||||
///
|
||||
/// With Susy3, we hope you'll start moving in that direction.
|
||||
/// You can still build classic 12-column Grid Systems,
|
||||
/// and we'll help you get there,
|
||||
/// but Susy3 is primarily designed for a grid-math-on-demand
|
||||
/// approach to layout:
|
||||
/// applying our functions only where you really need grid math.
|
||||
/// Read the [intro article by OddBird][welcome] for more details.
|
||||
///
|
||||
/// [welcome]: http://oddbird.net/2017/06/28/susy3/
|
||||
///
|
||||
/// @group b-api
|
||||
/// @link http://oddbird.net/2017/06/28/susy3/ Article: Welcome to Susy3
|
||||
///
|
||||
/// @example scss - floats
|
||||
/// .float {
|
||||
/// width: span(3);
|
||||
/// margin-right: gutter();
|
||||
/// }
|
||||
///
|
||||
/// @example scss - flexbox
|
||||
/// .flexbox {
|
||||
/// flex: 1 1 span(3);
|
||||
/// // half a gutter on either side…
|
||||
/// padding: 0 gutter() / 2;
|
||||
/// }
|
||||
///
|
||||
/// @example scss - pushing and pulling
|
||||
/// .push-3 {
|
||||
/// margin-left: span(3 wide);
|
||||
/// }
|
||||
///
|
||||
/// .pull-3 {
|
||||
/// margin-left: 0 - span(3 wide);
|
||||
/// }
|
||||
///
|
||||
/// @example scss - building an attribute system
|
||||
/// // markup example: <div data-span="last 3"></div>
|
||||
/// [data-span] {
|
||||
/// float: left;
|
||||
///
|
||||
/// &:not([data-span*='last']) {
|
||||
/// margin-right: gutter();
|
||||
/// }
|
||||
/// }
|
||||
///
|
||||
/// @for $span from 1 through length(susy-get('columns')) {
|
||||
/// [data-span*='#{$span}'] {
|
||||
/// width: span($span);
|
||||
/// }
|
||||
/// }
|
||||
261
_sass/minimal-mistakes/vendor/susy/susy/_normalize.scss
vendored
Normal file
261
_sass/minimal-mistakes/vendor/susy/susy/_normalize.scss
vendored
Normal file
@@ -0,0 +1,261 @@
|
||||
/// Syntax Normalization
|
||||
/// ====================
|
||||
/// Susy is divided into two layers:
|
||||
/// "Su" provides the core math functions with a stripped-down syntax,
|
||||
/// while "Susy" adds global settings, shorthand syntax,
|
||||
/// and other helpers.
|
||||
/// Each setting (e.g. span, location, columns, spread, etc.)
|
||||
/// has a single canonical syntax in Su.
|
||||
///
|
||||
/// This normalization module helps translate between those layers,
|
||||
/// transforming parsed Susy input into
|
||||
/// values that Su will understand.
|
||||
///
|
||||
/// @group x-normal
|
||||
///
|
||||
/// @see susy-normalize
|
||||
/// @see susy-normalize-span
|
||||
/// @see susy-normalize-columns
|
||||
/// @see susy-normalize-spread
|
||||
/// @see susy-normalize-location
|
||||
|
||||
|
||||
|
||||
// Susy Normalize
|
||||
// --------------
|
||||
/// Normalize the values in a configuration map.
|
||||
/// In addition to the global `$susy` properties,
|
||||
/// this map can include local span-related imformation,
|
||||
/// like `span` and `location`.
|
||||
///
|
||||
/// Normalization does not check that values are valid,
|
||||
/// which will happen in the Su math layer.
|
||||
/// These functions merely look for known Susy syntax –
|
||||
/// returning a map with those shorthand values
|
||||
/// converted into low-level data for Su.
|
||||
/// For example `span: all` and `location: first`
|
||||
/// will be converted into specific numbers.
|
||||
///
|
||||
/// @group x-normal
|
||||
/// @see $susy
|
||||
/// @see susy-parse
|
||||
///
|
||||
/// @param {map} $config -
|
||||
/// Map of Susy configuration settings to normalize.
|
||||
/// See `$susy` and `susy-parse()` documentation for details.
|
||||
/// @param {map | null} $context [null] -
|
||||
/// Map of Susy configuration settings to use as global reference,
|
||||
/// or `null` to use global settings.
|
||||
///
|
||||
/// @return {map} -
|
||||
/// Map of Susy configuration settings,
|
||||
/// with all values normalized for Su math functions.
|
||||
@function susy-normalize(
|
||||
$config,
|
||||
$context: null
|
||||
) {
|
||||
// Spread
|
||||
@each $setting in ('spread', 'container-spread') {
|
||||
$value: map-get($config, $setting);
|
||||
|
||||
@if $value {
|
||||
$value: susy-normalize-spread($value);
|
||||
$config: map-merge($config, ($setting: $value));
|
||||
}
|
||||
}
|
||||
|
||||
// Columns
|
||||
$columns: map-get($config, 'columns');
|
||||
|
||||
@if $columns {
|
||||
$columns: susy-normalize-columns($columns, $context);
|
||||
$config: map-merge($config, ('columns': $columns));
|
||||
}
|
||||
|
||||
@if not $columns {
|
||||
$map: type-of($context) == 'map';
|
||||
$columns: if($map, map-get($context, 'columns'), null);
|
||||
$columns: $columns or susy-get('columns');
|
||||
}
|
||||
|
||||
// Span
|
||||
$span: map-get($config, 'span');
|
||||
|
||||
@if $span {
|
||||
$span: susy-normalize-span($span, $columns);
|
||||
$config: map-merge($config, ('span': $span));
|
||||
}
|
||||
|
||||
// Location
|
||||
$location: map-get($config, 'location');
|
||||
|
||||
@if $location {
|
||||
$location: susy-normalize-location($span, $location, $columns);
|
||||
$config: map-merge($config, ('location': $location));
|
||||
}
|
||||
|
||||
@return $config;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Normalize Span
|
||||
// --------------
|
||||
/// Normalize `span` shorthand for Su.
|
||||
/// Su span syntax allows an explicit length (e.g. `3em`),
|
||||
/// unitless column-span number (e.g. `3` columns),
|
||||
/// or an explicit list of columns (e.g. `(3 5 8)`).
|
||||
///
|
||||
/// Susy span syntax also allows the `all` keyword,
|
||||
/// which will be converted to a slice of the context
|
||||
/// in normalization.
|
||||
///
|
||||
/// @group x-normal
|
||||
///
|
||||
/// @param {number | list | 'all'} $span -
|
||||
/// Span value to normalize.
|
||||
/// @param {list} $columns -
|
||||
/// Normalized list of columns in the grid
|
||||
///
|
||||
/// @return {number | list} -
|
||||
/// Number or list value for `$span`
|
||||
@function susy-normalize-span(
|
||||
$span,
|
||||
$columns: susy-get('columns')
|
||||
) {
|
||||
@if ($span == 'all') {
|
||||
@return length($columns);
|
||||
}
|
||||
|
||||
@return $span;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Normalize Columns
|
||||
// -----------------
|
||||
/// Normalize `column` shorthand for Su.
|
||||
/// Su column syntax only allows column lists (e.g. `120px 1 1 1 120px`).
|
||||
///
|
||||
/// Susy span syntax also allows a unitless `slice` number (e.g `of 5`),
|
||||
/// which will be converted to a slice of the context
|
||||
/// in normalization.
|
||||
///
|
||||
/// @group x-normal
|
||||
///
|
||||
/// @param {list | integer} $columns -
|
||||
/// List of available columns,
|
||||
/// or unitless integer representing a slice of
|
||||
/// the available context.
|
||||
/// @param {map | null} $context [null] -
|
||||
/// Map of Susy configuration settings to use as global reference,
|
||||
/// or `null` to access global settings.
|
||||
///
|
||||
/// @return {list} -
|
||||
/// Columns list value, normalized for Su input.
|
||||
///
|
||||
/// @throws
|
||||
/// when attempting to access a slice of asymmetrical context
|
||||
@function susy-normalize-columns(
|
||||
$columns,
|
||||
$context: null
|
||||
) {
|
||||
$context: $context or susy-settings();
|
||||
|
||||
@if type-of($columns) == 'list' {
|
||||
@return _susy-flatten($columns);
|
||||
}
|
||||
|
||||
@if (type-of($columns) == 'number') and (unitless($columns)) {
|
||||
$span: $columns;
|
||||
$context: map-get($context, 'columns');
|
||||
$symmetrical: susy-repeat(length($context), nth($context, 1));
|
||||
|
||||
@if ($context == $symmetrical) {
|
||||
@return susy-repeat($span, nth($context, 1));
|
||||
} @else {
|
||||
$actual: 'of `#{$span}`';
|
||||
$columns: 'grid-columns `#{$context}`';
|
||||
@return _susy-error(
|
||||
'context-slice #{$actual} can not be determined based on #{$columns}.',
|
||||
'susy-normalize-columns');
|
||||
}
|
||||
}
|
||||
|
||||
@return $columns;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Normalize Spread
|
||||
// ----------------
|
||||
/// Normalize `spread` shorthand for Su.
|
||||
/// Su spread syntax only allows the numbers `-1`, `0`, or `1` –
|
||||
/// representing the number of gutters covered
|
||||
/// in relation to columns spanned.
|
||||
///
|
||||
/// Susy spread syntax also allows keywords for each value –
|
||||
/// `narrow` for `-1`, `wide` for `0`, or `wider` for `1` –
|
||||
/// which will be converted to their respective integers
|
||||
/// in normalization.
|
||||
///
|
||||
/// @group x-normal
|
||||
///
|
||||
/// @param {0 | 1 | -1 | 'narrow' | 'wide' | 'wider'} $spread -
|
||||
/// Spread across adjacent gutters, relative to a column-count —
|
||||
/// either `narrow` (-1), `wide` (0), or `wider` (1)
|
||||
///
|
||||
/// @return {number} -
|
||||
/// Numeric value for `$spread`
|
||||
@function susy-normalize-spread(
|
||||
$spread
|
||||
) {
|
||||
$normal-spread: (
|
||||
'narrow': -1,
|
||||
'wide': 0,
|
||||
'wider': 1,
|
||||
);
|
||||
|
||||
@return map-get($normal-spread, $spread) or $spread;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Normalize Location
|
||||
// ------------------
|
||||
/// Normalize `location` shorthand for Su.
|
||||
/// Su location syntax requires the (1-indexed) number for a column.
|
||||
///
|
||||
/// Susy also allows the `first` and `last` keywords,
|
||||
/// where `first` is always `1`,
|
||||
/// and `last` is calculated based on span and column values.
|
||||
/// Both keywords are normalized into an integer index
|
||||
/// in normalization.
|
||||
///
|
||||
/// @group x-normal
|
||||
///
|
||||
/// @param {number} $span -
|
||||
/// Number of grid-columns to be spanned
|
||||
/// @param {integer | 'first' | 'last'} $location -
|
||||
/// Starting (1-indexed) column position of a span,
|
||||
/// or a named location keyword.
|
||||
/// @param {list} $columns -
|
||||
/// Already-normalized list of columns in the grid.
|
||||
///
|
||||
/// @return {integer} -
|
||||
/// Numeric value for `$location`
|
||||
@function susy-normalize-location(
|
||||
$span,
|
||||
$location,
|
||||
$columns
|
||||
) {
|
||||
$count: length($columns);
|
||||
$normal-locations: (
|
||||
'first': 1,
|
||||
'alpha': 1,
|
||||
'last': $count - $span + 1,
|
||||
'omega': $count - $span + 1,
|
||||
);
|
||||
|
||||
@return map-get($normal-locations, $location) or $location;
|
||||
}
|
||||
163
_sass/minimal-mistakes/vendor/susy/susy/_parse.scss
vendored
Normal file
163
_sass/minimal-mistakes/vendor/susy/susy/_parse.scss
vendored
Normal file
@@ -0,0 +1,163 @@
|
||||
/// Shorthand Syntax Parser
|
||||
/// =======================
|
||||
/// The syntax parser converts [shorthand syntax][short]
|
||||
/// into a map of settings that can be compared/merged with
|
||||
/// other config maps and global setting.
|
||||
///
|
||||
/// [short]: b-api.html
|
||||
///
|
||||
/// @group x-parser
|
||||
|
||||
|
||||
|
||||
// Parse
|
||||
// -----
|
||||
/// The `parse` function provides all the syntax-sugar in Susy,
|
||||
/// converting user shorthand
|
||||
/// into a usable map of keys and values
|
||||
/// that can be normalized and passed to Su.
|
||||
///
|
||||
/// @group x-parser
|
||||
/// @see $susy
|
||||
///
|
||||
/// @param {list} $shorthand -
|
||||
/// Shorthand expression to define the width of the span,
|
||||
/// optionally containing:
|
||||
/// - a count, length, or column-list span;
|
||||
/// - `at $n`, `first`, or `last` location on asymmetrical grids;
|
||||
/// - `narrow`, `wide`, or `wider` for optionally spreading
|
||||
/// across adjacent gutters;
|
||||
/// - `of $n <spread>` for available grid columns
|
||||
/// and spread of the container
|
||||
/// (span counts like `of 6` are only valid
|
||||
/// in the context of symmetrical grids);
|
||||
/// - and `set-gutters $n` to override global gutter settings
|
||||
/// @param {bool} $context-only [false] -
|
||||
/// Allow the parser to ignore span and span-spread values,
|
||||
/// only parsing context and container-spread.
|
||||
/// This makes it possible to accept spanless values,
|
||||
/// like the `gutters()` syntax.
|
||||
/// When parsing context-only,
|
||||
/// the `of` indicator is optional.
|
||||
///
|
||||
/// @return {map} -
|
||||
/// Map of span and grid settings
|
||||
/// parsed from shorthand input –
|
||||
/// including all the properties available globally –
|
||||
/// `columns`, `gutters`, `spread`, `container-spread` –
|
||||
/// along with the span-specific properties
|
||||
/// `span`, and `location`.
|
||||
///
|
||||
/// @throw
|
||||
/// when a shorthand value is not recognized
|
||||
@function susy-parse(
|
||||
$shorthand,
|
||||
$context-only: false
|
||||
) {
|
||||
$parse-error: 'Unknown shorthand property:';
|
||||
$options: (
|
||||
'first': 'location',
|
||||
'last': 'location',
|
||||
'alpha': 'location',
|
||||
'omega': 'location',
|
||||
'narrow': 'spread',
|
||||
'wide': 'spread',
|
||||
'wider': 'spread',
|
||||
);
|
||||
|
||||
$return: ();
|
||||
$span: null;
|
||||
$columns: null;
|
||||
|
||||
$of: null;
|
||||
$next: false;
|
||||
|
||||
// Allow context-only shorthand, without span
|
||||
@if ($context-only) and (not index($shorthand, 'of')) {
|
||||
@if su-valid-columns($shorthand, 'fail-silent') {
|
||||
$shorthand: 'of' $shorthand;
|
||||
} @else {
|
||||
$shorthand: join('of', $shorthand);
|
||||
}
|
||||
}
|
||||
|
||||
// loop through the shorthand list
|
||||
@for $i from 1 through length($shorthand) {
|
||||
$item: nth($shorthand, $i);
|
||||
$type: type-of($item);
|
||||
$error: false;
|
||||
$details: '[#{$type}] `#{$item}`';
|
||||
|
||||
// if we know what's supposed to be coming next…
|
||||
@if $next {
|
||||
|
||||
// Add to the return map
|
||||
$return: map-merge($return, ($next: $item));
|
||||
|
||||
// Reset next to `false`
|
||||
$next: false;
|
||||
|
||||
} @else { // If we don't know what's supposed to be coming…
|
||||
|
||||
// Keywords…
|
||||
@if ($type == 'string') {
|
||||
// Check the map for keywords…
|
||||
@if map-has-key($options, $item) {
|
||||
$setting: map-get($options, $item);
|
||||
|
||||
// Spread could be on the span or the container…
|
||||
@if ($setting == 'spread') and ($of) {
|
||||
$return: map-merge($return, ('container-spread': $item));
|
||||
} @else {
|
||||
$return: map-merge($return, ($setting: $item));
|
||||
}
|
||||
|
||||
} @else if ($item == 'all') {
|
||||
// `All` is a span shortcut
|
||||
$span: 'all';
|
||||
} @else if ($item == 'at') {
|
||||
// Some keywords setup what's next…
|
||||
$next: 'location';
|
||||
} @else if ($item == 'set-gutters') {
|
||||
$next: 'gutters';
|
||||
} @else if ($item == 'of') {
|
||||
$of: true;
|
||||
} @else {
|
||||
$error: true;
|
||||
}
|
||||
|
||||
} @else if ($type == 'number') or ($type == 'list') { // Numbers & lists…
|
||||
|
||||
@if not ($span or $of) {
|
||||
// We don't have a span, and we're not expecting context…
|
||||
$span: $item;
|
||||
} @else if ($of) and (not $columns) {
|
||||
// We are expecting context…
|
||||
$columns: $item;
|
||||
} @else {
|
||||
$error: true;
|
||||
}
|
||||
|
||||
} @else {
|
||||
$error: true;
|
||||
}
|
||||
}
|
||||
|
||||
@if $error {
|
||||
@return _susy-error('#{$parse-error} #{$details}', 'susy-parse');
|
||||
}
|
||||
}
|
||||
|
||||
// If we have span, merge it in
|
||||
@if $span {
|
||||
$return: map-merge($return, ('span': $span));
|
||||
}
|
||||
|
||||
// If we have columns, merge them in
|
||||
@if $columns {
|
||||
$return: map-merge($return, ('columns': $columns));
|
||||
}
|
||||
|
||||
// Return the map of settings…
|
||||
@return $return;
|
||||
}
|
||||
329
_sass/minimal-mistakes/vendor/susy/susy/_settings.scss
vendored
Normal file
329
_sass/minimal-mistakes/vendor/susy/susy/_settings.scss
vendored
Normal file
@@ -0,0 +1,329 @@
|
||||
/// Susy3 Configuration
|
||||
/// ===================
|
||||
/// Susy3 has 4 core settings, in a single settings map.
|
||||
/// You'll notice a few differences from Susy2:
|
||||
///
|
||||
/// **Columns** no longer accept a single number, like `12`,
|
||||
/// but use a syntax more similar to the new
|
||||
/// CSS [grid-template-columns][columns] –
|
||||
/// a list of relative sizes for each column on the grid.
|
||||
/// Unitless numbers in Susy act very similar to `fr` units in CSS,
|
||||
/// and the `susy-repeat()` function (similar to the css `repeat()`)
|
||||
/// helps quickly establish equal-width columns.
|
||||
///
|
||||
/// [columns]: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns
|
||||
///
|
||||
/// - `susy-repeat(12)` will create 12 fluid, equal-width columns
|
||||
/// - `susy-repeat(6, 120px)` will create 6 equal `120px`-wide columns
|
||||
/// - `120px susy-repeat(4) 120px` will create 6 columns,
|
||||
/// the first and last are `120px`,
|
||||
/// while the middle 4 are equal fractions of the remainder.
|
||||
/// Susy will output `calc()` values in order to achieve this.
|
||||
///
|
||||
/// **Gutters** haven't changed –
|
||||
/// a single fraction or explicit width –
|
||||
/// but the `calc()` output feature
|
||||
/// means you can now use any combination of units and fractions
|
||||
/// to create static-gutters on a fluid grid, etc.
|
||||
///
|
||||
/// **Spread** existed in the Susy2 API as a span option,
|
||||
/// and was otherwise handled behind the scenes.
|
||||
/// Now we're giving you full control over all spread issues.
|
||||
/// You can find a more [detailed explanation of spread on the blog][spread].
|
||||
///
|
||||
/// [spread]: http://oddbird.net/2017/06/13/susy-spread/
|
||||
///
|
||||
/// You can access your global settings at any time
|
||||
/// with the `susy-settings()` function,
|
||||
/// or grab a single setting from the global scope
|
||||
/// with `susy-get('columns')`, `susy-get('gutters')` etc.
|
||||
///
|
||||
/// @group a-config
|
||||
/// @link http://oddbird.net/2017/06/13/susy-spread/
|
||||
/// Article: Understanding Spread in Susy3
|
||||
///
|
||||
/// @see $susy
|
||||
/// @see susy-settings
|
||||
/// @see susy-get
|
||||
|
||||
|
||||
|
||||
// Susy
|
||||
// ----
|
||||
/// The grid is defined in a single map variable,
|
||||
/// with four initial properties:
|
||||
/// `columns`, `gutters`, `spread` and `container-spread`.
|
||||
/// Anything you put in the root `$susy` variable map
|
||||
/// will be treated as a global project default.
|
||||
/// You can create similar configuration maps
|
||||
/// under different variable names,
|
||||
/// to override the defaults as-needed.
|
||||
///
|
||||
/// @group a-config
|
||||
/// @type Map
|
||||
///
|
||||
/// @see $_susy-defaults
|
||||
/// @see {function} susy-repeat
|
||||
/// @link
|
||||
/// https://codepen.io/mirisuzanne/pen/EgmJJp?editors=1100
|
||||
/// Spread examples on CodePen
|
||||
///
|
||||
/// @prop {list} columns -
|
||||
/// Columns are described by a list of numbers,
|
||||
/// representing the relative width of each column.
|
||||
/// The syntax is a simplified version of CSS native
|
||||
/// `grid-template-columns`,
|
||||
/// expecting a list of grid-column widths.
|
||||
/// Unitless numbers create fractional fluid columns
|
||||
/// (similar to the CSS-native `fr` unit),
|
||||
/// while length values (united numbers)
|
||||
/// are used to define static columns.
|
||||
/// You can mix-and match units and fractions,
|
||||
/// to create a mixed grid.
|
||||
/// Susy will generate `calc()` values when necessary,
|
||||
/// to make all your units work together.
|
||||
///
|
||||
/// Use the `susy-repeat($count, $value)` function
|
||||
/// to more easily repetative columns,
|
||||
/// similar to the CSS-native `repeat()`.
|
||||
///
|
||||
/// - `susy-repeat(8)`:
|
||||
/// an 8-column, symmetrical, fluid grid.
|
||||
/// <br />Identical to `(1 1 1 1 1 1 1 1)`.
|
||||
/// - `susy-repeat(6, 8em)`:
|
||||
/// a 6-column, symmetrical, em-based grid.
|
||||
/// <br />Identical to `(8em 8em 8em 8em 8em 8em)`.
|
||||
/// - `(300px susy-repeat(4) 300px)`:
|
||||
/// a 6-column, asymmetrical, mixed fluid/static grid
|
||||
/// using `calc()` output.
|
||||
/// <br />Identical to `(300px 1 1 1 1 300px)`.
|
||||
///
|
||||
/// **NOTE** that `12` is no longer a valid 12-column grid definition,
|
||||
/// and you must list all the columns individually
|
||||
/// (or by using the `susy-repeat()` function).
|
||||
///
|
||||
/// @prop {number} gutters -
|
||||
/// Gutters are defined as a single width,
|
||||
/// or fluid ratio, similar to the native-CSS
|
||||
/// `grid-column-gap` syntax.
|
||||
/// Similar to columns,
|
||||
/// gutters can use any valid CSS length unit,
|
||||
/// or unitless numbers to define a relative fraction.
|
||||
///
|
||||
/// - `0.5`:
|
||||
/// a fluid gutter, half the size of a single-fraction column.
|
||||
/// - `1em`:
|
||||
/// a static gutter, `1em` wide.
|
||||
///
|
||||
/// Mix static gutters with fluid columns, or vice versa,
|
||||
/// and Susy will generate the required `calc()` to make it work.
|
||||
///
|
||||
/// @prop {string} spread [narrow] -
|
||||
/// Spread of an element across adjacent gutters:
|
||||
/// either `narrow` (none), `wide` (one), or `wider` (two)
|
||||
///
|
||||
/// - Both spread settings default to `narrow`,
|
||||
/// the most common use-case.
|
||||
/// A `narrow` spread only has gutters *between* columns
|
||||
/// (one less gutter than columns).
|
||||
/// This is how all css-native grids work,
|
||||
/// and most margin-based grid systems.
|
||||
/// - A `wide` spread includes the same number of gutters as columns,
|
||||
/// spanning across a single side-gutter.
|
||||
/// This is how most padding-based grid systems often work,
|
||||
/// and is also useful for pushing and pulling elements into place.
|
||||
/// - The rare `wider` spread includes gutters
|
||||
/// on both sides of the column-span
|
||||
/// (one more gutters than columns).
|
||||
///
|
||||
/// @prop {string} container-spread [narrow] -
|
||||
/// Spread of a container around adjacent gutters:
|
||||
/// either `narrow` (none), `wide` (one), or `wider` (two).
|
||||
/// See `spread` property for details.
|
||||
///
|
||||
/// @since 3.0.0-beta.1 -
|
||||
/// `columns` setting no longer accepts numbers
|
||||
/// (e.g. `12`) for symmetrical fluid grids,
|
||||
/// or the initial `12 x 120px` syntax for
|
||||
/// symmetrical fixed-unit grids.
|
||||
/// Use `susy-repeat(12)` or `susy-repeat(12, 120px)` instead.
|
||||
///
|
||||
/// @example scss - default values
|
||||
/// // 4 symmetrical, fluid columns
|
||||
/// // gutters are 1/4 the size of a column
|
||||
/// // elements span 1 less gutter than columns
|
||||
/// // containers span 1 less gutter as well
|
||||
/// $susy: (
|
||||
/// 'columns': susy-repeat(4),
|
||||
/// 'gutters': 0.25,
|
||||
/// 'spread': 'narrow',
|
||||
/// 'container-spread': 'narrow',
|
||||
/// );
|
||||
///
|
||||
/// @example scss - inside-static gutters
|
||||
/// // 6 symmetrical, fluid columns…
|
||||
/// // gutters are static, triggering calc()…
|
||||
/// // elements span equal columns & gutters…
|
||||
/// // containers span equal columns & gutters…
|
||||
/// $susy: (
|
||||
/// 'columns': susy-repeat(6),
|
||||
/// 'gutters': 0.5em,
|
||||
/// 'spread': 'wide',
|
||||
/// 'container-spread': 'wide',
|
||||
/// );
|
||||
$susy: () !default;
|
||||
|
||||
|
||||
|
||||
// Susy Repeat
|
||||
// -----------
|
||||
/// Similar to the `repeat(<count>, <value>)` function
|
||||
/// that is available in native CSS Grid templates,
|
||||
/// the `susy-repeat()` function helps generate repetative layouts
|
||||
/// by repeating any value a given number of times.
|
||||
/// Where Susy previously allowed `8` as a column definition
|
||||
/// for 8 equal columns, you should now use `susy-repeat(8)`.
|
||||
///
|
||||
/// @group a-config
|
||||
///
|
||||
/// @param {integer} $count -
|
||||
/// The number of repetitions, e.g. `12` for a 12-column grid.
|
||||
/// @param {*} $value [1] -
|
||||
/// The value to be repeated.
|
||||
/// Technically any value can be repeated here,
|
||||
/// but the function exists to repeat column-width descriptions:
|
||||
/// e.g. the default `1` for single-fraction fluid columns,
|
||||
/// `5em` for a static column,
|
||||
/// or even `5em 120px` if you are alternating column widths.
|
||||
///
|
||||
/// @return {list} -
|
||||
/// List of repeated values
|
||||
///
|
||||
/// @example scss
|
||||
/// // 12 column grid, with 5em columns
|
||||
/// $susy: (
|
||||
/// columns: susy-repeat(12, 5em),
|
||||
/// );
|
||||
///
|
||||
/// @example scss
|
||||
/// // asymmetrical 5-column grid
|
||||
/// $susy: (
|
||||
/// columns: 20px susy-repeat(3, 100px) 20px,
|
||||
/// );
|
||||
///
|
||||
/// /* result: #{susy-get('columns')} */
|
||||
@function susy-repeat(
|
||||
$count,
|
||||
$value: 1
|
||||
) {
|
||||
$return: ();
|
||||
|
||||
@for $i from 1 through $count {
|
||||
$return: join($return, $value);
|
||||
}
|
||||
|
||||
@return $return;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Susy Defaults
|
||||
// -------------
|
||||
/// Configuration map of Susy factory defaults.
|
||||
/// Do not override this map directly –
|
||||
/// use `$susy` for user and project setting overrides.
|
||||
///
|
||||
/// @access private
|
||||
/// @type Map
|
||||
///
|
||||
/// @see $susy
|
||||
///
|
||||
/// @prop {number | list} columns [susy-repeat(4)]
|
||||
/// @prop {number} gutters [0.25]
|
||||
/// @prop {string} spread ['narrow']
|
||||
/// @prop {string} container-spread ['narrow']
|
||||
$_susy-defaults: (
|
||||
'columns': susy-repeat(4),
|
||||
'gutters': 0.25,
|
||||
'spread': 'narrow',
|
||||
'container-spread': 'narrow',
|
||||
);
|
||||
|
||||
|
||||
|
||||
// Susy Settings
|
||||
// -------------
|
||||
/// Return a combined map of Susy settings,
|
||||
/// based on the factory defaults (`$_susy-defaults`),
|
||||
/// user-defined project configuration (`$susy`),
|
||||
/// and any local overrides required –
|
||||
/// such as a configuration map passed into a function.
|
||||
///
|
||||
/// @group a-config
|
||||
///
|
||||
/// @param {maps} $overrides… -
|
||||
/// Optional map override of global configuration settings.
|
||||
/// See `$susy` above for properties.
|
||||
///
|
||||
/// @return {map} -
|
||||
/// Combined map of Susy configuration settings,
|
||||
/// in order of specificity:
|
||||
/// any `$overrides...`,
|
||||
/// then `$susy` project settings,
|
||||
/// and finally the `$_susy-defaults`
|
||||
///
|
||||
/// @example scss - global settings
|
||||
/// @each $key, $value in susy-settings() {
|
||||
/// /* #{$key}: #{$value} */
|
||||
/// }
|
||||
///
|
||||
/// @example scss - local settings
|
||||
/// $local: ('columns': 1 2 3 5 8);
|
||||
///
|
||||
/// @each $key, $value in susy-settings($local) {
|
||||
/// /* #{$key}: #{$value} */
|
||||
/// }
|
||||
@function susy-settings(
|
||||
$overrides...
|
||||
) {
|
||||
$settings: map-merge($_susy-defaults, $susy);
|
||||
|
||||
@each $config in $overrides {
|
||||
$settings: map-merge($settings, $config);
|
||||
}
|
||||
|
||||
@return $settings;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Susy Get
|
||||
// --------
|
||||
/// Return the current global value of any Susy setting
|
||||
///
|
||||
/// @group a-config
|
||||
///
|
||||
/// @param {string} $key -
|
||||
/// Setting to retrieve from the configuration.
|
||||
///
|
||||
/// @return {*} -
|
||||
/// Value mapped to `$key` in the configuration maps,
|
||||
/// in order of specificity:
|
||||
/// `$susy`, then `$_susy-defaults`
|
||||
///
|
||||
/// @example scss -
|
||||
/// /* columns: #{susy-get('columns')} */
|
||||
/// /* gutters: #{susy-get('gutters')} */
|
||||
@function susy-get(
|
||||
$key
|
||||
) {
|
||||
$settings: susy-settings();
|
||||
|
||||
@if not map-has-key($settings, $key) {
|
||||
@return _susy-error(
|
||||
'There is no Susy setting called `#{$key}`',
|
||||
'susy-get');
|
||||
}
|
||||
|
||||
@return map-get($settings, $key);
|
||||
}
|
||||
441
_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss
vendored
Normal file
441
_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss
vendored
Normal file
@@ -0,0 +1,441 @@
|
||||
/// Grid Math Engine
|
||||
/// ================
|
||||
/// The `su` functions give you direct access to the math layer,
|
||||
/// without any syntax-sugar like shorthand parsing, and normalization.
|
||||
/// If you prefer named arguments, and stripped-down syntax,
|
||||
/// you can use these functions directly in your code –
|
||||
/// replacing `span`, `gutter`, and `slice`.
|
||||
///
|
||||
/// These functions are also useful
|
||||
/// for building mixins or other extensions to Susy.
|
||||
/// Apply the Susy syntax to new mixins and functions,
|
||||
/// using our "Plugin Helpers",
|
||||
/// or write your own syntax and pass the normalized results along
|
||||
/// to `su` for compilation.
|
||||
///
|
||||
/// @group su-math
|
||||
///
|
||||
/// @see su-span
|
||||
/// @see su-gutter
|
||||
/// @see su-slice
|
||||
/// @ignore _su-sum
|
||||
/// @ignore _su-calc-span
|
||||
/// @ignore _su-calc-sum
|
||||
/// @ignore _su-needs-calc-output
|
||||
|
||||
|
||||
|
||||
// Su Span
|
||||
// -------
|
||||
/// Calculates and returns a CSS-ready span width,
|
||||
/// based on normalized span and context data –
|
||||
/// a low-level version of `susy-span`,
|
||||
/// with all of the logic and none of the syntax sugar.
|
||||
///
|
||||
/// - Grids defined with unitless numbers will return `%` values.
|
||||
/// - Grids defined with comparable units
|
||||
/// will return a value in the units provided.
|
||||
/// - Grids defined with a mix of units,
|
||||
/// or a combination of untiless numbers and unit-lengths,
|
||||
/// will return a `calc()` string.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @see susy-span
|
||||
///
|
||||
/// @param {number | list} $span -
|
||||
/// Number or list of grid columns to span
|
||||
/// @param {list} $columns -
|
||||
/// List of columns available
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter in column-comparable units
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `span` count
|
||||
/// @param {0 | 1 | -1} $container-spread [$spread] -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `columns` count
|
||||
/// @param {integer} $location [1] -
|
||||
/// Optional position of sub-span among full set of columns
|
||||
///
|
||||
/// @return {length} -
|
||||
/// Relative or static length of a span on the grid
|
||||
@function su-span(
|
||||
$span,
|
||||
$columns,
|
||||
$gutters,
|
||||
$spread,
|
||||
$container-spread: $spread,
|
||||
$location: 1
|
||||
) {
|
||||
$span: su-valid-span($span);
|
||||
$columns: su-valid-columns($columns);
|
||||
$gutters: su-valid-gutters($gutters);
|
||||
$spread: su-valid-spread($spread);
|
||||
|
||||
@if (type-of($span) == 'number') {
|
||||
@if (not unitless($span)) {
|
||||
@return $span;
|
||||
}
|
||||
|
||||
$location: su-valid-location($span, $location, $columns);
|
||||
$span: su-slice($span, $columns, $location, $validate: false);
|
||||
}
|
||||
|
||||
@if _su-needs-calc-output($span, $columns, $gutters, $spread, not 'validate') {
|
||||
@return _su-calc-span($span, $columns, $gutters, $spread, $container-spread, not 'validate');
|
||||
}
|
||||
|
||||
$span-width: _su-sum($span, $gutters, $spread, $validate: false);
|
||||
|
||||
@if unitless($span-width) {
|
||||
$container-spread: su-valid-spread($container-spread);
|
||||
$container: _su-sum($columns, $gutters, $container-spread, $validate: false);
|
||||
@return percentage($span-width / $container);
|
||||
}
|
||||
|
||||
@return $span-width;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Su Gutter
|
||||
// ---------
|
||||
/// Calculates and returns a CSS-ready gutter width,
|
||||
/// based on normalized grid data –
|
||||
/// a low-level version of `susy-gutter`,
|
||||
/// with all of the logic and none of the syntax sugar.
|
||||
///
|
||||
/// - Grids defined with unitless numbers will return `%` values.
|
||||
/// - Grids defined with comparable units
|
||||
/// will return a value in the units provided.
|
||||
/// - Grids defined with a mix of units,
|
||||
/// or a combination of untiless numbers and unit-lengths,
|
||||
/// will return a `calc()` string.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @see susy-gutter
|
||||
///
|
||||
/// @param {list} $columns -
|
||||
/// List of columns in the grid
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter in column-comparable units
|
||||
/// @param {0 | 1 | -1} $container-spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `columns` count
|
||||
///
|
||||
/// @return {length} -
|
||||
/// Relative or static length of one gutter in a grid
|
||||
@function su-gutter(
|
||||
$columns,
|
||||
$gutters,
|
||||
$container-spread
|
||||
) {
|
||||
@if (type-of($gutters) == 'number') {
|
||||
@if ($gutters == 0) or (not unitless($gutters)) {
|
||||
@return $gutters;
|
||||
}
|
||||
}
|
||||
|
||||
@if _su-needs-calc-output($gutters, $columns, $gutters, -1, not 'validate') {
|
||||
@return _su-calc-span($gutters, $columns, $gutters, -1, $container-spread, not 'validate');
|
||||
}
|
||||
|
||||
$container: _su-sum($columns, $gutters, $container-spread);
|
||||
@return percentage($gutters / $container);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Su Slice
|
||||
// --------
|
||||
/// Returns a list of columns
|
||||
/// based on a given span/location slice of the grid –
|
||||
/// a low-level version of `susy-slice`,
|
||||
/// with all of the logic and none of the syntax sugar.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @see susy-slice
|
||||
///
|
||||
/// @param {number} $span -
|
||||
/// Number of grid columns to span
|
||||
/// @param {list} $columns -
|
||||
/// List of columns in the grid
|
||||
/// @param {number} $location [1] -
|
||||
/// Starting index of a span in the list of columns
|
||||
/// @param {bool} $validate [true] -
|
||||
/// Check that arguments are valid before proceeding
|
||||
///
|
||||
/// @return {list} -
|
||||
/// Subset list of grid columns, based on span and location
|
||||
@function su-slice(
|
||||
$span,
|
||||
$columns,
|
||||
$location: 1,
|
||||
$validate: true
|
||||
) {
|
||||
@if $validate {
|
||||
$columns: su-valid-columns($columns);
|
||||
$location: su-valid-location($span, $location, $columns);
|
||||
}
|
||||
|
||||
$floor: floor($span);
|
||||
$sub-columns: ();
|
||||
|
||||
@for $i from $location to ($location + $floor) {
|
||||
$sub-columns: append($sub-columns, nth($columns, $i));
|
||||
}
|
||||
|
||||
@if $floor != $span {
|
||||
$remainder: $span - $floor;
|
||||
$column: $location + $floor;
|
||||
$sub-columns: append($sub-columns, nth($columns, $column) * $remainder);
|
||||
}
|
||||
|
||||
@return $sub-columns;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Su Sum
|
||||
// ------
|
||||
/// Get the total sum of column-units in a layout.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @access private
|
||||
///
|
||||
/// @param {list} $columns -
|
||||
/// List of columns in the grid
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter in column-comparable units
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `columns` count
|
||||
/// @param {bool} $validate [true] -
|
||||
/// Check that arguments are valid before proceeding
|
||||
///
|
||||
/// @return {number} -
|
||||
/// Total sum of column-units in a grid
|
||||
@function _su-sum(
|
||||
$columns,
|
||||
$gutters,
|
||||
$spread,
|
||||
$validate: true
|
||||
) {
|
||||
@if $validate {
|
||||
$columns: su-valid-span($columns);
|
||||
$gutters: su-valid-gutters($gutters);
|
||||
$spread: su-valid-spread($spread);
|
||||
}
|
||||
|
||||
// Calculate column-sum
|
||||
$column-sum: 0;
|
||||
@each $column in $columns {
|
||||
$column-sum: $column-sum + $column;
|
||||
}
|
||||
|
||||
$gutter-sum: (ceil(length($columns)) + $spread) * $gutters;
|
||||
$total: if(($gutter-sum > 0), $column-sum + $gutter-sum, $column-sum);
|
||||
|
||||
@return $total;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Su Calc
|
||||
// -------
|
||||
/// Return a usable span width as a `calc()` function,
|
||||
/// in order to create mixed-unit grids.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @access private
|
||||
///
|
||||
/// @param {number | list} $span -
|
||||
/// Pre-sliced list of grid columns to span
|
||||
/// @param {list} $columns -
|
||||
/// List of columns available
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter in column-comparable units
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `span` count
|
||||
/// @param {0 | 1 | -1} $container-spread [$spread] -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `columns` count
|
||||
/// @param {bool} $validate [true] -
|
||||
/// Check that arguments are valid before proceeding
|
||||
///
|
||||
/// @return {length} -
|
||||
/// Relative or static length of a span on the grid
|
||||
@function _su-calc-span(
|
||||
$span,
|
||||
$columns,
|
||||
$gutters,
|
||||
$spread,
|
||||
$container-spread: $spread,
|
||||
$validate: true
|
||||
) {
|
||||
@if $validate {
|
||||
$span: su-valid-span($span);
|
||||
$columns: su-valid-columns($columns);
|
||||
$gutters: su-valid-gutters($gutters);
|
||||
$spread: su-valid-spread($spread);
|
||||
$container-spread: su-valid-spread($container-spread);
|
||||
}
|
||||
|
||||
// Span and context
|
||||
$span: _su-calc-sum($span, $gutters, $spread, not 'validate');
|
||||
$context: _su-calc-sum($columns, $gutters, $container-spread, not 'validate');
|
||||
|
||||
// Fixed and fluid
|
||||
$fixed-span: map-get($span, 'fixed');
|
||||
$fluid-span: map-get($span, 'fluid');
|
||||
$fixed-context: map-get($context, 'fixed');
|
||||
$fluid-context: map-get($context, 'fluid');
|
||||
|
||||
$calc: '#{$fixed-span}';
|
||||
$fluid-calc: '(100% - #{$fixed-context})';
|
||||
|
||||
// Fluid-values
|
||||
@if (not $fluid-span) {
|
||||
$fluid-calc: null;
|
||||
} @else if ($fluid-span != $fluid-context) {
|
||||
$fluid-span: '* #{$fluid-span}';
|
||||
$fluid-context: if($fluid-context, '/ #{$fluid-context}', '');
|
||||
$fluid-calc: '(#{$fluid-calc $fluid-context $fluid-span})';
|
||||
}
|
||||
|
||||
@if $fluid-calc {
|
||||
$calc: if(($calc != ''), '#{$calc} + ', '');
|
||||
$calc: '#{$calc + $fluid-calc}';
|
||||
}
|
||||
|
||||
@return calc(#{unquote($calc)});
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Su Calc-Sum
|
||||
// -----------
|
||||
/// Get the total sum of fixed and fluid column-units
|
||||
/// for creating a mixed-unit layout with `calc()` values.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @access private
|
||||
///
|
||||
/// @param {list} $columns -
|
||||
/// List of columns available
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter in column-comparable units
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `span` count
|
||||
/// @param {bool} $validate [true] -
|
||||
/// Check that arguments are valid before proceeding
|
||||
///
|
||||
/// @return {map} -
|
||||
/// Map with `fixed` and `fluid` keys
|
||||
/// containing the proper math as strings
|
||||
@function _su-calc-sum(
|
||||
$columns,
|
||||
$gutters,
|
||||
$spread,
|
||||
$validate: true
|
||||
) {
|
||||
@if $validate {
|
||||
$columns: su-valid-span($columns);
|
||||
$gutters: su-valid-gutters($gutters);
|
||||
$spread: su-valid-spread($spread);
|
||||
}
|
||||
|
||||
$fluid: 0;
|
||||
$fixed: ();
|
||||
$calc: null;
|
||||
|
||||
// Gutters
|
||||
$gutters: $gutters * (length($columns) + $spread);
|
||||
|
||||
// Columns
|
||||
@each $col in append($columns, $gutters) {
|
||||
@if unitless($col) {
|
||||
$fluid: $fluid + $col;
|
||||
} @else {
|
||||
$fixed: _su-map-add-units($fixed, $col);
|
||||
}
|
||||
}
|
||||
|
||||
// Compile Fixed Units
|
||||
@each $unit, $total in $fixed {
|
||||
@if ($total != (0 * $total)) {
|
||||
$calc: if($calc, '#{$calc} + #{$total}', '#{$total}');
|
||||
}
|
||||
}
|
||||
|
||||
// Calc null or string
|
||||
@if $calc {
|
||||
$calc: if(str-index($calc, '+'), '(#{$calc})', '#{$calc}');
|
||||
}
|
||||
|
||||
// Fluid 0 => null
|
||||
$fluid: if(($fluid == 0), null, $fluid);
|
||||
|
||||
|
||||
// Return map
|
||||
$return: (
|
||||
'fixed': $calc,
|
||||
'fluid': $fluid,
|
||||
);
|
||||
|
||||
@return $return;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Needs Calc
|
||||
// ----------
|
||||
/// Check if `calc()` will be needed in defining a span,
|
||||
/// if the necessary units in a grid are not comparable.
|
||||
///
|
||||
/// @group su-math
|
||||
/// @access private
|
||||
///
|
||||
/// @param {list} $span -
|
||||
/// Slice of columns to span
|
||||
/// @param {list} $columns -
|
||||
/// List of available columns in the grid
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters spanned,
|
||||
/// relative to `span` count
|
||||
/// @param {bool} $validate [true] -
|
||||
/// Check that arguments are valid before proceeding
|
||||
///
|
||||
/// @return {bool} -
|
||||
/// `True` when units do not match, and `calc()` will be required
|
||||
@function _su-needs-calc-output(
|
||||
$span,
|
||||
$columns,
|
||||
$gutters,
|
||||
$spread,
|
||||
$validate: true
|
||||
) {
|
||||
@if $validate {
|
||||
$span: su-valid-span($span);
|
||||
$columns: su-valid-columns($columns);
|
||||
$gutters: su-valid-gutters($gutters);
|
||||
}
|
||||
|
||||
$has-gutter: if((length($span) > 1) or ($spread >= 0), true, false);
|
||||
$check: if($has-gutter, append($span, $gutters), $span);
|
||||
$safe-span: _su-is-comparable($check...);
|
||||
|
||||
@if ($safe-span == 'static') {
|
||||
@return false;
|
||||
} @else if (not $safe-span) {
|
||||
@return true;
|
||||
}
|
||||
|
||||
$safe-fluid: _su-is-comparable($gutters, $columns...);
|
||||
|
||||
@return not $safe-fluid;
|
||||
}
|
||||
213
_sass/minimal-mistakes/vendor/susy/susy/_su-validate.scss
vendored
Normal file
213
_sass/minimal-mistakes/vendor/susy/susy/_su-validate.scss
vendored
Normal file
@@ -0,0 +1,213 @@
|
||||
/// Validation
|
||||
/// ==========
|
||||
/// Each argument to Su has a single canonical syntax.
|
||||
/// These validation functions check to ensure
|
||||
/// that each argument is valid,
|
||||
/// in order to provide useful errors
|
||||
/// before attempting to calculate the results/
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @see su-valid-columns
|
||||
/// @see su-valid-gutters
|
||||
/// @see su-valid-spread
|
||||
/// @see su-valid-location
|
||||
|
||||
|
||||
|
||||
// Valid Span
|
||||
// ----------
|
||||
/// Check that the `span` argument
|
||||
/// is a number, length, or column-list
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @param {number | list} $span -
|
||||
/// Number of columns, or length of span
|
||||
///
|
||||
/// @return {number | list} -
|
||||
/// Validated `$span` number, length, or columns list
|
||||
///
|
||||
/// @throw
|
||||
/// when span value is not a number, or valid column list
|
||||
@function su-valid-span(
|
||||
$span
|
||||
) {
|
||||
$type: type-of($span);
|
||||
@if ($type == 'number') {
|
||||
@return $span;
|
||||
} @else if ($type == 'list') and su-valid-columns($span, 'silent-failure') {
|
||||
@return $span;
|
||||
}
|
||||
|
||||
$actual: '[#{type-of($span)}] `#{inspect($span)}`';
|
||||
@return _susy-error(
|
||||
'#{$actual} is not a valid number, length, or column-list for $span.',
|
||||
'su-valid-span');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Valid Columns
|
||||
// -------------
|
||||
/// Check that the `columns` argument is a valid
|
||||
/// list of column-lengths
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @param {list} $columns -
|
||||
/// List of column-lengths
|
||||
/// @param {bool} $silent-failure [true] -
|
||||
/// Set false to return null on failure
|
||||
///
|
||||
/// @return {list} -
|
||||
/// Validated `$columns` list
|
||||
///
|
||||
/// @throw
|
||||
/// when column value is not a valid list of numbers
|
||||
@function su-valid-columns(
|
||||
$columns,
|
||||
$silent-failure: false
|
||||
) {
|
||||
@if (type-of($columns) == 'list') {
|
||||
$fail: false;
|
||||
|
||||
@each $col in $columns {
|
||||
@if (type-of($col) != 'number') {
|
||||
$fail: true;
|
||||
}
|
||||
}
|
||||
|
||||
@if not $fail {
|
||||
@return $columns;
|
||||
}
|
||||
}
|
||||
|
||||
// Silent Failure
|
||||
@if $silent-failure {
|
||||
@return null;
|
||||
}
|
||||
|
||||
// Error Message
|
||||
$actual: '[#{type-of($columns)}] `#{inspect($columns)}`';
|
||||
|
||||
@return _susy-error(
|
||||
'#{$actual} is not a valid list of numbers for $columns.',
|
||||
'su-valid-columns');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Valid Gutters
|
||||
// -------------
|
||||
/// Check that the `gutters` argument is a valid number
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @param {number} $gutters -
|
||||
/// Width of a gutter
|
||||
///
|
||||
/// @return {number} -
|
||||
/// Validated `$gutters` number
|
||||
///
|
||||
/// @throw
|
||||
/// when gutter value is not a number
|
||||
@function su-valid-gutters(
|
||||
$gutters
|
||||
) {
|
||||
$type: type-of($gutters);
|
||||
|
||||
@if ($type == 'number') {
|
||||
@return $gutters;
|
||||
}
|
||||
|
||||
$actual: '[#{$type}] `#{inspect($gutters)}`';
|
||||
@return _susy-error(
|
||||
'#{$actual} is not a number or length for $gutters.',
|
||||
'su-valid-gutters');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Valid Spread
|
||||
// ------------
|
||||
/// Check that the `spread` argument is a valid
|
||||
/// intiger between `-1` and `1`
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @param {0 | 1 | -1} $spread -
|
||||
/// Number of gutters to include in a span,
|
||||
/// relative to the number columns
|
||||
///
|
||||
/// @return {0 | 1 | -1} -
|
||||
/// Validated `$spread` number
|
||||
///
|
||||
/// @throw
|
||||
/// when spread value is not a valid spread
|
||||
@function su-valid-spread(
|
||||
$spread
|
||||
) {
|
||||
@if index(0 1 -1, $spread) {
|
||||
@return $spread;
|
||||
}
|
||||
|
||||
$actual: '[#{type-of($spread)}] `#{inspect($spread)}`';
|
||||
@return _susy-error(
|
||||
'#{$actual} is not a normalized [0 | 1 | -1] value for `$spread`.',
|
||||
'su-valid-spread');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Valid Location
|
||||
// --------------
|
||||
/// Check that the `location` argument is a valid number,
|
||||
/// within the scope of available columns
|
||||
///
|
||||
/// @group x-validation
|
||||
///
|
||||
/// @param {number} $span -
|
||||
/// Number of grid-columns to be spanned
|
||||
/// @param {integer | string} $location -
|
||||
/// Starting (1-indexed) column-position of that span
|
||||
/// @param {list} $columns -
|
||||
/// List of available columns in the grid
|
||||
///
|
||||
/// @return {integer} -
|
||||
/// Validated `$location` intiger
|
||||
///
|
||||
/// @throw
|
||||
/// when location value is not a valid index,
|
||||
/// given the context and span.
|
||||
@function su-valid-location(
|
||||
$span,
|
||||
$location,
|
||||
$columns
|
||||
) {
|
||||
$count: length($columns);
|
||||
|
||||
@if $location {
|
||||
@if (type-of($location) != 'number') or (not unitless($location)) {
|
||||
$actual: '[#{type-of($location)}] `#{$location}`';
|
||||
@return _susy-error(
|
||||
'#{$actual} is not a unitless number for $location.',
|
||||
'su-valid-location');
|
||||
} @else if (round($location) != $location) {
|
||||
@return _susy-error(
|
||||
'Location (`#{$location}`) must be a 1-indexed intiger position.',
|
||||
'su-valid-location');
|
||||
} @else if ($location > $count) or ($location < 1) {
|
||||
@return _susy-error(
|
||||
'Position `#{$location}` does not exist in grid `#{$columns}`.',
|
||||
'su-valid-location');
|
||||
} @else if ($location + $span - 1 > $count) {
|
||||
$details: 'grid `#{$columns}` for span `#{$span}` at `#{$location}`';
|
||||
@return _susy-error(
|
||||
'There are not enough columns in #{$details}.',
|
||||
'su-valid-location');
|
||||
}
|
||||
}
|
||||
|
||||
@return $location;
|
||||
}
|
||||
191
_sass/minimal-mistakes/vendor/susy/susy/_syntax-helpers.scss
vendored
Normal file
191
_sass/minimal-mistakes/vendor/susy/susy/_syntax-helpers.scss
vendored
Normal file
@@ -0,0 +1,191 @@
|
||||
/// Syntax Utilities for Extending Susy
|
||||
/// ===================================
|
||||
/// There are many steps involved
|
||||
/// when translating between the Susy syntax layer,
|
||||
/// and the Su core math.
|
||||
/// That entire process can be condensed with these two functions.
|
||||
/// For anyone that wants to access the full power of Susy,
|
||||
/// and build their own plugins, functions, or mixins –
|
||||
/// this is the primary API for compiling user input,
|
||||
/// and accessing the core math.
|
||||
///
|
||||
/// This is the same technique we use internally,
|
||||
/// to keep our API layer simple and light-weight.
|
||||
/// Every function accepts two arguments,
|
||||
/// a "shorthand" description of the span or context,
|
||||
/// and an optional settings-map to override global defaults.
|
||||
///
|
||||
/// - Use `susy-compile()` to parse, merge, and normalize
|
||||
/// all the user settings into a single map.
|
||||
/// - Then use `su-call()` to call one of the core math functions,
|
||||
/// with whatever data is needed for that function.
|
||||
///
|
||||
/// @group plugin-utils
|
||||
/// @see susy-compile
|
||||
/// @see su-call
|
||||
///
|
||||
/// @example scss - Susy API `gutter` function
|
||||
/// @function susy-gutter(
|
||||
/// $context: susy-get('columns'),
|
||||
/// $config: ()
|
||||
/// ) {
|
||||
/// // compile and normalize all user arguments and global settings
|
||||
/// $context: susy-compile($context, $config, 'context-only');
|
||||
/// // call `su-gutter` with the appropriate data
|
||||
/// @return su-call('su-gutter', $context);
|
||||
/// }
|
||||
///
|
||||
/// @example scss - Sample `span` mixin for floated grids
|
||||
/// @mixin span(
|
||||
/// $span,
|
||||
/// $config: ()
|
||||
/// ) {
|
||||
/// $context: susy-compile($span, $config);
|
||||
/// width: su-call('su-span', $context);
|
||||
///
|
||||
/// @if index($span, 'last') {
|
||||
/// float: right;
|
||||
/// } @else {
|
||||
/// float: left;
|
||||
/// margin-right: su-call('su-gutter', $context);
|
||||
/// }
|
||||
/// }
|
||||
|
||||
|
||||
|
||||
// Compile
|
||||
// -------
|
||||
/// Susy's syntax layer has various moving parts,
|
||||
/// with syntax-parsing for the grid/span shorthand,
|
||||
/// and normalization for each of the resulting values.
|
||||
/// The compile function rolls this all together
|
||||
/// in a single call –
|
||||
/// for quick access from our internal API functions,
|
||||
/// or any additional functions and mixins you add to your project.
|
||||
/// Pass user input and configuration maps to the compiler,
|
||||
/// and it will hand back a map of values ready for Su.
|
||||
/// Combine this with the `su-call` function
|
||||
/// to quickly parse, normalize, and process grid calculations.
|
||||
///
|
||||
/// @group plugin-utils
|
||||
/// @see su-call
|
||||
///
|
||||
/// @param {list | map} $shorthand -
|
||||
/// Shorthand expression to define the width of the span,
|
||||
/// optionally containing:
|
||||
/// - a count, length, or column-list span;
|
||||
/// - `at $n`, `first`, or `last` location on asymmetrical grids;
|
||||
/// - `narrow`, `wide`, or `wider` for optionally spreading
|
||||
/// across adjacent gutters;
|
||||
/// - `of $n <spread>` for available grid columns
|
||||
/// and spread of the container
|
||||
/// (span counts like `of 6` are only valid
|
||||
/// in the context of symmetrical grids);
|
||||
/// - and `set-gutters $n` to override global gutter settings
|
||||
/// @param {map} $config [null] -
|
||||
/// Optional map of Susy grid configuration settings
|
||||
/// @param {bool} $context-only [false] -
|
||||
/// Allow the parser to ignore span and span-spread values,
|
||||
/// only parsing context and container-spread
|
||||
///
|
||||
/// @return {map} -
|
||||
/// Parsed and normalized map of settings,
|
||||
/// based on global and local configuration,
|
||||
/// alongwith shorthad adjustments.
|
||||
///
|
||||
/// @example scss -
|
||||
/// $user-input: 3 wide of susy-repeat(6, 120px) set-gutters 10px;
|
||||
/// $grid-data: susy-compile($user-input, $susy);
|
||||
///
|
||||
/// @each $key, $value in $grid-data {
|
||||
/// /* #{$key}: #{$value}, */
|
||||
/// }
|
||||
@function susy-compile(
|
||||
$short,
|
||||
$config: null,
|
||||
$context-only: false
|
||||
) {
|
||||
// Get and normalize config
|
||||
$config: if($config, susy-settings($config), susy-settings());
|
||||
$normal-config: susy-normalize($config);
|
||||
|
||||
// Parse and normalize shorthand
|
||||
@if (type-of($short) != 'map') and (length($short) > 0) {
|
||||
$short: susy-parse($short, $context-only);
|
||||
}
|
||||
|
||||
$normal-short: susy-normalize($short, $normal-config);
|
||||
|
||||
// Merge and return
|
||||
@return map-merge($normal-config, $normal-short);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Call
|
||||
// ----
|
||||
/// The Susy parsing and normalization process
|
||||
/// results in a map of configuration settings,
|
||||
/// much like the global `$susy` settings map.
|
||||
/// In order to pass that information along to Su math functions,
|
||||
/// the proper values have to be picked out,
|
||||
/// and converted to arguments.
|
||||
///
|
||||
/// The `su-call` function streamlines that process,
|
||||
/// weeding out the unnecessary data,
|
||||
/// and passing the rest along to Su in the proper format.
|
||||
/// Combine this with `susy-compile` to quickly parse,
|
||||
/// normalize, and process grid calculations.
|
||||
///
|
||||
/// @group plugin-utils
|
||||
///
|
||||
/// @require su-span
|
||||
/// @require su-gutter
|
||||
/// @require su-slice
|
||||
/// @see susy-compile
|
||||
///
|
||||
/// @param {'su-span' | 'su-gutter' | 'su-slice'} $name -
|
||||
/// Name of the Su math function to call.
|
||||
/// @param {map} $config -
|
||||
/// Parsed and normalized map of Susy configuration settings
|
||||
/// to use for math-function arguments.
|
||||
///
|
||||
/// @return {*} -
|
||||
/// Results of the function being called.
|
||||
///
|
||||
/// @example scss -
|
||||
/// $user-input: 3 wide of susy-repeat(6, 120px) set-gutters 10px;
|
||||
/// $grid-data: susy-compile($user-input, $susy);
|
||||
///
|
||||
/// .su-span {
|
||||
/// width: su-call('su-span', $grid-data);
|
||||
/// }
|
||||
@function su-call(
|
||||
$name,
|
||||
$config
|
||||
) {
|
||||
$grid-function-args: (
|
||||
'su-span': ('span', 'columns', 'gutters', 'spread', 'container-spread', 'location'),
|
||||
'su-gutter': ('columns', 'gutters', 'container-spread'),
|
||||
'su-slice': ('span', 'columns', 'location'),
|
||||
);
|
||||
|
||||
$args: map-get($grid-function-args, $name);
|
||||
|
||||
@if not $args {
|
||||
$options: 'Try one of these: #{map-keys($grid-function-args)}';
|
||||
@return _susy-error(
|
||||
'#{$name} is not a public Su function. #{$options}',
|
||||
'su-call');
|
||||
}
|
||||
|
||||
$call: if(function-exists('get-function'), get-function($name), $name);
|
||||
$output: ();
|
||||
|
||||
@each $arg in $args {
|
||||
$value: map-get($config, $arg);
|
||||
$output: if($value, map-merge($output, ($arg: $value)), $output);
|
||||
}
|
||||
|
||||
@return call($call, $output...);
|
||||
}
|
||||
56
_sass/minimal-mistakes/vendor/susy/susy/_unprefix.scss
vendored
Normal file
56
_sass/minimal-mistakes/vendor/susy/susy/_unprefix.scss
vendored
Normal file
@@ -0,0 +1,56 @@
|
||||
// Unprefix Susy
|
||||
// =============
|
||||
|
||||
|
||||
// Span
|
||||
// ----
|
||||
/// Un-prefixed alias for `susy-span`
|
||||
/// (available by default)
|
||||
///
|
||||
/// @group api
|
||||
/// @alias susy-span
|
||||
///
|
||||
/// @param {list} $span
|
||||
/// @param {map} $config [()]
|
||||
@function span(
|
||||
$span,
|
||||
$config: ()
|
||||
) {
|
||||
@return susy-span($span, $config);
|
||||
}
|
||||
|
||||
|
||||
// Gutter
|
||||
// ------
|
||||
/// Un-prefixed alias for `susy-gutter`
|
||||
/// (available by default)
|
||||
///
|
||||
/// @group api
|
||||
/// @alias susy-gutter
|
||||
///
|
||||
/// @param {integer | list} $context [null] -
|
||||
/// @param {map} $config [()]
|
||||
@function gutter(
|
||||
$context: susy-get('columns'),
|
||||
$config: ()
|
||||
) {
|
||||
@return susy-gutter($context, $config);
|
||||
}
|
||||
|
||||
|
||||
// Slice
|
||||
// -----
|
||||
/// Un-prefixed alias for `susy-slice`
|
||||
/// (available by default)
|
||||
///
|
||||
/// @group api
|
||||
/// @alias susy-slice
|
||||
///
|
||||
/// @param {list} $span
|
||||
/// @param {map} $config [()]
|
||||
@function slice(
|
||||
$span,
|
||||
$config: ()
|
||||
) {
|
||||
@return susy-slice($span, $config);
|
||||
}
|
||||
167
_sass/minimal-mistakes/vendor/susy/susy/_utilities.scss
vendored
Normal file
167
_sass/minimal-mistakes/vendor/susy/susy/_utilities.scss
vendored
Normal file
@@ -0,0 +1,167 @@
|
||||
// Sass Utilities
|
||||
// ==============
|
||||
// - Susy Error Output Override [variable]
|
||||
// - Susy Error [function]
|
||||
|
||||
|
||||
|
||||
// Susy Error Output Override
|
||||
// --------------------------
|
||||
/// Turn off error output for testing
|
||||
/// @group x-utility
|
||||
/// @access private
|
||||
$_susy-error-output-override: false !default;
|
||||
|
||||
|
||||
|
||||
// Susy Error
|
||||
// ----------
|
||||
/// Optionally return error messages without failing,
|
||||
/// as a way to test error cases
|
||||
///
|
||||
/// @group x-utility
|
||||
/// @access private
|
||||
///
|
||||
/// @param {string} $message -
|
||||
/// A useful error message, explaining the problem
|
||||
/// @param {string} $source -
|
||||
/// The original source of the error for debugging
|
||||
/// @param {bool} $override [$_susy-error-output-override] -
|
||||
/// Optionally return the error rather than failing
|
||||
/// @return {string} -
|
||||
/// Combined error with source and message
|
||||
/// @throws When `$override == true`
|
||||
@function _susy-error(
|
||||
$message,
|
||||
$source,
|
||||
$override: $_susy-error-output-override
|
||||
) {
|
||||
@if $override {
|
||||
@return 'ERROR [#{$source}] #{$message}';
|
||||
}
|
||||
|
||||
@error '[#{$source}] #{$message}';
|
||||
}
|
||||
|
||||
|
||||
// Su Is Comparable
|
||||
// ----------------
|
||||
/// Check that the units in a grid are comparable
|
||||
///
|
||||
/// @group x-validation
|
||||
/// @access private
|
||||
///
|
||||
/// @param {numbers} $lengths… -
|
||||
/// Arglist of all the number values to compare
|
||||
/// (columns, gutters, span, etc)
|
||||
///
|
||||
/// @return {'fluid' | 'static' | false} -
|
||||
/// The type of span (fluid or static) when units match,
|
||||
/// or `false` for mismatched units
|
||||
@function _su-is-comparable(
|
||||
$lengths...
|
||||
) {
|
||||
$first: nth($lengths, 1);
|
||||
|
||||
@if (length($lengths) == 1) {
|
||||
@return if(unitless($first), 'fluid', 'static');
|
||||
}
|
||||
|
||||
@for $i from 2 through length($lengths) {
|
||||
$comp: nth($lengths, $i);
|
||||
|
||||
$fail: not comparable($first, $comp);
|
||||
$fail: $fail or (unitless($first) and not unitless($comp));
|
||||
$fail: $fail or (unitless($comp) and not unitless($first));
|
||||
|
||||
@if $fail {
|
||||
@return false;
|
||||
}
|
||||
}
|
||||
|
||||
@return if(unitless($first), 'fluid', 'static');
|
||||
}
|
||||
|
||||
|
||||
// Su Map Add Units
|
||||
// ----------------
|
||||
/// The calc features use a map of units and values
|
||||
/// to compile the proper algorythm.
|
||||
/// This function adds a new value to any comparable existing unit/value,
|
||||
/// or adds a new unit/value pair to the map
|
||||
///
|
||||
/// @group x-utility
|
||||
/// @access private
|
||||
///
|
||||
/// @param {map} $map -
|
||||
/// A map of unit/value pairs, e.g. ('px': 120px)
|
||||
/// @param {length} $value -
|
||||
/// A new length to be added to the map
|
||||
/// @return {map} -
|
||||
/// The updated map, with new value added
|
||||
///
|
||||
/// @example scss -
|
||||
/// $map: (0px: 120px);
|
||||
/// $map: _su-map-add-units($map, 1in); // add a comparable unit
|
||||
/// $map: _su-map-add-units($map, 3vw); // add a new unit
|
||||
///
|
||||
/// @each $units, $value in $map {
|
||||
/// /* #{$units}: #{$value} */
|
||||
/// }
|
||||
@function _su-map-add-units(
|
||||
$map,
|
||||
$value
|
||||
) {
|
||||
$unit: $value * 0;
|
||||
$has: map-get($map, $unit) or 0;
|
||||
|
||||
@if ($has == 0) {
|
||||
@each $try, $could in $map {
|
||||
$match: comparable($try, $value);
|
||||
$unit: if($match, $try, $unit);
|
||||
$has: if($match, $could, $has);
|
||||
}
|
||||
}
|
||||
|
||||
@return map-merge($map, ($unit: $has + $value));
|
||||
}
|
||||
|
||||
|
||||
// Susy Flatten
|
||||
// ------------
|
||||
/// Flatten a multidimensional list
|
||||
///
|
||||
/// @group x-utility
|
||||
/// @access private
|
||||
///
|
||||
/// @param {list} $list -
|
||||
/// The list to be flattened
|
||||
/// @return {list} -
|
||||
/// The flattened list
|
||||
///
|
||||
/// @example scss -
|
||||
/// $list: 120px (30em 30em) 120px;
|
||||
/// /* #{_susy-flatten($list)} */
|
||||
@function _susy-flatten(
|
||||
$list
|
||||
) {
|
||||
$flat: ();
|
||||
|
||||
// Don't iterate over maps
|
||||
@if (type-of($list) == 'map') {
|
||||
@return $list;
|
||||
}
|
||||
|
||||
// Iterate over lists (or single items)
|
||||
@each $item in $list {
|
||||
@if (type-of($item) == 'list') {
|
||||
$item: _susy-flatten($item);
|
||||
$flat: join($flat, $item);
|
||||
} @else {
|
||||
$flat: append($flat, $item);
|
||||
}
|
||||
}
|
||||
|
||||
// Return flattened list
|
||||
@return $flat;
|
||||
}
|
||||
4
_sass/vendor/susy/_susy.scss
vendored
4
_sass/vendor/susy/_susy.scss
vendored
@@ -1,4 +0,0 @@
|
||||
// Susy
|
||||
// ====
|
||||
|
||||
@import 'susy/language/susy';
|
||||
4
_sass/vendor/susy/_susyone.scss
vendored
4
_sass/vendor/susy/_susyone.scss
vendored
@@ -1,4 +0,0 @@
|
||||
// Susy
|
||||
// ====
|
||||
|
||||
@import 'susy/language/susyone';
|
||||
7
_sass/vendor/susy/susy/_su.scss
vendored
7
_sass/vendor/susy/susy/_su.scss
vendored
@@ -1,7 +0,0 @@
|
||||
// Su
|
||||
// ==
|
||||
|
||||
@import "su/utilities";
|
||||
@import "su/settings";
|
||||
@import "su/validation";
|
||||
@import "su/grid";
|
||||
24
_sass/vendor/susy/susy/language/_susy.scss
vendored
24
_sass/vendor/susy/susy/language/_susy.scss
vendored
@@ -1,24 +0,0 @@
|
||||
// Susy Next Syntax
|
||||
// ================
|
||||
|
||||
$susy-version: 2.1;
|
||||
|
||||
@import "../su";
|
||||
@import "../output/float";
|
||||
|
||||
@import "susy/settings";
|
||||
@import "susy/validation";
|
||||
@import "susy/grids";
|
||||
@import "susy/box-sizing";
|
||||
@import "susy/context";
|
||||
@import "susy/background";
|
||||
@import "susy/container";
|
||||
@import "susy/span";
|
||||
@import "susy/gutters";
|
||||
@import "susy/isolate";
|
||||
@import "susy/gallery";
|
||||
@import "susy/rows";
|
||||
@import "susy/margins";
|
||||
@import "susy/padding";
|
||||
@import "susy/bleed";
|
||||
@import "susy/breakpoint-plugin";
|
||||
13
_sass/vendor/susy/susy/language/_susyone.scss
vendored
13
_sass/vendor/susy/susy/language/_susyone.scss
vendored
@@ -1,13 +0,0 @@
|
||||
// ---------------------------------------------------------------------------
|
||||
// Partials
|
||||
|
||||
$susy-version: 1.5;
|
||||
|
||||
@import "susyone/settings";
|
||||
@import "susyone/functions";
|
||||
@import "susyone/grid";
|
||||
@import "susyone/isolation";
|
||||
@import "susyone/padding";
|
||||
@import "susyone/margin";
|
||||
@import "susyone/media";
|
||||
@import "susyone/background";
|
||||
@@ -1,385 +0,0 @@
|
||||
// Background Grid Syntax
|
||||
// ======================
|
||||
|
||||
$susy-overlay-grid-head-exists: false;
|
||||
|
||||
|
||||
// Show Grid/s
|
||||
// -----------
|
||||
// Show grid on any element using either background or overlay.
|
||||
// - [$grid] : <settings>
|
||||
@mixin show-grid(
|
||||
$grid: $susy
|
||||
) {
|
||||
$inspect: $grid;
|
||||
$_output: debug-get(output, $grid);
|
||||
|
||||
@include susy-inspect(show-grid, $inspect);
|
||||
@if $_output == overlay and susy-get(debug image, $grid) != hide {
|
||||
@include overlay-grid($grid);
|
||||
} @else {
|
||||
@include background-grid($grid);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin show-grids(
|
||||
$grid: $susy
|
||||
) {
|
||||
@include show-grid($grid);
|
||||
}
|
||||
|
||||
// Background Grid
|
||||
// ---------------
|
||||
// Show a grid background on any element.
|
||||
// - [$grid] : <settings>
|
||||
@mixin background-grid(
|
||||
$grid: $susy
|
||||
) {
|
||||
$inspect : $grid;
|
||||
$_output : get-background($grid);
|
||||
|
||||
@if length($_output) > 0 {
|
||||
$_flow: susy-get(flow, $grid);
|
||||
|
||||
$_image: ();
|
||||
@each $name, $layer in map-get($_output, image) {
|
||||
$_direction: if($name == baseline, to bottom, to to($_flow));
|
||||
$_image: append($_image, linear-gradient($_direction, $layer), comma);
|
||||
}
|
||||
$_output: map-merge($_output, (image: $_image));
|
||||
|
||||
@include background-grid-output($_output...);
|
||||
@include susy-inspect(background-grid, $inspect);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Overlay Grid
|
||||
// ------------
|
||||
// Generate an icon to trigger grid-overlays on any given elements.
|
||||
// $grids... : <selector> [<settings>] [, <selector>]*
|
||||
@mixin overlay-grid (
|
||||
$grid: $susy
|
||||
) {
|
||||
@if not($susy-overlay-grid-head-exists) {
|
||||
@at-root head { @include overlay-head($grid); }
|
||||
@at-root head:before { @include overlay-trigger; }
|
||||
@at-root head:hover { @include overlay-trigger-hover; }
|
||||
$susy-overlay-grid-head-exists: true !global;
|
||||
}
|
||||
|
||||
head:hover ~ &,
|
||||
head:hover ~ body & {
|
||||
position: relative;
|
||||
&:before {
|
||||
@include grid-overlay-base;
|
||||
@include background-grid($grid);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// [Private] Overlay Trigger
|
||||
// -------------------------
|
||||
@mixin overlay-trigger {
|
||||
content: "|||";
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
font: {
|
||||
family: sans-serif;
|
||||
size: 16px;
|
||||
weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// [Private] Overlay Trigger Hover
|
||||
// -------------------------------
|
||||
@mixin overlay-trigger-hover {
|
||||
background: rgba(white, .5);
|
||||
color: red;
|
||||
}
|
||||
|
||||
|
||||
// [Private] Overlay Head
|
||||
// ----------------------
|
||||
// <head> styles to create grid overlay toggle
|
||||
@mixin overlay-head (
|
||||
$grid: $susy
|
||||
) {
|
||||
$_toggle: debug-get(toggle, $grid);
|
||||
$_horz: null;
|
||||
$_vert: null;
|
||||
|
||||
@each $side in $_toggle {
|
||||
$_horz: if($side == left or $side == right, $side, $_horz);
|
||||
$_vert: if($side == top or $side == bottom, $side, $_vert);
|
||||
}
|
||||
|
||||
display: block;
|
||||
position: fixed;
|
||||
#{$_horz}: 10px;
|
||||
#{$_vert}: 10px;
|
||||
z-index: 999;
|
||||
color: #333;
|
||||
background: rgba(white, .25);
|
||||
}
|
||||
|
||||
|
||||
// [Private] Grid Overlay Base
|
||||
// ---------------------------
|
||||
// Base styles for generating a grid overlay
|
||||
@mixin grid-overlay-base() {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
content: " ";
|
||||
z-index: 998;
|
||||
}
|
||||
|
||||
|
||||
// Get Symmetrical Background
|
||||
// --------------------------
|
||||
// - $grid: <map>
|
||||
@function get-background-sym(
|
||||
$grid
|
||||
) {
|
||||
$grid : parse-grid($grid);
|
||||
$_gutters : susy-get(gutters, $grid);
|
||||
$_column-width : susy-get(column-width, $grid);
|
||||
$_math : susy-get(math, $grid);
|
||||
|
||||
$_color : debug-get(color);
|
||||
$_trans : transparent;
|
||||
$_light : lighten($_color, 15%);
|
||||
|
||||
$_end : 1 + $_gutters;
|
||||
$_after : percentage(1/$_end);
|
||||
$_stops : ();
|
||||
$_size : span(1 $grid wide);
|
||||
|
||||
@if is-inside($grid) {
|
||||
$_stops: $_color, $_light;
|
||||
} @else if is-split($grid) {
|
||||
$_split: $_gutters/2;
|
||||
$_before: percentage($_split/$_end);
|
||||
$_after: percentage((1 + $_split)/$_end);
|
||||
$_stops: $_trans $_before, $_color $_before, $_light $_after, $_trans $_after;
|
||||
} @else {
|
||||
$_stops: $_color, $_light $_after, $_trans $_after;
|
||||
}
|
||||
|
||||
@if $_math == static {
|
||||
$_size: valid-column-math($_math, $_column-width) * $_end;
|
||||
}
|
||||
|
||||
$_output: (
|
||||
image: (columns: $_stops),
|
||||
size: $_size,
|
||||
);
|
||||
|
||||
@return $_output;
|
||||
}
|
||||
|
||||
|
||||
// Get Asymmetrical Inside
|
||||
// -----------------------
|
||||
// - $grid: <settings>
|
||||
@function get-asym-inside(
|
||||
$grid
|
||||
) {
|
||||
$grid : parse-grid($grid);
|
||||
$_columns : susy-get(columns, $grid);
|
||||
|
||||
$_color : debug-get(color);
|
||||
$_light : lighten($_color, 15%);
|
||||
$_stops : ();
|
||||
|
||||
@for $location from 1 through susy-count($_columns) {
|
||||
$this-stop: ();
|
||||
|
||||
@if $location == 1 {
|
||||
$this-stop: append($this-stop, $_color, comma);
|
||||
} @else {
|
||||
$start: parse-span(1 at $location $grid);
|
||||
$start: get-isolation($start);
|
||||
$this-stop: append($this-stop, $_color $start, comma);
|
||||
}
|
||||
|
||||
@if $location == susy-count($_columns) {
|
||||
$this-stop: append($this-stop, $_light, comma);
|
||||
} @else {
|
||||
$_end: parse-span(1 at ($location + 1) $grid);
|
||||
$_end: get-isolation($_end);
|
||||
$this-stop: append($this-stop, $_light $_end, comma);
|
||||
}
|
||||
|
||||
$_stops: join($_stops, $this-stop, comma);
|
||||
}
|
||||
|
||||
@return $_stops;
|
||||
}
|
||||
|
||||
|
||||
// Get Asymmetrical Split
|
||||
// ----------------------
|
||||
// - $grid: <settings>
|
||||
@function get-asym-split(
|
||||
$grid
|
||||
) {
|
||||
$grid : parse-grid($grid);
|
||||
$_columns : susy-get(columns, $grid);
|
||||
|
||||
$_color : debug-get(color);
|
||||
$_light : lighten($_color, 15%);
|
||||
$_stops : ();
|
||||
|
||||
@for $location from 1 through susy-count($_columns) {
|
||||
$this-stop: ();
|
||||
|
||||
$start: parse-span(1 at $location $grid);
|
||||
$start: get-isolation($start);
|
||||
$this-stop: append($this-stop, transparent $start, comma);
|
||||
$this-stop: append($this-stop, $_color $start, comma);
|
||||
|
||||
$_end: $start + span(1 at $location $grid);
|
||||
$this-stop: append($this-stop, $_light $_end, comma);
|
||||
$this-stop: append($this-stop, transparent $_end, comma);
|
||||
|
||||
$_stops: join($_stops, $this-stop, comma);
|
||||
}
|
||||
|
||||
@return $_stops;
|
||||
}
|
||||
|
||||
|
||||
// Get Asymmetrical Outside
|
||||
// ------------------------
|
||||
// - $grid: <settings>
|
||||
@function get-asym-outside(
|
||||
$grid
|
||||
) {
|
||||
$grid : parse-grid($grid);
|
||||
$_columns : susy-get(columns, $grid);
|
||||
|
||||
$_color : debug-get(color);
|
||||
$_light : lighten($_color, 15%);
|
||||
$_trans : transparent;
|
||||
$_stops : ();
|
||||
|
||||
@for $location from 1 through susy-count($_columns) {
|
||||
$this-stop: ();
|
||||
|
||||
@if $location == 1 {
|
||||
$this-stop: append($this-stop, $_color, comma);
|
||||
} @else {
|
||||
$start: parse-span(1 at $location $grid);
|
||||
$start: get-isolation($start);
|
||||
$this-stop: append($this-stop, $_color $start, comma);
|
||||
}
|
||||
|
||||
@if $location == susy-count($_columns) {
|
||||
$this-stop: append($this-stop, $_light, comma);
|
||||
} @else {
|
||||
$gutter: get-span-width(first $location $grid);
|
||||
|
||||
$_end: parse-span(1 at ($location + 1) $grid);
|
||||
$_end: get-isolation($_end);
|
||||
|
||||
$gutter: $_light $gutter, $_trans $gutter, $_trans $_end;
|
||||
$this-stop: join($this-stop, $gutter, comma);
|
||||
}
|
||||
|
||||
$_stops: join($_stops, $this-stop, comma);
|
||||
}
|
||||
|
||||
@return $_stops;
|
||||
}
|
||||
|
||||
|
||||
// Get Asymmetrical Background
|
||||
// ---------------------------
|
||||
// - $grid: <settings>
|
||||
@function get-background-asym(
|
||||
$grid
|
||||
) {
|
||||
$_stops: ();
|
||||
|
||||
@if is-inside($grid) {
|
||||
$_stops: get-asym-inside($grid);
|
||||
} @else if is-split($grid) {
|
||||
$_stops: get-asym-split($grid);
|
||||
} @else {
|
||||
$_stops: get-asym-outside($grid);
|
||||
}
|
||||
|
||||
@return (image: (columns: $_stops));
|
||||
}
|
||||
|
||||
|
||||
// Get Background
|
||||
// --------------
|
||||
// - $grid: <settings>
|
||||
@function get-background(
|
||||
$grid
|
||||
) {
|
||||
$grid : parse-grid($grid);
|
||||
$_show : susy-get(debug image, $grid);
|
||||
$_return : ();
|
||||
|
||||
@if $_show and $_show != 'hide' {
|
||||
$_columns: susy-get(columns, $grid);
|
||||
|
||||
@if $_show != 'show-baseline' {
|
||||
$_sym: is-symmetrical($_columns);
|
||||
$_return: if($_sym, get-background-sym($grid), get-background-asym($grid));
|
||||
$_return: map-merge($_return, (clip: content-box));
|
||||
}
|
||||
|
||||
@if $_show != 'show-columns'
|
||||
and global-variable-exists(base-line-height)
|
||||
and type-of($base-line-height) == 'number'
|
||||
and not unitless($base-line-height) {
|
||||
$_color: variable-exists('grid-background-baseline-color');
|
||||
$_color: if($_color, $grid-background-baseline-color, #000);
|
||||
|
||||
$_image: map-get($_return, image);
|
||||
$_size: map-get($_return, size);
|
||||
$_baseline: (baseline: ($_color 1px, transparent 1px));
|
||||
$_baseline-size: 100% $base-line-height;
|
||||
|
||||
$_return: map-merge($_return, (
|
||||
image: if($_image, map-merge($_image, $_baseline), $_baseline),
|
||||
size: if($_size, ($_size, $_baseline-size), $_baseline-size),
|
||||
));
|
||||
|
||||
@if $_show == 'show' {
|
||||
$_clip: map-get($_return, clip);
|
||||
$_return: map-merge($_return, (clip: join($_clip, border-box, comma)));
|
||||
}
|
||||
} @else if $_show == 'show-baseline' {
|
||||
@warn 'Please provide a $base-line-height with the desired height and units';
|
||||
}
|
||||
}
|
||||
|
||||
@if map-get($_return, image) {
|
||||
$_return: map-merge($_return, (flow: susy-get(flow, $grid)));
|
||||
}
|
||||
|
||||
@return $_return;
|
||||
}
|
||||
|
||||
|
||||
// Get Debug
|
||||
// ---------
|
||||
// Return the value of a debug setting
|
||||
// - $key: <setting>
|
||||
@function debug-get(
|
||||
$key,
|
||||
$grid: $susy
|
||||
) {
|
||||
$key: join(debug, $key, space);
|
||||
@return susy-get($key, $grid);
|
||||
}
|
||||
200
_sass/vendor/susy/susy/language/susy/_bleed.scss
vendored
200
_sass/vendor/susy/susy/language/susy/_bleed.scss
vendored
@@ -1,200 +0,0 @@
|
||||
// Bleed Syntax
|
||||
// ============
|
||||
|
||||
// Bleed
|
||||
// -----
|
||||
// Add negative margins, and equal positive padding to create bleed.
|
||||
// - $bleed : <span>
|
||||
@mixin bleed(
|
||||
$bleed: 0 gutter()
|
||||
) {
|
||||
$inspect : $bleed;
|
||||
$output : get-bleed($bleed);
|
||||
|
||||
@if susy-get(global-box-sizing) != content-box {
|
||||
$output: map-merge((box-sizing: content-box), $output);
|
||||
}
|
||||
|
||||
@include susy-inspect(bleed, $inspect);
|
||||
@include output($output);
|
||||
}
|
||||
|
||||
|
||||
// Bleed-x
|
||||
// -------
|
||||
// Shortcut for horizontal bleed.
|
||||
// - $bleed : <span>
|
||||
@mixin bleed-x(
|
||||
$bleed: gutter()
|
||||
) {
|
||||
$bleed : parse-span($bleed);
|
||||
$trbl : susy-get(span, $bleed);
|
||||
|
||||
@if length($trbl) == 1 {
|
||||
$bleed: map-merge($bleed, (span: 0 nth($trbl, 1)));
|
||||
} @else if length($trbl) == 2 {
|
||||
$bleed: map-merge($bleed, (span: 0 nth($trbl, 2) 0 nth($trbl, 1)));
|
||||
} @else {
|
||||
@warn 'bleed-x only takes 2 lengths, but #{length($trbl)} were passed.';
|
||||
}
|
||||
|
||||
@include bleed($bleed);
|
||||
}
|
||||
|
||||
|
||||
// Bleed-y
|
||||
// -------
|
||||
// Shortcut for vertical bleed.
|
||||
// - $bleed : <span>
|
||||
@mixin bleed-y(
|
||||
$bleed: if(function-exists(rhythm), rhythm(1), 1em)
|
||||
) {
|
||||
$bleed : parse-span($bleed);
|
||||
$trbl : susy-get(span, $bleed);
|
||||
|
||||
@if length($trbl) == 1 {
|
||||
$bleed: map-merge($bleed, (span: nth($trbl, 1) 0));
|
||||
} @else if length($trbl) == 2 {
|
||||
$bleed: map-merge($bleed, (span: nth($trbl, 1) 0 nth($trbl, 2) 0));
|
||||
} @else {
|
||||
@warn 'bleed-y only takes 2 lengths, but #{length($trbl)} were passed.';
|
||||
}
|
||||
|
||||
@include bleed($bleed);
|
||||
}
|
||||
|
||||
|
||||
// Get Bleed
|
||||
// ---------
|
||||
// Return bleed output values
|
||||
// - $bleed: <span>
|
||||
@function get-bleed(
|
||||
$bleed
|
||||
) {
|
||||
$bleed : map-merge((spread: wide), parse-span($bleed));
|
||||
$trbl : susy-get(span, $bleed);
|
||||
$short : null;
|
||||
$output : ();
|
||||
|
||||
@for $i from 1 through length($trbl) {
|
||||
$this: nth($trbl, $i);
|
||||
$new: ();
|
||||
$margin: null;
|
||||
$padding: null;
|
||||
$padding-x: null;
|
||||
|
||||
@if $this > 0 {
|
||||
$this: map-merge($bleed, (span: $this));
|
||||
$margin: span($this);
|
||||
$padding: $margin;
|
||||
$padding-x: $padding;
|
||||
}
|
||||
|
||||
@if $margin and $margin > 0 {
|
||||
$margin: - $margin;
|
||||
|
||||
@if is-inside($this) {
|
||||
$gutter: gutter($this);
|
||||
$join: if($gutter and comparable($padding, $gutter), true, false);
|
||||
$padding-x: if($join and $padding > 0, $padding + $gutter, $padding);
|
||||
}
|
||||
}
|
||||
|
||||
@if $i == 1 {
|
||||
$new: (
|
||||
margin-top: $margin,
|
||||
padding-top: $padding,
|
||||
margin-right: $margin,
|
||||
padding-right: $padding-x,
|
||||
margin-bottom: $margin,
|
||||
padding-bottom: $padding,
|
||||
margin-left: $margin,
|
||||
padding-left: $padding-x,
|
||||
);
|
||||
} @else if $i == 2 {
|
||||
$new: (
|
||||
margin-right: $margin,
|
||||
padding-right: $padding-x,
|
||||
margin-left: $margin,
|
||||
padding-left: $padding-x,
|
||||
);
|
||||
} @else if $i == 3 {
|
||||
$new: (
|
||||
margin-bottom: $margin,
|
||||
padding-bottom: $padding,
|
||||
);
|
||||
} @else if $i == 4 {
|
||||
$new: (
|
||||
margin-left: $margin,
|
||||
padding-left: $padding-x,
|
||||
);
|
||||
}
|
||||
|
||||
$output: map-merge($output, $new);
|
||||
}
|
||||
|
||||
@each $prop, $value in $output {
|
||||
$output: if($value == 0, map-merge($output, ($prop: null)), $output);
|
||||
}
|
||||
|
||||
@return bleed-shorthand($output);
|
||||
}
|
||||
|
||||
// Bleed Shorthand
|
||||
// ---------------
|
||||
// Convert bleed output into shorthand when possible.
|
||||
// - $bleed: <output map>
|
||||
@function bleed-shorthand(
|
||||
$bleed
|
||||
) {
|
||||
$margin: ();
|
||||
$padding: ();
|
||||
$return: ();
|
||||
|
||||
@each $key, $value in $bleed {
|
||||
@if str-index($key, margin) {
|
||||
$margin: map-merge($margin, ($key: $value));
|
||||
} @else if str-index($key, padding) > 0 {
|
||||
$padding: map-merge($padding, ($key: $value));
|
||||
}
|
||||
}
|
||||
|
||||
$props: (
|
||||
margin: $margin,
|
||||
padding: $padding,
|
||||
);
|
||||
|
||||
@each $name, $map in $props {
|
||||
$four: if(length(map-keys($map)) == 4, true, false);
|
||||
$null: if(index(map-values($map), null), true, false);
|
||||
|
||||
@if $four and not($null) {
|
||||
$top: map-get($map, '#{$name}-top');
|
||||
$right: map-get($map, '#{$name}-right');
|
||||
$bottom: map-get($map, '#{$name}-bottom');
|
||||
$left: map-get($map, '#{$name}-left');
|
||||
|
||||
$tb: if($top == $bottom, $top, null);
|
||||
$rl: if($right == $left, $right, null);
|
||||
$all: if($tb == $rl, $tb, null);
|
||||
|
||||
$new: if($all, $all, null);
|
||||
|
||||
@if not($new) {
|
||||
@if $tb and $rl {
|
||||
$new: $tb $rl;
|
||||
} @else if $rl {
|
||||
$new: $top $rl $bottom;
|
||||
} @else {
|
||||
$new: $top $right $bottom $left;
|
||||
}
|
||||
}
|
||||
|
||||
$return: map-merge($return, ($name: $new));
|
||||
} @else {
|
||||
$return: map-merge($return, $map);
|
||||
}
|
||||
}
|
||||
|
||||
@return $return;
|
||||
}
|
||||
@@ -1,47 +0,0 @@
|
||||
// Susy Box Sizing
|
||||
// =================
|
||||
|
||||
// Global Box Sizing
|
||||
// -----------------
|
||||
// Set a box model globally on all elements.
|
||||
// - [$box]: border-box | content-box
|
||||
// - [$inherit]: true | false
|
||||
@mixin global-box-sizing(
|
||||
$box: susy-get(global-box-sizing),
|
||||
$inherit: false
|
||||
) {
|
||||
$inspect: $box;
|
||||
|
||||
@if $inherit {
|
||||
@at-root {
|
||||
html { @include output((box-sizing: $box)); }
|
||||
*, *:before, *:after { box-sizing: inherit; }
|
||||
}
|
||||
} @else {
|
||||
*, *:before, *:after { @include output((box-sizing: $box)); }
|
||||
}
|
||||
|
||||
@include susy-inspect(global-box-sizing, $inspect);
|
||||
@include update-box-model($box);
|
||||
}
|
||||
|
||||
// Border Box Sizing
|
||||
// -----------------
|
||||
// A legacy shortcut...
|
||||
// - [$inherit]: true | false
|
||||
@mixin border-box-sizing(
|
||||
$inherit: false
|
||||
) {
|
||||
@include global-box-sizing(border-box, $inherit);
|
||||
}
|
||||
|
||||
// Update Box Model
|
||||
// ----------------
|
||||
// PRIVATE: Updates global box model setting
|
||||
@mixin update-box-model(
|
||||
$box
|
||||
) {
|
||||
@if $box != susy-get(global-box-sizing) {
|
||||
@include susy-set(global-box-sizing, $box);
|
||||
}
|
||||
}
|
||||
@@ -1,185 +0,0 @@
|
||||
// Breakpoint Integration
|
||||
// ======================
|
||||
|
||||
$susy-media: () !default;
|
||||
$susy-media-fallback: false !default;
|
||||
|
||||
$_susy-media-context: ();
|
||||
|
||||
|
||||
// Susy Breakpoint
|
||||
// ---------------
|
||||
// Change grids at different media query breakpoints.
|
||||
// - $query : <min-width> [<max-width>] | <property> <value> | <map>
|
||||
// - $layout : <settings>
|
||||
// - $no-query : <boolean> | <selector>
|
||||
@mixin susy-breakpoint(
|
||||
$query,
|
||||
$layout: false,
|
||||
$no-query: $susy-media-fallback
|
||||
) {
|
||||
@include susy-media-router($query, $no-query) {
|
||||
@if $layout {
|
||||
@include with-layout($layout) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Susy Media
|
||||
// ----------
|
||||
// - $query: <min-width> [<max-width>] | <property> <value>
|
||||
// - $no-query: <boolean> | <selector>
|
||||
@mixin susy-media(
|
||||
$query,
|
||||
$no-query: $susy-media-fallback
|
||||
) {
|
||||
$old-context: $_susy-media-context;
|
||||
$name: if(map-has-key($susy-media, $query), $query, null);
|
||||
$query: susy-get-media($query);
|
||||
$query: susy-parse-media($query);
|
||||
|
||||
@include susy-media-context($query, $name);
|
||||
|
||||
@if $no-query and type-of($no-query) != string {
|
||||
@content;
|
||||
} @else {
|
||||
@media #{susy-render-media($query)} {
|
||||
@content;
|
||||
}
|
||||
|
||||
@if type-of($no-query) == string {
|
||||
#{$no-query} & {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include susy-media-context($old-context, $clean: true);
|
||||
}
|
||||
|
||||
|
||||
// Media Router
|
||||
// ------------
|
||||
// Rout media arguments to the correct mixin.
|
||||
@mixin susy-media-router(
|
||||
$query,
|
||||
$no-query: $susy-media-fallback
|
||||
) {
|
||||
@if susy-support(breakpoint, (mixin: breakpoint), $warn: false) {
|
||||
@include breakpoint($query, $no-query) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@include susy-media($query, $no-query) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Update Context
|
||||
// -------------
|
||||
// Set the new media context
|
||||
@mixin susy-media-context(
|
||||
$query,
|
||||
$name: null,
|
||||
$clean: false
|
||||
) {
|
||||
$query: map-merge((name: $name), $query);
|
||||
|
||||
@if $clean {
|
||||
$_susy-media-context: $query !global;
|
||||
} @else {
|
||||
$_susy-media-context: map-merge($_susy-media-context, $query) !global;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Media Context
|
||||
// -------------
|
||||
// Return the full media context, or a single media property (e.g. min-width)
|
||||
@function susy-media-context(
|
||||
$property: false
|
||||
) {
|
||||
@if $property {
|
||||
@return map-get($_susy-media-context, $property);
|
||||
} @else {
|
||||
@return $_susy-media-context;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Get Media
|
||||
// ---------
|
||||
// Return a named media-query from $susy-media.
|
||||
// - $name: <key>
|
||||
@function susy-get-media(
|
||||
$name
|
||||
) {
|
||||
@if map-has-key($susy-media, $name) {
|
||||
$map-value: map-get($susy-media, $name);
|
||||
@if ($name == $map-value) {
|
||||
$name: $map-value;
|
||||
} @else {
|
||||
$name: susy-get-media($map-value);
|
||||
}
|
||||
}
|
||||
|
||||
@return $name;
|
||||
}
|
||||
|
||||
|
||||
// Render Media
|
||||
// ------------
|
||||
// Build a media-query string from various media settings
|
||||
@function susy-render-media(
|
||||
$query
|
||||
) {
|
||||
$output: null;
|
||||
@each $property, $value in $query {
|
||||
$string: null;
|
||||
|
||||
@if $property == media {
|
||||
$string: $value;
|
||||
} @else {
|
||||
$string: '(#{$property}: #{$value})';
|
||||
}
|
||||
|
||||
$output: if($output, '#{$output} and #{$string}', $string);
|
||||
}
|
||||
|
||||
@return $output;
|
||||
}
|
||||
|
||||
|
||||
// Parse Media
|
||||
// -----------
|
||||
// Return parsed media-query settings based on shorthand
|
||||
@function susy-parse-media(
|
||||
$query
|
||||
) {
|
||||
$mq: null;
|
||||
@if type-of($query) == map {
|
||||
$mq: $query;
|
||||
} @else if type-of($query) == number {
|
||||
$mq: (min-width: $query);
|
||||
} @else if type-of($query) == list and length($query) == 2 {
|
||||
@if type-of(nth($query, 1)) == number {
|
||||
$mq: (
|
||||
min-width: min($query...),
|
||||
max-width: max($query...),
|
||||
);
|
||||
} @else {
|
||||
$mq: (nth($query, 1): nth($query, 2));
|
||||
}
|
||||
} @else {
|
||||
$mq: (media: '#{$query}');
|
||||
}
|
||||
|
||||
@return $mq;
|
||||
}
|
||||
@@ -1,81 +0,0 @@
|
||||
// Container Syntax
|
||||
// ================
|
||||
|
||||
// Container [mixin]
|
||||
// -----------------
|
||||
// Set a container element
|
||||
// - [$layout] : <settings>
|
||||
@mixin container(
|
||||
$layout: $susy
|
||||
) {
|
||||
$inspect : $layout;
|
||||
$layout : parse-grid($layout);
|
||||
|
||||
$_width : get-container-width($layout);
|
||||
$_justify : parse-container-position(susy-get(container-position, $layout));
|
||||
$_property : if(susy-get(math, $layout) == static, width, max-width);
|
||||
|
||||
$_box : susy-get(box-sizing, $layout);
|
||||
|
||||
@if $_box {
|
||||
@include output((box-sizing: $_box));
|
||||
}
|
||||
|
||||
@include susy-inspect(container, $inspect);
|
||||
@include float-container($_width, $_justify, $_property);
|
||||
@include show-grid($layout);
|
||||
}
|
||||
|
||||
// Container [function]
|
||||
// --------------------
|
||||
// Return container width
|
||||
// - [$layout] : <settings>
|
||||
@function container(
|
||||
$layout: $susy
|
||||
) {
|
||||
$layout: parse-grid($layout);
|
||||
@return get-container-width($layout);
|
||||
}
|
||||
|
||||
// Get Container Width
|
||||
// -------------------
|
||||
// Calculate the container width
|
||||
// - [$layout]: <settings>
|
||||
@function get-container-width(
|
||||
$layout: $susy
|
||||
) {
|
||||
$layout : parse-grid($layout);
|
||||
$_width : susy-get(container, $layout);
|
||||
$_column-width : susy-get(column-width, $layout);
|
||||
$_math : susy-get(math, $layout);
|
||||
|
||||
@if not($_width) or $_width == auto {
|
||||
@if valid-column-math($_math, $_column-width) {
|
||||
$_columns : susy-get(columns, $layout);
|
||||
$_gutters : susy-get(gutters, $layout);
|
||||
$_spread : if(is-split($layout), wide, narrow);
|
||||
$_width : susy-sum($_columns, $_gutters, $_spread) * $_column-width;
|
||||
} @else {
|
||||
$_width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@return $_width;
|
||||
}
|
||||
|
||||
// Parse Container Position
|
||||
// ------------------------
|
||||
// Parse the $container-position into margin values.
|
||||
// - [$justify] : left | center | right | <length> [<length>]
|
||||
@function parse-container-position(
|
||||
$justify: map-get($susy-defaults, container-position)
|
||||
) {
|
||||
$_return: if($justify == left, 0, auto) if($justify == right, 0, auto);
|
||||
|
||||
@if not(index(left right center, $justify)) {
|
||||
$_return: nth($justify, 1);
|
||||
$_return: $_return if(length($justify) > 1, nth($justify, 2), $_return);
|
||||
}
|
||||
|
||||
@return $_return;
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
// Context Syntax
|
||||
// ==============
|
||||
|
||||
// Nested [function]
|
||||
// -----------------
|
||||
// Return a subset grid for nested context.
|
||||
// - $context : <span>
|
||||
@function nested(
|
||||
$context
|
||||
) {
|
||||
$context : parse-span($context);
|
||||
$span : susy-get(span, $context);
|
||||
$location : get-location($context);
|
||||
$columns : susy-get(columns, $context);
|
||||
|
||||
@return susy-slice($span, $location, $columns);
|
||||
}
|
||||
|
||||
// Nested [mixin]
|
||||
// --------------
|
||||
// Use a subset grid for a nested context
|
||||
// - $context : <span>
|
||||
// - @content : <content>
|
||||
@mixin nested(
|
||||
$context
|
||||
) {
|
||||
$inspect : $context;
|
||||
$context : parse-span($context);
|
||||
$old : susy-get(columns);
|
||||
$susy : map-merge($susy, (columns: nested($context))) !global;
|
||||
|
||||
@include susy-inspect(nested, $inspect);
|
||||
@content;
|
||||
|
||||
$susy : map-merge($susy, (columns: $old)) !global;
|
||||
}
|
||||
@@ -1,94 +0,0 @@
|
||||
// Gallery Syntax
|
||||
// ==============
|
||||
|
||||
// Gallery
|
||||
// -------
|
||||
// Create an isolated gallery
|
||||
// - $span : <span>
|
||||
// - [$selector] : child | of-type
|
||||
@mixin gallery(
|
||||
$span,
|
||||
$selector: child
|
||||
) {
|
||||
$inspect : $span;
|
||||
$span : parse-span($span);
|
||||
$span : map-merge($span, (location: 1));
|
||||
|
||||
$n : susy-get(span, $span);
|
||||
$columns : susy-get(columns, $span);
|
||||
$context : susy-count($columns);
|
||||
$flow : susy-get(flow, $span);
|
||||
|
||||
$inside : is-inside($span);
|
||||
$from : from($flow);
|
||||
$line : floor($context / $n);
|
||||
$symmetrical : is-symmetrical($columns);
|
||||
|
||||
$output: (
|
||||
width : null,
|
||||
float : from,
|
||||
margin-before : null,
|
||||
margin-after : null,
|
||||
padding-before : null,
|
||||
padding-after : null,
|
||||
flow : $flow,
|
||||
);
|
||||
|
||||
@if $inside {
|
||||
$gutters: get-gutters($span);
|
||||
$output: map-merge($output, (
|
||||
padding-before: map-get($gutters, before),
|
||||
padding-after: map-get($gutters, after),
|
||||
));
|
||||
}
|
||||
|
||||
@if $symmetrical {
|
||||
$output: map-merge($output, (width: get-span-width($span)));
|
||||
}
|
||||
|
||||
$box : susy-get(box-sizing, $span);
|
||||
$global-box : if(susy-get(global-box-sizing) == 'border-box', true, false);
|
||||
|
||||
@include susy-inspect(gallery, $inspect);
|
||||
|
||||
// Collective Output
|
||||
@if $box == border-box or ($inside and not($box) and not($global-box)) {
|
||||
@include output((box-sizing: border-box));
|
||||
} @else if $box == content-box {
|
||||
@include output((box-sizing: content-box));
|
||||
}
|
||||
|
||||
@include float-span-output($output...);
|
||||
|
||||
// Individual Loop
|
||||
@for $item from 1 through $line {
|
||||
$nth: '#{$line}n + #{$item}';
|
||||
&:nth-#{$selector}(#{$nth}) {
|
||||
// Individual Prep
|
||||
$output: (
|
||||
width : if($symmetrical, null, get-span-width($span)),
|
||||
float : null,
|
||||
margin-before : get-isolation($span),
|
||||
margin-after : -100%,
|
||||
padding-before : null,
|
||||
padding-after : null,
|
||||
flow : $flow,
|
||||
);
|
||||
|
||||
// Individual Output
|
||||
@include float-span-output($output...);
|
||||
|
||||
@if get-edge($span) == first {
|
||||
@include break;
|
||||
@include first($span);
|
||||
} @else {
|
||||
@include nobreak;
|
||||
}
|
||||
|
||||
// Individual Location Increment
|
||||
$location: get-location($span) + $n;
|
||||
$location: if($location > $context, 1, $location);
|
||||
$span: map-merge($span, (location: $location));
|
||||
}
|
||||
}
|
||||
}
|
||||
64
_sass/vendor/susy/susy/language/susy/_grids.scss
vendored
64
_sass/vendor/susy/susy/language/susy/_grids.scss
vendored
@@ -1,64 +0,0 @@
|
||||
// Grid Syntax
|
||||
// ===========
|
||||
|
||||
|
||||
// Layout
|
||||
// ------
|
||||
// Set a new layout using a shorthand
|
||||
// - $layout: <settings>
|
||||
// - $clean: boolean
|
||||
@mixin layout(
|
||||
$layout,
|
||||
$clean: false
|
||||
) {
|
||||
$inspect : $layout;
|
||||
$susy : _get-layout($layout, $clean) !global;
|
||||
|
||||
@include susy-inspect(layout, $inspect);
|
||||
}
|
||||
|
||||
|
||||
// Use Grid
|
||||
// --------
|
||||
// Use an arbitrary layout for a section of code
|
||||
// - $layout: <settings>
|
||||
// - $clean: boolean
|
||||
@mixin with-layout(
|
||||
$layout,
|
||||
$clean: false
|
||||
) {
|
||||
$inspect : $layout;
|
||||
$old : $susy;
|
||||
$susy : _get-layout($layout, $clean) !global;
|
||||
|
||||
@include susy-inspect(with-layout, $inspect);
|
||||
|
||||
@content;
|
||||
|
||||
$susy: $old !global;
|
||||
}
|
||||
|
||||
|
||||
// Layout
|
||||
// ------
|
||||
// Return a parsed layout map based on shorthand syntax
|
||||
// - $layout: <settings>
|
||||
@function layout(
|
||||
$layout: $susy
|
||||
) {
|
||||
@return parse-grid($layout);
|
||||
}
|
||||
|
||||
|
||||
// Get Layout
|
||||
// ----------
|
||||
// Return a new layout based on current and given settings
|
||||
// - $layout: <settings>
|
||||
// - $clean: boolean
|
||||
@function _get-layout(
|
||||
$layout,
|
||||
$clean: false
|
||||
) {
|
||||
$layout: layout($layout);
|
||||
@return if($clean, $layout, _susy-deep-merge($susy, $layout));
|
||||
}
|
||||
154
_sass/vendor/susy/susy/language/susy/_gutters.scss
vendored
154
_sass/vendor/susy/susy/language/susy/_gutters.scss
vendored
@@ -1,154 +0,0 @@
|
||||
// Gutter Syntax
|
||||
// =============
|
||||
|
||||
|
||||
// Gutters
|
||||
// -------
|
||||
// Set gutters on an element.
|
||||
// - [$span] : <settings>
|
||||
@mixin gutters(
|
||||
$span: $susy
|
||||
) {
|
||||
$inspect : $span;
|
||||
$span : parse-gutters($span);
|
||||
$_gutters : get-gutters($span);
|
||||
|
||||
$_output: (
|
||||
before: map-get($_gutters, before),
|
||||
after: map-get($_gutters, after),
|
||||
flow: susy-get(flow, $span),
|
||||
);
|
||||
|
||||
@include susy-inspect(gutters, $inspect);
|
||||
|
||||
@if is-inside($span) {
|
||||
@include padding-output($_output...);
|
||||
} @else {
|
||||
@include margin-output($_output...);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin gutter(
|
||||
$span: $susy
|
||||
) {
|
||||
@include gutters($span);
|
||||
}
|
||||
|
||||
|
||||
// Gutter
|
||||
// ------
|
||||
// Return the width of a gutter.
|
||||
// - [$span] : <settings>
|
||||
@function gutter(
|
||||
$span: $susy
|
||||
) {
|
||||
$span: parse-gutters($span);
|
||||
|
||||
$_gutters: get-gutters($span);
|
||||
$_gutters: map-get($_gutters, before) or map-get($_gutters, after);
|
||||
|
||||
@return $_gutters;
|
||||
}
|
||||
|
||||
@function gutters(
|
||||
$span: $susy
|
||||
) {
|
||||
@return gutter($span);
|
||||
}
|
||||
|
||||
|
||||
// Get Gutter Width
|
||||
// ----------------
|
||||
// Return gutter width.
|
||||
// - [$context]: <context>
|
||||
@function get-gutter-width(
|
||||
$context: $susy
|
||||
) {
|
||||
$context : parse-gutters($context);
|
||||
|
||||
$_gutters : susy-get(gutters, $context);
|
||||
$_gutter : susy-get(gutter-override, $context);
|
||||
|
||||
@if $_gutters and ($_gutters > 0) and not($_gutter) {
|
||||
$_column-width: susy-get(column-width, $context);
|
||||
$_math: gutter-math($context);
|
||||
@if $_math == static {
|
||||
$_gutter: $_gutters * valid-column-math($_math, $_column-width);
|
||||
} @else {
|
||||
$_columns : susy-get(columns, $context);
|
||||
$_spread : if(is-split($context), wide, susy-get(spread, $context));
|
||||
$_gutter : percentage($_gutters / susy-sum($_columns, $_gutters, $_spread));
|
||||
}
|
||||
}
|
||||
|
||||
$_gutter: if($_gutter == 'no-gutters' or $_gutter == 'no-gutter', null, $_gutter);
|
||||
|
||||
@return $_gutter;
|
||||
}
|
||||
|
||||
|
||||
// Get Gutters
|
||||
// -----------
|
||||
// Return before and after gutter values.
|
||||
// - [$context]: <context>
|
||||
@function get-gutters(
|
||||
$context: $susy
|
||||
) {
|
||||
$context : parse-gutters($context);
|
||||
|
||||
$_gutter-position : susy-get(gutter-position, $context);
|
||||
$_gutter : get-gutter-width($context);
|
||||
|
||||
$_return : (before: null, after: null);
|
||||
|
||||
@if is-split($context) and $_gutter {
|
||||
$_gutter: $_gutter / 2;
|
||||
$_return: map-merge($_return, (before: $_gutter, after: $_gutter));
|
||||
} @else {
|
||||
$_return: map-merge($_return, ($_gutter-position: $_gutter));
|
||||
}
|
||||
|
||||
@return $_return;
|
||||
}
|
||||
|
||||
|
||||
// Is Inside
|
||||
// ---------
|
||||
// Returns true if gutters are inside.
|
||||
// $context: <context>
|
||||
@function is-inside(
|
||||
$context
|
||||
) {
|
||||
$_inside: inside inside-static;
|
||||
$_gutter-position: susy-get(gutter-position, $context);
|
||||
|
||||
@return if(index($_inside, $_gutter-position), true, false);
|
||||
}
|
||||
|
||||
|
||||
// Is Split
|
||||
// --------
|
||||
// Returns true if gutters are split.
|
||||
// $context: <context>
|
||||
@function is-split(
|
||||
$context
|
||||
) {
|
||||
$_split: split inside inside-static;
|
||||
$_gutter-position: susy-get(gutter-position, $context);
|
||||
|
||||
@return if(index($_split, $_gutter-position), true, false);
|
||||
}
|
||||
|
||||
|
||||
// Gutter Math
|
||||
// -----------
|
||||
// Return the math to use for gutter calculations
|
||||
// $context: <context>
|
||||
@function gutter-math(
|
||||
$context: $susy
|
||||
) {
|
||||
$_return : susy-get(math, $context);
|
||||
$_return : if(susy-get(gutter-position, $context) == inside-static, static, $_return);
|
||||
|
||||
@return $_return;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user