coolstrap-generator 0.1.0

data/lib/coolstrap-generator/templates/app/assets/stylesheets/coolstrap/structure/utilities/_mixins.scss

@@ -0,0 +1,45 @@
+@mixin setFixedPosition($position: $default-fixed-position, $size: $default-fixed-size) {
+	@if $position == top {
+		width: 100%;
+		height: $size;
+		max-height: $size;
+	}
+	@if $position == bottom {
+		width: 100%;
+		height: $size;
+		max-height: $size;
+	}
+	@else if $position == left {
+		width: $size;
+		max-width: $size;
+		height: 100%;
+	}
+	@else if $position == right {
+		width: $size;
+		max-width: $size;
+		height: 100%;
+	}
+	position: absolute;
+	#{$position}: 0;
+}
+
+@mixin setHeight() {
+	position: absolute;
+	width: 100% !important;
+	height: auto;
+	top: 0px;
+	bottom: 0px;
+}
+
+@mixin setFlexibleBox($orient: $default-box-orient, $align: $default-box-align, $pack: $default-box-pack, $direction: $default-box-direction) {
+	@include display-box;
+	@include box-orient($orient);
+	@include box-align($align);
+	@include box-pack($pack);
+	@include box-direction($direction);
+}
+
+@mixin square($size) {
+	width: $size;
+	height: $size;
+}

data/lib/coolstrap-generator/templates/app/assets/stylesheets/coolstrap/structure/utilities/_reset.scss

@@ -0,0 +1,367 @@
+div {}
+//
+//  HTML5 Boilerplate
+// 
+//  What follows is the result of much research on cross-browser styling.
+//  Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
+//  Kroc Camen, and the H5BP dev community and team.
+// 
+//  Detailed information about this CSS: h5bp.com/css
+// 
+//  ==|== normalize ============================================================
+// 
+
+// =============================================================================
+//   HTML5 display definitions
+// =============================================================================
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+nav,
+section {
+	display: block;
+}
+audio,
+canvas,
+video {
+	display: inline-block;
+	*display: inline;
+	*zoom: 1;
+}
+audio:not([controls]) {
+	display: none;
+}
+[hidden] {
+	display: none;
+}
+
+
+// =============================================================================
+//   Base
+// =============================================================================
+
+// 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
+// 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
+
+html {
+	height: 100%;
+	font-size: 100%;
+	-webkit-text-size-adjust: 100%;
+	-ms-text-size-adjust: 100%;
+}
+
+body {
+	margin: 0;
+	padding: 0;
+	width: 100%;
+	height: 100%;
+  min-height: 100%;
+  overflow: hidden;
+  font-family: Helvetica, Arial, sans-serif;
+	font-size: 13px; 
+	line-height: 1.34em;
+	-webkit-touch-callout: none;
+}
+
+body,
+button,
+input,
+select,
+textarea {
+	font-family: sans-serif;
+	color: #222;
+}
+
+
+
+// =============================================================================
+//   Links
+// =============================================================================
+
+a {
+	/*color: #00e;*/
+	text-decoration: none;	
+	-webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+a:visited { /*color: #551a8b;*/ }
+a:hover { /*color: #06e;*/ }
+a:focus { outline: thin dotted; }
+
+// Improve readability when focused and hovered in all browsers: h5bp.com/h
+a:hover, a:active { outline: 0; }
+
+
+// =============================================================================
+//   Typography
+// =============================================================================
+
+abbr[title] {
+	border-bottom: 1px dotted;
+}
+b, strong {
+	font-weight: bold;
+}
+blockquote {
+	margin: 1em 40px;
+}
+dfn {
+	font-style: italic;
+}
+hr {
+	display: block;
+	height: 1px;
+	border: 0;
+	border-top: 1px solid #ccc;
+	margin: 1em 0;
+	padding: 0;
+}
+ins {
+	background: #ff9;
+	color: #000;
+	text-decoration: none;
+}
+mark {
+	background: #ff0;
+	color: #000;
+	font-style: italic;
+	font-weight: bold;
+}
+
+// Redeclare monospace font family: h5bp.com/j
+pre,
+code,
+kbd,
+samp {
+	font-family: monospace, serif;
+	_font-family: 'courier new', monospace;
+	font-size: 1em;
+}
+
+// Improve readability of pre-formatted text in all browsers
+pre {
+	white-space: pre;
+	white-space: pre-wrap;
+	word-wrap: break-word;
+}
+q {
+	quotes: none;
+	&:before,
+	&:after {
+		content: "";
+		content: none;
+	}
+}
+small {
+	font-size: 85%;
+}
+
+// Position subscript and superscript content without affecting line-height: h5bp.com/k
+sub,
+sup {
+	font-size: 75%;
+	line-height: 0;
+	position: relative;
+	vertical-align: baseline;
+}
+sup {
+	top: -0.5em;
+}
+sub {
+	bottom: -0.25em;
+}
+
+h1, h2, h3, h4, h5, h6 {
+	margin: 0;
+}
+
+
+// =============================================================================
+//   Lists
+// =============================================================================
+
+ul,
+ol {
+	margin: 1em 0;
+	padding: 0 0 0 40px;
+	nav & {
+		list-style: none;
+		list-style-image: none;
+		margin: 0;
+		padding: 0;
+	}
+}
+dd {
+	margin: 0 0 0 40px;
+}
+
+
+// =============================================================================
+//   Embedded content
+// =============================================================================
+
+// 1. Improve image quality when scaled in IE7: h5bp.com/d
+// 2. Remove the gap between images and borders on image containers: h5bp.com/e
+img {
+	border: 0;
+	-ms-interpolation-mode: bicubic;
+	vertical-align: middle;
+	font-size: 0;
+}
+
+// Correct overflow not hidden in IE9
+svg:not(:root) {
+	overflow: hidden;
+}
+
+
+// =============================================================================
+//   Figures
+// =============================================================================
+
+figure {
+	margin: 0;
+}
+
+
+// =============================================================================
+//   Forms
+// =============================================================================
+
+form {
+	margin: 0;
+}
+fieldset {
+	border: 0;
+	margin: 0;
+	padding: 0;
+}
+
+// Indicate that 'label' will shift focus to the associated form element
+label {
+	cursor: pointer;
+}
+
+// 1. Correct color not inheriting in IE6/7/8/9
+// 2. Correct alignment displayed oddly in IE6/7
+legend {
+	border: 0;
+	*margin-left: -7px;
+	padding: 0;
+}
+
+// 1. Correct font-size not inheriting in all browsers
+// 2. Remove margins in FF3/4 S5 Chrome
+// 3. Define consistent vertical alignment display in all browsers
+button,
+input,
+select,
+textarea {
+	font-size: 100%;
+	margin: 0;
+	vertical-align: baseline;
+	*vertical-align: middle;
+	border: 0 none;
+	outline: none;
+}
+
+// 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
+// 2. Correct inner spacing displayed oddly in IE6/7
+button,
+input {
+	line-height: normal;
+	*overflow: visible;
+}
+
+// Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
+table button,
+table input {
+	*overflow: auto;
+}
+
+// 1. Display hand cursor for clickable form elements
+// 2. Allow styling of clickable form elements in iOS
+button,
+input[type="button"],
+input[type="reset"],
+input[type="submit"],
+[role="button"] {
+	cursor: pointer;
+	-webkit-appearance: button;
+}
+
+// Consistent box sizing and appearance
+input[type="checkbox"],
+input[type="radio"] {
+	padding: 0;
+}
+input[type="search"] {
+//	-webkit-appearance: none;
+	-webkit-appearance: textfield;
+//	-webkit-appearance: searchfield;
+}
+input[type="search"]::-webkit-search-decoration {
+	-webkit-appearance: none;
+}
+
+// Remove inner padding and border in FF3/4: h5bp.com/l
+button::-moz-focus-inner {
+	border: 0; padding: 0;
+}
+
+// 1. Remove default vertical scrollbar in IE6/7/8/9
+// 2. Allow only vertical resizing
+textarea {
+	overflow: auto;
+	vertical-align: top;
+	resize: vertical;
+}
+
+// Colors for form validity
+input,
+textarea {
+	&:valid {}
+	&:invalid {
+		background-color: #f0dddd;
+	}
+}
+
+
+// =============================================================================
+//   Tables
+// =============================================================================
+
+table {
+	border-collapse: collapse;
+	border-spacing: 0;
+}
+td {
+	vertical-align: top;
+}
+
+* {
+	@include box-sizing(border-box);
+	-webkit-font-smoothing: antialiased;
+	-moz-font-smoothing: antialiased;
+	-webkit-tap-highlight-color: transparent;
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-o-user-select: none;
+	user-select: none;
+}
+input:not([type="checkbox"]),
+textarea, select {
+	-webkit-user-select: text;
+	-khtml-user-select: text;
+	-moz-user-select: text;
+	-o-user-select: text;
+	user-select: text;
+}
+

data/lib/coolstrap-generator/templates/app/assets/stylesheets/coolstrap/structure/utilities/_variables.scss

@@ -0,0 +1,176 @@
+$isNormal:       ':not([data-type])';
+
+
+$isMain:         '[role="main"]';
+
+// Dialog model
+$isDialog:       '[role="dialog"]';
+$isAction:       '[data-type="action"]';
+$isAlert:        '[data-type="alert"]';
+$isPopover:      '[data-type="popover"]';
+$isModal:        '[data-type="modal"]';
+$isNotModal:     ':not([data-type="modal"])';
+
+
+$isTooltip:      '[role="tooltip"]';
+
+// Popup section
+$isPopup:        '[data-type="popup"]';
+$isNotPopup:     ':not([data-type="popup"])';
+
+// Header
+$isVertical:     '[data-type="vertical"]';
+$isNotVertical:  ':not([data-type="vertical"])';
+$isNotExtended:  ':not([data-type="extended"])';
+
+// Nav & Footer
+$isToolbar:      '[data-type="toolbar"]';
+$isNotToolbar:   ':not([data-type="toolbar"])';
+
+$isTabbar:       '[data-type="tabbar"]';
+$isNotTabbar:    ':not([data-type="tabbar"])';
+
+// Positions
+$isOnTop:        '.onTop';
+$isOnBottom:     '.onBottom';
+$isOnLeft:       '.onLeft';
+$isOnRight:      '.onRight';
+
+// Alignment
+$alignTopLeft:   '.onTop';
+$isOnBottom:     '.onBottom';
+$isOnLeft:       '.onLeft';
+$isOnRight:      '.onRight';
+
+// Fixed positions
+$default-fixed-position: false !default;
+$default-fixed-size: 100% !default;
+
+ 
+// Layers positions
+$default-layer-dialog: 600 !default;
+$default-layer-overalay: 500 !default;
+$default-layer-popup: 400 !default;
+$default-layer-front: 300 !default;
+$default-layer-overalay-inner: 200 !default;
+$default-layer-current: 100 !default;
+$default-layer-back: 0 !default;
+
+// Transition for aside
+$default-transition-type: false !default;
+$default-transform-distance: 0 !default;
+
+
+// Header
+$default-header-size: 44px !default;
+$default-header-button: 30px !default;
+$default-header-icon: 20px !default;
+
+// Landscape Header
+$default-header-landscape-size: 32px !default;
+$default-header-landscape-button: 24px !default;
+
+// Vertical Header
+$default-header-vertical-size: 50px !default;
+$default-header-vertical-button: 40px !default;
+$default-header-vertical-spacing: 5px !default;
+$default-header-vertical-icon: 30px !default;
+
+
+// Nav, Footer and Toolbar
+$default-navbar-size: 44px !default;
+$default-navbar-button: 30px !default;
+$default-navbar-icon: 16px !default;
+
+
+// Tabbar
+$default-tabbar-size: 60px !default;
+$default-tabbar-spacing: 5px !default;
+$default-tabbar-icon: 26px !default;
+
+
+// Aside
+$default-aside-left-size: 276px !default;
+$default-aside-right-size: 276px !default;
+$default-aside-top-size: 99px !default;
+$default-aside-bottom-size: 300px !default;
+
+
+
+// Global Dialog
+$default-dialog-maxheight: 400px !default;
+$default-dialog-maxwidth: 300px !default;
+
+// Action Sheet Dialog
+$default-action-spacing: 20px !default;
+$default-action-button: 40px !default;
+
+// Alert Dialog
+$default-alert-size: 280px !default;
+$default-alert-spacing: 10px !default;
+$default-alert-button: 30px !default;
+
+// Modal Dialog
+$default-modal-spacing: 20px !default;
+
+// Popover Dialog
+$default-popover-arrow: 10px !default;
+$default-popover-border: 4px !default;
+
+
+
+
+
+
+$default-interface-spacing: 7px !default;
+$default-content-spacing: 10px !default;
+
+
+
+
+
+// Listview
+$default-listview-spacing: 10px !default;
+
+
+// Badges
+$default-badge-spacing: 3px 5px !default;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+// Compass Animation
+$default-transition-property : transform;
+$default-transition-duration : 250ms;
+$default-transition-function : ease-out;
+$default-transition-delay    : false;
+
+// Compass box
+// Box orientation [ horizontal | vertical | inline-axis | block-axis | inherit ]
+// Box align [ start | end | center | baseline | stretch ]
+// box pack [ start | end | center | justify ]
+// box-direction [ normal | reverse | inherit ]
+$default-box-flex      : 1;
+$default-box-orient    : horizontal;
+$default-box-align     : center;
+$default-box-pack      : center;
+$default-box-direction : normal;
+
+
+
+
+
+
+
+
+