Sassifaction 0.0.2 → 0.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: c8dacde90e086a2d30b26efd0cd441f4537fd32a
-  data.tar.gz: eef3e3b5711ddd190623415a643c09d63fb1ae65
+  metadata.gz: 8da85ec12c89210378102cdacb5e2914dd8e4c83
+  data.tar.gz: d68ab670cac05b89ebd2f8c6125e843bbe0994cc
 SHA512:
-  metadata.gz: 6c324e2abab7e41003c58a3874f61f7b4b9a2801ab8dec1ce8866c069bafff424cf60a5eca5d3f90f5506fe5daf41abb7e9b8bd4483cf29906a0c272fba2db72
-  data.tar.gz: 16aa1bb490c234d334619f3b14792ee7408b1956e8187d1746951a2c584e1dedc1948e33353d26327e06c4d7a41a2a9dbe194e3e1ba609cc0d9ec5e1785f58b8
+  metadata.gz: 37a5b40fcba1c2fe2a2e291ed6d088d345f00220243391e0bee8b8a32a29e3e332381173e3174fd1706d06cd8c0046e94a26643294e9f3595051b31a01a99b64
+  data.tar.gz: 619806022526b1645e0cbef49c572b69724624279a577b5909841bf8306cacde2b94b6b1706506defac1edfef66b0cba07cf974defc654e15a0921a4fb9b6bfe

data/lib/Sassifaction.rb

@@ -0,0 +1,6 @@
+require 'compass'
+extension_path = File.expand_path(File.join(File.dirname(__FILE__), ".."))
+# stylesheets_dir = File.join(base_directory, 'my', 'stylesheets')
+
+Compass::Frameworks.register('stipe', :stylesheets_directory => File.join(extension_path, 'sass'), :path => extension_path)
+

data/sass/_Sassifaction.scss

@@ -0,0 +1 @@
+@import 'styles';

data/sass/_variables.scss

@@ -0,0 +1,91 @@
+// -------------------------------------
+//    variables
+// -------------------------------------
+
+
+
+// -- max-page-width -------------------
+
+	@mixin page-width{
+		max-width: 1200px;
+		margin: 0 auto;
+	}
+
+// -- document font declarations -------
+
+	$doc-font-size: 16;
+	$doc-line-height: 24;
+
+// -- branding -------------------------
+
+	$base-color: orange;
+	$comp-color: green;
+	$tertiary-color: red;
+	$alt-1: #777777;
+	$alt-2: #CCCCCC;
+	$white: #FFFFFF;
+	$black: #000000;
+
+// -- typography -----------------------
+
+	$body-font: Georgia, serif;
+	$header-font: $body-font;
+
+// -- links ----------------------------
+
+	$link-color: red;
+	$link-color-hover: darken($link-color, 10);
+	$link-color-visited: $link-color-hover;
+	$link-color-focus: darken($link-color-hover, 10);
+
+// -- errors & info --------------------
+
+	$success-color: #5CB85C;
+	$info-color: #5BC0DE;
+	$warning-color: #F0AD4E;
+	$danger-color: #D9534F;
+
+// -- labels, copy-classes, alerts -----
+
+	$default-color: #999999;
+	$muted-color: #F3F3F3;
+	$primary-color: #428BCA;
+
+// --- selection colours ---------------
+
+	$selection: $link-color;
+	$selection-text: #FFF;
+
+// -- button colors --------------------
+
+	$button-color: $white;
+	$button-bg-color: $base-color;
+
+// -- Border Radius --------------------
+
+	$radius-sml: 4px;
+	$radius-med: 8px;
+	$radius-lrg: 12px;
+
+// -- Media Queries --------------------
+
+$tiny           :  320;
+$smaller        :  480;
+$small          :  600;
+$medium         :  760;
+$regular        :  900;
+$large          : 1100;
+$extra-large    : 1300;
+
+// -- flow -----------------------------
+
+
+
+
+
+
+
+
+
+
+

data/sass/base/_bizarro.scss

@@ -0,0 +1,248 @@
+// -------------------------------------
+//   El Captain Bizarro CSS Reset
+// -------------------------------------
+
+html {
+    font-size: $doc-font-size+px;
+    -webkit-text-size-adjust: 100%;
+    -ms-text-size-adjust: 100%;
+}
+
+@-webkit-viewport { width : device-width; }
+@-moz-viewport { width : device-width; }
+@-ms-viewport { width : device-width; }
+@-o-viewport { width : device-width; }
+@viewport { width : device-width; }
+
+*, *:before, *:after {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+article, aside, details, figcaption, figure, footer, header, main, nav, section, summary {
+    display: block;
+}
+
+audio, canvas, video {
+    display: inline-block;
+    *display: inline;
+    *zoom: 1;
+}
+
+audio:not([controls]) {
+    display: none;
+    height: 0;
+}
+
+[hidden] {
+    display: none;
+}
+
+html, button, input, select, textarea {
+    font-family: sans-serif;
+}
+
+body {
+    margin: 0;
+}
+
+// -------------------------------------
+//   Links
+// -------------------------------------
+
+a:focus {
+    outline: thin dotted;
+}
+
+a:active,
+a:hover {
+    outline: 0;
+}
+
+// -------------------------------------
+//   Typography
+// -------------------------------------
+
+ul, ol, dd, menu, dl, figure, pre, table, fieldset, legend, hr,
+h1, h2, h3, h4, h5, h6, p, a
+{ margin: 0; padding: 0; }
+
+b, strong {
+    font-weight: bold;
+}
+
+pre {
+    white-space: pre;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+}
+
+q {
+    quotes: none;
+}
+
+q:before, q:after {
+    content: '';
+    content: none;
+}
+
+sub, sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+}
+sup {
+    top: -0.5em;
+}
+sub {
+    bottom: -0.25em;
+}
+
+// -------------------------------------
+//   lists
+// -------------------------------------
+
+nav ul, nav ol {
+    list-style: none;
+    list-style-image: none;
+}
+
+
+li{
+    > ul,
+    > ol{
+         margin-bottom:0;
+     }
+}
+
+// -------------------------------------
+//   embedded content
+// -------------------------------------
+
+img {
+    border: 0;
+    -ms-interpolation-mode: bicubic;
+    max-width: 100%;
+    min-height: auto;
+    vertical-align: middle;
+}
+
+svg:not(:root) {
+    overflow: hidden;
+}
+
+// -------------------------------------
+//   figure
+// -------------------------------------
+
+figure {
+    margin: 0;
+}
+
+figure > img{
+    display:block;
+}
+
+// -------------------------------------
+//   forms
+// -------------------------------------
+
+form {
+    margin: 0;
+}
+
+fieldset {
+    border: 1px solid #c0c0c0;
+    margin: 0 2px;
+    padding: 0.35em 0.625em 0.75em;
+}
+
+legend {
+border: 0;
+padding: 0;
+white-space: normal;
+*margin-left: -7px;
+}
+
+button,
+input,
+select,
+textarea {
+font-size: 100%;
+margin: 0;
+vertical-align: baseline;
+*vertical-align: middle;
+}
+
+button,
+input {
+    line-height: normal;
+}
+
+button,
+html input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+-webkit-appearance: button;
+cursor: pointer;
+*overflow: visible;
+}
+
+button[disabled],
+input[disabled] {
+    cursor: default;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+box-sizing: border-box;
+padding: 0;
+*height: 13px;
+*width: 13px;
+}
+
+input[type="search"] {
+-webkit-appearance: textfield;
+-moz-box-sizing: content-box;
+-webkit-box-sizing: content-box;
+box-sizing: content-box;
+}
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+    -webkit-appearance: none;
+}
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+    border: 0;
+    padding: 0;
+}
+
+textarea {
+    overflow: auto;
+    vertical-align: top;
+    resize: vertical;
+}
+
+// -------------------------------------
+//   tables
+// -------------------------------------
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+// -------------------------------------
+//   'other'
+// -------------------------------------
+
+.chromeframe {
+    background: #ccc;
+    color: #000;
+    margin: 0.2em 0;
+    padding: 0.2em 0;
+}

data/sass/base/_debug.scss

@@ -0,0 +1,170 @@
+// via inuit.css - https://github.com/csswizardry/inuit.css
+
+@if $debugMode == true{
+/*------------------------------------*\
+    $DEBUG
+\*------------------------------------*/
+/**
+ * Enable this stylesheet to visually detect any improperly nested or
+ * potentially invalid markup, or any potentially inaccessible code.
+ * 
+ * Red          ==      definite error
+ * Yellow       ==      double-check
+ * None         ==      should be fine
+ * 
+ * Please note that this method of checking markup quality should not be relied
+ * upon entirely. Validate your markup!
+ */
+
+
+/**
+ * Are there any empty elements in your page?
+ */
+:empty{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * Images require `alt` attributes, empty `alt`s are fine but should be
+ * double-checked, no `alt` is bad and is flagged red.
+ */
+img{
+    outline:5px solid red;
+}
+img[alt]{
+    outline:none;
+}
+img[alt=""]{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * Links sometimes, though not always, benefit from `title` attributes. Links
+ * without are never invalid but it’s a good idea to check.
+ */
+a{
+    outline:5px solid yellow;
+}
+a[title]{
+    outline:none;
+}
+
+
+/**
+ * Double-check any links whose `href` is something questionable.
+ */
+a[href="#"],
+a[href*="javascript"]{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * The `target` attribute ain’t too nice...
+ */
+a[target]{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * Ensure any lists only contain `li`s as children.
+ */
+ul,
+ol{
+    > *:not(li){
+        outline:5px solid red;
+    }
+}
+
+
+/**
+ * It’s always nice to give `th`s `scope` attributes.
+ */
+th{
+    outline:5px solid yellow;
+}
+th[scope]{
+    outline:none;
+}
+
+
+/**
+ * `tr`s as children of `table`s ain’t great, did you need a `thead`/`tbody`?
+ */
+table > tr{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * `tfoot` needs to come *before* `tbody`.
+ */
+tbody + tfoot{
+    outline:5px solid yellow;
+}
+
+
+/**
+ * Forms require `action` attributes
+ */
+form{
+    outline:5px solid red;
+}
+form[action]{
+    outline:none;
+}
+
+
+/**
+ * Various form-field types have required attributes. `input`s need `type`
+ * attributes, `textarea`s need `rows` and `cols` attributes and submit buttons
+ * need a `value` attribute.
+ */
+textarea,
+input{
+    outline:5px solid red;
+}
+input[type]{
+    outline:none;
+}
+textarea[rows][cols]{
+    outline:none;
+}
+input[type=submit]{
+    outline:5px solid red;
+}
+input[type=submit][value]{
+    outline:none;
+}
+
+
+/**
+ * Avoid inline styles where possible.
+ */
+[style]{
+	outline:5px solid yellow;
+}
+
+
+/**
+ * You should avoid using IDs for CSS, is this doing any styling?
+ */
+[id]{
+	outline:5px solid yellow;
+}
+
+
+/**
+ * Are you using the grid system correctly?
+ */
+.gw > :not(.g),
+.grid-wrapper > :not(.grid),
+.gw--rev > :not(.g),
+.grid-wrapper--rev > :not(.grid){
+	outline:5px solid red;
+}
+
+}/* endif */