-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathsettings.responsive.html
8 lines (8 loc) · 4.86 KB
/
settings.responsive.html
1
2
3
4
5
6
7
8
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><link href="http://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" type="text/css"><link href="http://fonts.googleapis.com/css?family=Bitter:400,700" rel="stylesheet" type="text/css"><link href="http://fonts.googleapis.com/css?family=Inconsolata:400,700" rel="stylesheet" type="text/css"><title>inuit kitchen sink | _settings.responsive.scss</title><meta name="description" content="inuit kitchen sink lists you all modules of inuitcss and helps you getting started with the framework."><meta name="viewport" content="width=device-width,minimum-scale=1"><link rel="stylesheet" href="build/assets/css/style.css"><link rel="shortcut icon" href="src/assets/img/favicon.png" type="image/png"></head><body><header class="[ page-head ] [ pv- mb ]"><div class="[ page-wrap ] [ clearfix ]"><h6 class="[ float--left ] [ mb0 ]"><a class="site-logo" href="index.html">inuit kitchen sink</a></h6><a class="[ site-nav-trigger ] [ float--right ]" href="#site-nav"></a></div></header><div class="page-wrap"><div class="[ layout layout--rev ]"><div class="[ layout__item 8/12 portable-1/1 ] [ mb++ ]"><h1 class="mb0">_settings.responsive.scss</h1><div class="mb"><a class="zeta" href="https://github.com/inuitcss/settings.responsive/blob/master/_settings.responsive.scss">View source</a><br></div><p>This module defines the projects breakpoints for later use in the <a href="tools.responsive.html">media-query mixin</a>, the <a href="trumps.widths-responsive.html">responsive widths</a> and the <a href="trumps.spacing-responsive.html">responsive spacings</a>.</p><pre><code>$breakpoints: (
"palm" "screen and (max-width: 44.9375em)",
"lap" "screen and (min-width: 45em) and (max-width: 63.9375em)",
"lap-and-up" "screen and (min-width: 45em)",
"portable" "screen and (max-width: 63.9375em)",
"desk" "screen and (min-width: 64em)",
"retina" "(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)"
) !default;</code></pre><p>You can change these values to your needs and add more to the list if you lack any breakpoint by copying this whole list into your css and add your changes.</p><ul class="[ tabs ] [ ui-tabs ] [ mt+ ]"><li class="tabs__item"><a class="tabs__link" href="settings.default.html" title="settings.default">prev</a></li><li class="tabs__item"><a class="tabs__link" href="tools.functions.html" title="tools.functions">next</a></li></ul></div><div class="[ layout__item 4/12 portable-1/1 ]"><nav role="navigation"><ul id="site-nav" class="[ site-nav ] [ list-bare ] [ portable-p- ]"><li><p class="[ gamma ] [ weight--700 ] [ mb0 ]">settings</p><ul class="[ site-nav__sub ] [ list-bare ] [ mb ]"><li><a href="settings.default.html">default</a></li><li><a href="settings.responsive.html">responsive</a></li></ul></li><li><p class="[ gamma ] [ weight--700 ] [ mb0 ]">tools</p><ul class="[ site-nav__sub ] [ list-bare ] [ mb ]"><li><a href="tools.functions.html">functions</a></li><li><a href="tools.mixins.html">mixins</a></li><li><a href="tools.responsive.html">responsive</a></li></ul></li><li><p class="[ gamma ] [ weight--700 ] [ mb0 ]">base</p><ul class="[ site-nav__sub ] [ list-bare ] [ mb ]"><li><a href="base.headings.html">headings</a></li><li><a href="base.paragraphs.html">paragraphs</a></li></ul></li><li><p class="[ gamma ] [ weight--700 ] [ mb0 ]">objects</p><ul class="[ site-nav__sub ] [ list-bare ] [ mb ]"><li><a href="objects.media.html">media</a></li><li><a href="objects.flag.html">flag</a></li><li><a href="objects.block.html">block</a></li><li><a href="objects.pack.html">pack</a></li><li><a href="objects.box.html">box</a></li><li><a href="objects.list-bare.html">list-bare</a></li><li><a href="objects.list-inline.html">list-inline</a></li><li><a href="objects.list-block.html">list-block</a></li><li><a href="objects.list-ui.html">list-ui</a></li><li><a href="objects.tabs.html">tabs</a></li><li><a href="objects.buttons.html">buttons</a></li><li><a href="objects.tables.html">tables</a></li><li><a href="objects.layout.html">layout</a></li></ul></li><li><p class="[ gamma ] [ weight--700 ] [ mb0 ]">trumps</p><ul class="[ site-nav__sub ] [ list-bare ] [ mb ]"><li><a href="trumps.headings.html">headings</a></li><li><a href="trumps.spacing.html">spacing</a></li><li><a href="trumps.spacing-responsive.html">spacing-responsive</a></li><li><a href="trumps.widths.html">widths</a></li><li><a href="trumps.widths-responsive.html">widths-responsive</a></li><li><a href="trumps.clearfix.html">clearfix</a></li></ul></li></ul></nav></div></div></div><footer class="[ page-foot ] [ pv+ ]"><ul class="[ list-inline ] [ page-wrap ]"><li><a href="https://github.com/csshugs/inuit-kitchen-sink">Contribute on GitHub</a></li></ul></footer></body></html>