yamlcss 1.0.0

data/yaml/sass/yaml-sass/mixins/_yaml-mixins-core.scss

@@ -0,0 +1,248 @@
+//
+// CSS3 Mixins
+//
+
+// BOX SIZING
+@mixin ym-box-sizing($type: border-box) {
+	-webkit-box-sizing:	$type;
+	-moz-box-sizing:	$type;
+	box-sizing:			$type;
+}
+
+// BOX SHADOW
+@mixin ym-box-shadow($x: 1px, $y: 1px, $blur: 5px, $color: rgba(0,0,0,.5), $inset: false) {
+
+	@if $inset{
+	-webkit-box-shadow: inset $x $y $blur $color;
+			box-shadow: inset $x $y $blur $color;
+	}
+	@else {
+	-webkit-box-shadow: $x $y $blur $color;
+			box-shadow: $x $y $blur $color;
+	}
+}
+
+// Linear Gradient with two colors for modern browsers without the corresponding IE-filter
+
+// $direction ==> written in the standard-way: to bottom, to left ...
+// $solid-color ==> replacement color for the one device that cannot show gradients or IE-filters
+// $start-color ==> which color to start with
+// $end-color ==> which color to end with
+
+// $output ==> defines the output-type of the code
+	// css3   ==> only CSS3-gradients
+	// oldie  ==> only IE-filters for oldIE (versions before 9)
+	// both   ==> both CSS3 and oldIE versions are printed
+
+// $fallback ==> fallback color code for browsers that don't support gradients (oldIE)
+
+// As there is a default direction there is no use for a fourth if-case.
+
+@mixin ym-linear-gradient($direction: "to bottom", $start-color: #eee, $end-color: #ccc, $output: both, $fallback: $start-color) {
+	$old-direction: top;
+	$very-old-direction:"left top, left bottom";
+	$ie-direction: 0;
+
+	@if $direction == "to right" {
+		$very-old-direction: "left top, right top";
+		$old-direction: left;
+		$ie-direction: 1;
+	}
+
+	@if $output != "oldie" {
+		background-image: -webkit-gradient(linear, #{$very-old-direction}, color-stop(0%,$start-color), color-stop(100%,$end-color));
+		background-image:  -webkit-linear-gradient($old-direction, $start-color,$end-color);
+		background-image: 	-moz-linear-gradient($old-direction, $start-color,$end-color);
+		background-image: 	 -ms-linear-gradient($old-direction, $start-color,$end-color);
+		background-image:    		 unquote("linear-gradient(#{$direction}, #{$start-color},#{$end-color})");
+	}
+
+	@if $output != "css3" {
+		background-color: $fallback;
+		$iecolor1: ie-hex-str($start-color);
+		$iecolor2: ie-hex-str($end-color);
+		filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=#{$ie-direction}, startColorstr='#{$iecolor1}', endColorstr='#{$iecolor2}');
+		zoom: 1;
+	}
+}
+
+//
+// Progessive Linearization
+//
+@mixin ym-linearize-grids {
+	&,
+	& > [class*="ym-g"] {
+		/* linearization for grid module */
+		display: block;
+		float: none;
+		padding: 0;
+		margin: 0;
+		width: 100% !important;
+	}
+
+	& > [class*="ym-g"] > [class*="ym-gbox"] {
+		/* reset defined gutter values */
+		margin: 0;
+		padding: 0;
+		/* optional for containing floats */
+		overflow: hidden;
+	}
+}
+
+@mixin ym-linearize-columns {
+	&,
+	& > [class*="ym-c"] {
+		/* linearization for column module */
+		display: block;
+		float: none;
+		padding: 0;
+		margin: 0;
+		width: auto !important;
+	}
+
+	& > [class*="ym-c"] > [class*="ym-cbox"] {
+		/* reset defined gutter values */
+		margin: 0 ;
+		padding: 0;
+		/* optional for containing floats */
+		overflow: hidden;
+	}
+}
+
+@mixin ym-linearize-grids-and-columns {
+	&,
+	& > [class*="ym-c"],
+	& > [class*="ym-g"] {
+		/* linearization for grids and columns module */
+		display: block;
+		float: none;
+		padding: 0;
+		margin: 0;
+		width: auto !important;
+	}
+
+	& > [class*="ym-c"] > [class*="ym-cbox"],
+	& > [class*="ym-g"] > [class*="ym-gbox"] {
+		/* reset defined gutter values */
+		margin: 0;
+		padding: 0;
+		/* optional for containing floats */
+		overflow: hidden;
+	}
+}
+
+@mixin ym-linearize-forms {
+	// linearization for form module
+	& label {
+		float:none;
+	}
+
+	& .ym-label,
+	& .ym-message,
+	& input,
+	& button,
+	& textarea,
+	& select {
+		display: block;
+		float: none;
+		position: static;
+		width: 100% !important;
+		margin-left: 0 !important;
+	}
+
+	// reset grids
+	& .ym-fbox-wrap,
+	& .ym-fbox-wrap [class*="ym-g"] {
+		display: block;
+		float: none;
+		width: 100% !important;
+		margin: 0 !important;
+		padding: 0 !important;
+	}
+
+	// reset columnar settings
+	& input[type="checkbox"],
+	& input[type="radio"],
+	& input[type="image"] {
+		margin-left: 0 !important;
+		width: auto !important;
+		display: inline;
+	}
+}
+
+//
+// Tools
+//
+@mixin ym-clearfix {
+	&:before {
+		content:"";
+		display:table;
+	}
+
+	&:after {
+		clear:both;
+		content:".";
+		display:block;
+		font-size:0;
+		height:0;
+		visibility:hidden;
+	}
+
+	// IE < 8
+	zoom: 1;
+}
+
+// CONTAINING FLOATS
+@mixin ym-contain($type: "dt") {
+
+	@if $type == "oh" {
+		display: block;
+		overflow: hidden;
+		width: 100%;
+	}
+
+	@if $type == "fl" {
+		float: left;
+		width: 100%;
+	}
+
+	@if $type == "dt" {
+		display: table;
+		table-layout: fixed;
+		width: 100%;
+	}
+}
+
+//
+// YAML4 Custom Grid Generator
+// Generates CSS for custom grids, based on YAMLs grid-module
+//
+@mixin ym-custom-grid($prefix, $columns, $width, $margin-left, $margin-right) {
+
+	$column_width	: $width / $columns;
+
+	.ym-wrapper {
+		width: $width;
+		margin: 0 auto;
+	}
+	.ym-gbox {
+		padding-left: 0;
+		padding-right: 0;
+		margin-left: $margin-left;
+		margin-right: $margin-right;
+	}
+	[class*="ym-push-"],
+	[class*="ym-pull-"] { position:relative; }
+
+	@for $i from 1 through $columns {
+		.ym-#{$prefix}-#{$i} { width: $column_width * $i; }
+	}
+
+	@for $i from 1 through $columns - 1 {
+		.ym-push-#{$i} { left: $column_width * $i; }
+	}
+
+	@for $i from 1 through $columns - 1 {
+		.ym-pull-#{$i} { left: -$column_width * $i; }
+	}
+}

data/yaml/sass/yaml-sass/navigation/_hlist.scss

@@ -0,0 +1,106 @@
+@import "../yaml-var-globals";
+@import "../mixins/yaml-mixins-core";
+
+@media all {
+	.ym-hlist {
+		/* (en) containing floats in IE */
+		/* (de) Einfassen der Floats im IE */
+		width:100%;
+		overflow:hidden;
+		position:relative;	//(en|de) Bugfix:IE - collapsing horizontal margins
+		line-height:1em;
+		background: #222;
+
+		ul {
+			margin:0;
+			padding: 0.5em 1.5em;
+			display:inline; // (en|de) Bugfix:IE - Doubled Float Margin Bug
+			float:left; // LTR
+
+			li {
+				display:inline; // (en|de) Bugfix:IE - Doubled Float Margin Bug
+				float:left; // LTR
+				font-size:1.0em;
+				line-height:1;
+				list-style-type:none;
+				margin: 0 .25em 0 0;
+				padding:0;
+
+				a, strong {
+					background:transparent;
+					color:#aaa;
+					display:block;
+					font-size:1em;
+					line-height: 2em;
+					padding: 0 0.5em;
+					font-weight:normal;
+					text-decoration:none;
+					text-shadow: 0 1px 1px rgba(0,0,0,.5);
+					width:auto;
+				}
+
+				a:focus,
+				a:hover,
+				a:active  {
+					color: #ccc;
+					background:#666;
+					background: rgba(255,255,255,.25);
+					border-radius: 0.2em;
+					text-decoration:none;
+					outline: 0 none;
+				}
+
+				&.active {
+					background:#666;
+					background: rgba(255,255,255,.3);
+					border-radius: 0.2em;
+					color: #fff;
+
+					strong,
+					a:focus,
+					a:hover,
+					a:active {
+						background:transparent;
+						color:#fff;
+						text-decoration:none;
+					}
+				}
+			}
+		}
+	}
+
+	/* ------- search form -------- */
+	.ym-searchform {
+		float:right;
+		display: inline;
+		line-height: 2;
+		padding: 0.5em 1.5em;
+
+		.ym-searchfield {
+			-webkit-appearance: none;
+			background: #fff;
+			line-height: 1;
+			padding: 0.25em;
+			width: 12em;
+			border: solid 1px #888;
+			border: solid 1px rgba(255,255,255,.1);
+			outline: none;
+			@include ym-box-shadow(0,1px,3px,rgba(0,0,0,.2),inset);
+		}
+
+		.ym-searchbutton {
+			-webkit-appearance: none;
+			background: #5f5f5f;
+			background: rgba(255,255,255,.2);
+			border-radius: .2em;
+			color: #fff;
+			cursor: pointer;
+			display: inline-block;
+			font-size: 1em;
+			line-height: 1.25;
+			padding: 0.25em;
+			border: solid 1px transparent;
+			text-shadow: 0 1px 1px rgba(0,0,0,.5);
+		}
+	}
+}

data/yaml/sass/yaml-sass/navigation/_vlist.scss

@@ -0,0 +1,129 @@
+@import "../_yaml-var-globals";
+
+@media all {
+
+	/* 4 navigation levels defined */
+	.ym-vlist {
+		margin:0 0 1.5em 0;
+		list-style-type:none;
+		background: transparent;
+		border: 0 none;
+
+		ul {
+			list-style-type:none;
+			margin:0;
+			padding:0;
+			width:100%;
+			overflow:hidden;
+			border-top:2px #ddd solid;
+			border-bottom:2px #ddd solid;
+		}
+
+		ul ul {
+			border: 0 none;
+		}
+
+		li {
+			float:left; // LTR
+			width:100%;
+			margin:0;
+			padding:0;
+			background-color:#fff;
+		}
+
+		a,
+		strong,
+		span {
+			display:block;
+			padding:3px 0px 3px 10%;
+			text-decoration:none;
+			border-bottom:1px #ddd solid;
+		}
+
+		a,
+		a:visited {
+			color:#444;
+		}
+
+		li span {
+			display:block;
+			font-weight:bold;
+			border-bottom:1px #ddd solid;
+		}
+
+		// active list element
+		li.active {
+			color:#fff;
+			background-color:#444;
+			strong {
+				font-weight:bold;
+			}
+		}
+
+		// Level 1
+		li {
+			a,
+			strong,
+			span { width:90%; padding-left:10%; } // LTR
+
+			a:focus,
+			a:hover,
+			a:active { background-color:#888; color:#fff; outline: 0 none; }
+		}
+
+		// Level 2
+		li ul li  {
+			a,
+			strong,
+			span { width:80%; padding-left:20%; } // LTR
+
+			a,
+			a:visited { background-color:#f8f8f8; color:#333; }
+			a:focus,
+			a:hover,
+			a:active { background-color:#888; color:#fff; }
+		}
+
+		// Level 3
+		li ul li ul li {
+			a,
+			strong,
+			span { width:70%; padding-left:30%; } // LTR
+
+			a,
+			a:visited{ background-color:#f0f0f0; color:#222; }
+			a:focus,
+			a:hover,
+			a:active { background-color:#888; color:#fff; }
+		}
+
+		// Level 4
+		li ul li ul li ul li {
+			a,
+			strong,
+			span { width:60%; padding-left:40%; } // LTR
+
+			a,
+			a:visited { background-color:#e8e8e8; color:#111; }
+			a:focus,
+			a:hover,
+			a:active { background-color:#888; color:#fff; }
+		}
+	}
+
+	/* title */
+	.ym-vtitle {
+		font-weight:bold;
+		font-size:100%;
+		width:90%;
+		padding:3px 0px 3px 10%; // LTR
+		margin:0;
+		color:#444;
+		background-color:#fff;
+		border-top:2px #ddd solid;
+
+		& + ul {
+			border-top:4px #888 solid;
+		}
+	}
+}