material-sass 0.0.1

data/app/assets/stylesheets/material/_mixin.scss

@@ -0,0 +1,4 @@
+@import "mixin/css3";
+@import "mixin/grid";
+@import "mixin/responsive";
+@import "mixin/utilitise";

data/app/assets/stylesheets/material/_reset.scss

@@ -0,0 +1,403 @@
+@import url(//fonts.googleapis.com/css?family=Roboto:300,400,400italic,700);
+
+*,
+*:after,
+*:before {
+	@include box-sizing(border-box);
+}
+
+@-webkit-viewport {
+	width: device-width;
+}
+@-moz-viewport {
+	width: device-width;
+}
+@-ms-viewport {
+	width: device-width;
+}
+@-o-viewport {
+	width: device-width;
+}
+@viewport {
+	width: device-width;
+}
+
+// basic
+	article,
+	aside,
+	footer,
+	header,
+	nav,
+	section {
+		display: block;
+	}
+
+	audio {
+		display: inline-block;
+		max-width: 100%;
+		vertical-align: baseline;
+	}
+
+	body {
+		background-color: $white-bg-light;
+		background-image: none;
+		color: $black-text;
+		font-family: $font-fam;
+		font-size: $font-size;
+		font-weight: 400;
+		line-height: $line-height;
+		margin: 0;
+		padding: 0;
+	}
+
+	html {
+		font-family: sans-serif;
+		font-size: 100%;
+		min-height: 100%;
+		position: relative;
+		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+		-webkit-text-size-adjust: 100%;
+		    -ms-text-size-adjust: 100%;
+	}
+
+	svg:not(:root) {
+		overflow: hidden;
+	}
+
+	template,
+	[hidden] {
+		display: none;
+	}
+
+	video {
+		display: block;
+		max-width: 100%;
+	}
+
+// form
+	button,
+	input,
+	optgroup,
+	select,
+	textarea {
+		color: inherit;
+		font: inherit;
+		margin: 0;
+	}
+
+	button,
+	input[type="button"],
+	input[type="reset"],
+	input[type="submit"] {
+		cursor: pointer;
+		-webkit-appearance: button;
+	}
+
+	button,
+	select {
+		text-transform: none;
+	}
+
+	button {
+		overflow: visible;
+	}
+
+	button[disabled],
+	input[disabled] {
+		cursor: default;
+	}
+
+	button::-moz-focus-inner,
+	input::-moz-focus-inner {
+		border: 0;
+		padding: 0;
+	}
+
+	fieldset {
+		border: 0;
+		margin: 0;
+		min-width: 0;
+		padding: 0;
+		& ~ fieldset {
+			margin-top: $line-height;
+		}
+	}
+
+	input {
+		line-height: normal;
+	}
+
+	input[type="checkbox"],
+	input[type="radio"] {
+		line-height: normal;
+		margin: 4px 0 0;
+		margin-top: 1px \9;
+		padding: 0;
+	}
+
+	input[type="color"] {
+		min-width: $line-height;
+		width: auto;
+	}
+
+	input[type="date"],
+	input[type="datetime-local"],
+	input[type="month"],
+	input[type="time"] {
+		line-height: $line-height;
+		line-height: 1 #{\0};
+	}
+
+	input[type="file"] {
+		display: block;
+		height: auto;
+		line-height: 1;
+		min-height: $input-height;
+		padding-top: (($input-height - $line-height) / 2);
+		padding-bottom: (($input-height - $line-height) / 2);
+	}
+
+	input[type="number"]::-webkit-inner-spin-button,
+	input[type="number"]::-webkit-outer-spin-button {
+		height: auto;
+	}
+
+	input[type="range"] {
+		display: block;
+		height: $input-height;
+		width: 100%;
+	}
+
+	input[type="search"] {
+		-webkit-appearance: none;
+		@include box-sizing(border-box);
+	}
+
+	input[type="search"]::-webkit-search-cancel-button,
+	input[type="search"]::-webkit-search-decoration {
+		-webkit-appearance: none;
+	}
+
+	label {
+		display: inline-block;
+		font-weight: 400;
+		margin: 0;
+		max-width: 100%;
+	}
+
+	legend {
+		border: 0;
+		color: $black-text;
+		display: block;
+		font-size: $font-size-h3;
+		font-weight: 400;
+		line-height: $line-height-h3;
+		margin: 0;
+		padding: 0;
+	}
+
+	optgroup {
+		font-weight: 700;
+	}
+
+	select[multiple],
+	select[size] {
+		height: auto;
+	}
+
+	textarea {
+		overflow: auto;
+	}
+
+// heading
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6,
+	.h1,
+	.h2,
+	.h3,
+	.h4,
+	.h5,
+	.h6 {
+		color: inherit;
+		font-family: $font-fam;
+		font-weight: 700;
+		margin-top: ($line-height * 2);
+		margin-bottom: $line-height;
+	}
+
+	h1,
+	.h1 {
+		font-size: $font-size-h1;
+		line-height: $line-height-h1;
+	}
+
+	h2,
+	.h2 {
+		font-size: $font-size-h2;
+		line-height: $line-height-h2;
+	}
+
+	h3,
+	.h3 {
+		font-size: $font-size-h3;
+		line-height: $line-height-h3;
+	}
+
+	h4,
+	.h4 {
+		font-size: $font-size-h4;
+		line-height: $line-height-h4;
+	}
+
+	h5,
+	.h5 {
+		font-size: $font-size-h5;
+		line-height: $line-height-h5;
+	}
+
+	h6,
+	.h6 {
+		font-size: $font-size-h6;
+		line-height: $line-height-h6;
+	}
+
+	h1,
+	h2,
+	h3,
+	h4,
+	.h1,
+	.h2,
+	.h3,
+	.h4 {
+		small {
+			font-size: $font-size;
+			font-weight: 400;
+		}
+	}
+
+// hr
+	hr,
+	.hr {
+		border: 0;
+		border-top: 1px solid $black-hint;
+		display: block;
+		height: 0;
+		margin-top: $line-height;
+		margin-bottom: $line-height;
+		@include box-sizing(content-box);
+	}
+
+// image
+	img {
+		border: 0;
+		vertical-align: middle;
+	}
+
+// link
+	a {
+		background-color: transparent;
+		background-image: none;
+		color: $link-color;
+		text-decoration: none;
+		&:focus,
+		&:hover {
+			color: $link-color-hover;
+			outline: 0;
+			text-decoration: underline;
+		}
+	}
+
+// list
+	dd,
+	dt,
+	li {
+		line-height: $line-height;
+	}
+
+	dd {
+		margin: 0;
+	}
+
+	dl {
+		margin: $line-height 0;
+	}
+
+	dt {
+		font-weight: 700;
+	}
+
+	ol,
+	ul {
+		margin: $line-height 0;
+		padding: 0 0 0 ($grid-gutter * 2);
+		ol,
+		ul {
+			margin-top: 0;
+			margin-bottom: 0;
+		}
+	}
+
+// table
+	table {
+		border-collapse: collapse;
+		border-spacing: 0;
+	}
+
+	td,
+	th {
+		padding: 0;
+	}
+
+	th {
+		text-align: left;
+	}
+
+// text
+	abbr {
+		border-bottom: 1px dotted $black-hint;
+		cursor: help;
+	}
+
+	address {
+		font-size: $font-size;
+		font-style: normal;
+		font-weight: 400;
+		line-height: $line-height;
+		margin: $line-height 0;
+	}
+
+	b,
+	strong {
+		font-weight: 700;
+	}
+
+	p {
+		margin: $line-height 0;
+	}
+
+	small {
+		font-size: 75%;
+		line-height: 1;
+	}
+
+	sub,
+	sup {
+		font-size: 80%;
+		line-height: 0;
+		position: relative;
+		vertical-align: baseline;
+	}
+
+	sub {
+		// position
+			bottom: -0.25em;
+	}
+	
+	sup {
+		// position
+			top: -0.5em;
+	}

data/app/assets/stylesheets/material/_theme.scss

@@ -0,0 +1,4 @@
+@import "theme/content";
+@import "theme/footer";
+@import "theme/header";
+@import "theme/menu";

data/app/assets/stylesheets/material/_utilitise.scss

@@ -0,0 +1,252 @@
+.a {
+	background-color: transparent;
+	border: 0;
+	display: inline;
+	color: $link-color;
+	-webkit-appearance: none;
+	&:focus,
+	&:hover {
+		color: $link-color-hover;
+		outline: 0;
+		text-decoration: underline;
+	}
+}
+
+.access-hide {
+	border: 0;
+	clip: rect(0, 0, 0, 0);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+	&.focusable {
+		&:active,
+		&:focus {
+			clip: auto;
+			height: auto;
+			margin: 0;
+			overflow: visible;
+			position: static;
+			width: auto;
+		}
+	}
+}
+
+.clearfix {
+	@include clearfix();
+}
+
+.collapse {
+	display: none;
+	&.in {
+		display: block;
+	}
+}
+
+.collapsed-hide {
+	display: inline;
+	.collapsed & {
+		display: none;
+	}
+}
+
+.collapsed-show {
+	display: none;
+	.collapsed & {
+		display: inline;
+	}
+}
+
+.collapsible-region {
+	overflow: hidden;
+}
+
+.collapsing {
+	height: 0;
+	overflow: hidden;
+	position: relative;
+	@include transition(height 0.3s $timing);
+}
+
+.fade {
+		@include opacity(0);
+		@include transition(opacity 0.3s $timing);
+	&.in {
+		@include opacity(1);
+	}
+}
+
+.img-responsive {
+	@include img-responsive();
+}
+
+.list-clear {
+	list-style: none;
+	padding-left: 0;
+}
+
+.list-inline {
+	@extend .list-clear;
+	margin-left: ($grid-gutter / -2);
+	> li {
+		display: inline-block;
+		padding-right: ($grid-gutter / 2);
+		padding-left: ($grid-gutter / 2);
+	}
+}
+
+.margin-bottom {
+	margin-bottom: $line-height !important;
+}
+
+.margin-bottom-half {
+	margin-bottom: ($line-height / 2) !important;
+}
+
+.margin-left {
+	margin-left: $grid-gutter !important;
+}
+
+.margin-left-half {
+	margin-left: ($grid-gutter / 2) !important;
+}
+
+.margin-no {
+	margin: 0 !important;
+}
+
+.margin-no-bottom {
+	margin-bottom: 0 !important;
+}
+
+.margin-no-left {
+	margin-left: 0  !important;
+}
+
+.margin-no-right {
+	margin-right: 0 !important;
+}
+
+.margin-no-top {
+	margin-top: 0 !important;
+}
+
+.margin-right {
+	margin-right: $grid-gutter !important;
+}
+
+.margin-right-half {
+	margin-right: ($grid-gutter / 2) !important;
+}
+
+.margin-top {
+	margin-top: $line-height !important;
+}
+
+.margin-top-half {
+	margin-top: ($line-height / 2) !important;
+}
+
+.media,
+.media-inner {
+	overflow: hidden;
+}
+
+.media-object {
+	&.pull-left {
+		margin-right: $grid-gutter;
+	}
+	&.pull-right {
+		margin-left: $grid-gutter;
+	}
+}
+
+.no-overflow {
+	overflow: hidden;
+}
+
+.p {
+	display: block;
+	margin-top: $line-height;
+	margin-bottom: $line-height;
+}
+
+.pull-left {
+	float: left;
+}
+
+.pull-right {
+	float: right;
+}
+
+.scrollbar-measure {
+	height: 50px;
+	overflow: scroll;
+	position: absolute;
+		top: -99999px;
+	width: 50px;
+}
+
+.text-overflow {
+	@include text-overflow();
+}
+
+.text-nowrap {
+	white-space: nowrap;
+}
+
+// text alignment
+	.text-center {
+		text-align: center;
+	}
+
+	.text-left {
+		text-align: left;
+	}
+
+	.text-right {
+		text-align: right;
+	}
+
+// text color
+	.text-alt {
+		color: $brand-color;
+	}
+
+	.text-black {
+		color: $black-text;
+	}
+
+	.text-blue {
+		color: $palette-blue;
+	}
+
+	.text-green {
+		color: $palette-green;
+	}
+
+	.text-hint {
+		color: $black-hint;
+	}
+
+	.text-purple {
+		color: $palette-purple;
+	}
+
+	.text-red {
+		color: $palette-red;
+	}
+
+	.text-sec {
+		color: $black-sec;
+	}
+
+	.text-yellow {
+		color: $palette-yellow;
+	}
+
+	.text-white {
+		color: $white;
+	}