compass-ui 0.0.3

data/stylesheets/compass-ui/theme/_absolution.scss

@@ -0,0 +1,151 @@
+/** 
+ * The Absolution Theme is based on 
+ * Absolution by Michael Vanderheeren
+ * Copyright (c) 2010 Michael Vanderheeren
+ * 
+ * Please follow the his Github project to stay up to date on that theme:
+ * https://github.com/michaelvanderheeren/Absolution
+ */
+@import "compass/css3/border-radius";
+@import "compass/css3/images";
+@import "compass/css3/opacity";
+@import "compass/css3/box-shadow";
+@import "compass/css3/text-shadow";
+
+@import "compass-ui";
+@import "absolution/progressbar";
+@import "absolution/dialog";
+@import "absolution/accordion";
+@import "absolution/autocomplete";
+@import "absolution/datepicker";
+@import "absolution/slider";
+@import "absolution/tabs";
+
+// Theme mixin that calls the relevant jQuery and theme 
+// mixins when appropriate. 
+@mixin absolution-theme {
+  @include jquery-ui-theme;
+  @include absolution-dialog;
+  @include absolution-progressbar;
+  @include absolution-accordion;
+  @include absolution-autocomplete;
+  @include absolution-datepicker;
+  @include absolution-slider;
+  @include absolution-tabs;
+}
+
+// Default Radius
+$ui-border-radius: 5px;
+
+// Default Fonts
+$ui-font-family: "Trebuchet MS", Tahoma, Verdana, Arial, sans-serif;
+
+$ui-fixed-font-family: "andale mono", "lucida console", monospace;
+
+$ui-font-size: 1.1em;
+
+$ui-widget-font-size: 1em;
+
+$ui-form-font-size: 1em;
+
+$ui-header-font-weight: bold;
+
+// ------------------------------------------
+// Icon Images 
+// ------------------------------------------
+$ui-images-url: "absolution/";
+$ui-icons: "ui-icons_222222_256x240.png";
+$ui-icons-content: $ui-icons;
+$ui-icons-header: $ui-icons;
+$ui-icons-default: $ui-icons;
+$ui-icons-hover: "ui-icons_ffffff_256x240.png";
+$ui-icons-focus: $ui-icons-hover;
+$ui-icons-active: $ui-icons-hover;
+$ui-icons-highlight: $ui-icons;
+$ui-icons-error: $ui-icons;
+
+// ------------------------------------------
+// Color Scheme
+// ------------------------------------------
+
+// content
+$ui-content-border-color: #a9a9a9; 
+$ui-content-color: #333333;
+$ui-content-link-color: $ui-content-color;
+$ui-content-background-color: #fdfdfd;
+// If the background is flat, add a full background description: 
+// $ui-content-background: #ffffff url(...);
+$ui-content-background: linear-gradient($ui-content-background-color,#ececec);
+$ui-content-background-type: gradient;
+
+// header
+$ui-header-border-color: $ui-content-border-color;
+$ui-header-color: $ui-content-color;
+$ui-header-link-color: $ui-header-color;
+$ui-header-background-color: $ui-content-background-color;
+$ui-header-background: $ui-content-background;
+
+// titlebar
+$ui-titlebar-color: #ffffff;
+$ui-titlebar-background-color: #4c4c4e;
+$ui-titlebar-background: linear-gradient($ui-titlebar-background-color, #282425);
+$ui-titlebar-background-type: gradient;
+
+
+// state-default
+$ui-default-border-color: #a9a9a9;
+$ui-default-color: #333333;
+$ui-default-background-color: #fdfdfd;
+$ui-default-background: linear-gradient($ui-default-background-color,#ececec);
+$ui-default-link-color: $ui-default-color;
+
+// state-hover
+$ui-hover-border-color: #2e63a5;
+$ui-hover-color: #ffffff;
+$ui-hover-background-color: #5e9ae2;
+$ui-hover-background: linear-gradient($ui-hover-background-color,#3570b8);
+$ui-hover-link-color: $ui-hover-color;
+
+// state-active
+$ui-active-border-color: #2e63a5;
+$ui-active-color: #ffffff; 
+$ui-active-background-color: #3570b8;
+$ui-active-background: linear-gradient($ui-active-background-color,#5e9ae2);
+$ui-active-link-color: $ui-active-color;
+
+// state-highlight
+$ui-highlight-border-color: #8b9fc2;
+$ui-highlight-color: #363636;
+$ui-highlight-background-color: #7cc5e3;
+$ui-highlight-background: $ui-highlight-background-color;
+$ui-highlight-background-type: flat;
+$ui-highlight-link-color: $ui-highlight-color;
+
+// state-error
+$ui-error-border-color: #953737;
+$ui-error-color: #363636;
+$ui-error-background-color: #f35757;
+$ui-error-background: $ui-error-background-color; 
+$ui-error-background-type: flat;
+$ui-error-link-color: $ui-error-color;
+
+// state-primary
+
+// priority-secondary
+$ui-priority-secondary-opacity: .7;
+
+// state-disabled
+$ui-disabled-opacity: .35;
+
+// overlay
+$ui-overlay-opacity: .3;
+$ui-overlay-background-color: #aaaaaa;
+$ui-overlay-background: linear-gradient($ui-overlay-background-color,adjust-lightness($ui-overlay-background-color, -5));
+$ui-overlay-background-type: gradient;
+
+// shadow
+$ui-shadow-opacity: .3;
+$ui-shadow-background-color: #aaaaaa;
+$ui-shadow-background: linear-gradient($ui-shadow-background-color,adjust-lightness($ui-shadow-background-color, -5));
+$ui-shadow-background-type: gradient;
+

data/stylesheets/compass-ui/theme/_dot-luv.scss

@@ -0,0 +1,115 @@
+@import "compass/css3/border-radius";
+@import "compass/css3/images";
+@import "compass/css3/opacity";
+@import "compass-ui";
+
+// Theme mixin that calls the relevant jQuery and theme mixins when appropriate. 
+@mixin dot-luv-theme {
+  @include jquery-ui-theme;
+}
+
+// Default Radius
+$ui-border-radius: 4px;
+
+// Default Fonts
+$ui-font-family: Arial, sans-serif;
+
+$ui-font-size: 1.3em;
+
+$ui-font-color: #d9d9d9;
+
+// ------------------------------------------
+// Icon Images 
+// ------------------------------------------
+
+$ui-images-url: "dot-luv/";
+$ui-icons: "ui-icons_9ccdfc_256x240.png";
+$ui-icons-content: $ui-icons; 
+$ui-icons-header: "ui-icons_98d2fb_256x240.png";
+$ui-icons-default: $ui-icons; 
+$ui-icons-hover: "ui-icons_ffffff_256x240.png";
+$ui-icons-focus: $ui-icons-hover;
+$ui-icons-active: "ui-icons_00498f_256x240.png";
+$ui-icons-highlight: $ui-icons-hover;
+$ui-icons-error: $ui-icons-hover;
+
+// ------------------------------------------
+// Color Scheme
+// ------------------------------------------
+
+// Content
+$ui-content-border-color: #000000; 
+$ui-content-color: $ui-font-color;
+$ui-content-background-color: #111111;
+$ui-content-background: #111111 image-url("#{$ui-images-url}ui-bg_gloss-wave_20_111111_500x100.png") 50% top repeat-x;
+$ui-content-background-type: flat;
+$ui-content-link-color: $ui-content-color;
+
+// Header
+$ui-header-border-color: #0b3e6f; 
+$ui-header-color: #f6f6f6; 
+$ui-header-background-color: #0b3e6f;
+$ui-header-background: #0b3e6f image-url("#{$ui-images-url}ui-bg_diagonals-thick_15_0b3e6f_40x40.png") 50% 50% repeat;
+$ui-header-background-type: flat;
+$ui-header-link-color: $ui-header-color;
+
+// State-Default
+$ui-default-border-color: #333333;
+$ui-default-color: #ffffff;
+$ui-default-background-color: #333333;
+$ui-default-background: #333333 image-url("#{$ui-images-url}ui-bg_dots-small_20_333333_2x2.png") 50% 50% repeat;
+$ui-default-background-type: flat;
+$ui-default-link-color: $ui-default-color;
+
+// State-Hover
+$ui-hover-border-color: #222222;
+$ui-hover-color: #ffffff;
+$ui-hover-background-color: #00498f;
+$ui-hover-background: #00498f image-url("#{$ui-images-url}ui-bg_dots-small_40_00498f_2x2.png") 50% 50% repeat;
+$ui-hover-background-type: flat;
+$ui-hover-link-color: $ui-hover-color;
+
+// State-Active
+$ui-active-border-color: #096ac8;
+$ui-active-color: #75abff;
+$ui-active-background-color: #292929;
+$ui-active-background: #292929 image-url("#{$ui-images-url}ui-bg_flat_40_292929_40x100.png") 50% 50% repeat-x;
+$ui-active-background-type: flat;
+$ui-active-link-color: $ui-active-color;
+
+// State-Highlight
+$ui-highlight-border-color: #052f57;
+$ui-highlight-color: #ffffff;
+$ui-highlight-background-color: #0b58a2;
+$ui-highlight-background: #0b58a2 image-url("#{$ui-images-url}ui-bg_dots-medium_30_0b58a2_4x4.png") 50% 50% repeat;
+$ui-highlight-background-type: flat;
+$ui-highlight-link-color: $ui-highlight-color;
+
+// State-Error
+$ui-error-border-color: #cd0a0a;
+$ui-error-color: #ffffff;
+$ui-error-background-color: #a32d00;
+$ui-error-background: #a32d00 image-url("#{$ui-images-url}ui-bg_dots-small_30_a32d00_2x2.png") 50% 50% repeat;
+$ui-error-background-type: flat;
+$ui-error-link-color: $ui-default-color;
+
+// State-Primary
+
+// Priority-Secondary
+$ui-priority-secondary-opacity: .7;
+
+// State-Disabled
+$ui-disabled-opacity: .35;
+
+// Overlay
+$ui-overlay-opacity: .3;
+$ui-overlay-background-color: #aaaaaa;
+$ui-overlay-background: $ui-overlay-background-color;
+$ui-overlay-background-type: flat;
+
+// Shadow
+$ui-shadow-opacity: .3;
+$ui-shadow-background-color: #aaaaaa;
+$ui-shadow-background: $ui-shadow-background-color;
+$ui-shadow-background-type: flat;
+

data/stylesheets/compass-ui/theme/_jquery-ui-base.scss

@@ -0,0 +1,160 @@
+@import "compass-ui/colors";
+@import "compass-ui/jquery-ui";
+@import "compass/css3/border-radius";
+@import "compass/css3/images";
+@import "compass/css3/opacity";
+
+// Theme mixin that calls the relevant jQuery and theme mixins when appropriate. 
+@mixin jquery-ui-base-theme {
+  @include jquery-ui-theme;
+}
+
+// Default Radius
+$ui-border-radius: 5px !default;
+
+// Default Fonts
+$ui-font-family: Verdana, Arial, sans-serif !default;
+
+$ui-fixed-font-family: "andale mono", "lucida console", monospace !default;
+
+$ui-font-size: 1.1em !default;
+
+$ui-widget-font-size: 1em !default;
+
+$ui-form-font-size: 1em !default;
+
+
+$ui-font-color: #222222 !default;
+
+// ------------------------------------------
+// Icon Images 
+// ------------------------------------------
+
+// Location of the icons and other them related images. Note that this 
+// is relative to the images directory as defined in the compass config.rb file. 
+$ui-images-url: "jquery-ui-base/" !default;
+
+// Individual icon images that relate to each of the jQuery UI states 
+$ui-icons: "ui-icons_222222_256x240.png" !default;
+$ui-icons-content: $ui-icons !default;
+$ui-icons-header: $ui-icons !default;
+$ui-icons-default: "ui-icons_888888_256x240.png" !default;
+$ui-icons-hover: "ui-icons_454545_256x240.png" !default;
+$ui-icons-focus: $ui-icons-hover !default;
+$ui-icons-active: "ui-icons_454545_256x240.png" !default;
+$ui-icons-highlight: "ui-icons_2e83ff_256x240.png" !default;
+$ui-icons-error: "ui-icons_cd0a0a_256x240.png" !default;
+
+// ------------------------------------------
+// Color Scheme
+// ------------------------------------------
+
+
+// Content
+$ui-content-border-width: 1px !default;
+$ui-content-border-style: solid !default;
+$ui-content-border-color: #aaaaaa !default;
+$ui-content-color: $ui-font-color !default;
+$ui-content-background-color: $ui-white !default;
+$ui-content-background: $ui-white !default;
+$ui-content-background-type: flat !default;
+$ui-content-link-color: $ui-content-color !default;
+
+// Header
+$ui-header-border-width: 1px !default;
+$ui-header-border-style: solid !default;
+$ui-header-border-color: #aaaaaa !default;
+$ui-header-color: $ui-font-color !default;
+$ui-header-link-color: $ui-header-color !default;
+$ui-header-font-weight: bold !default;
+$ui-header-background-color: #cccccc !default;
+$ui-header-background: linear-gradient(#e2e2e2,#cccccc) !default;
+$ui-header-background-type: gradient !default;
+
+// State-Default
+$ui-default-border-width: 1px !default;
+$ui-default-border-style: solid !default;
+$ui-default-border-color: #d3d3d3 !default;
+$ui-default-color: #555555 !default;
+$ui-default-link-color: $ui-default-color !default;
+$ui-default-font-weight: normal !default;
+$ui-default-background-color: #e6e6e6 !default;
+$ui-default-background: linear-gradient(#ededed,#f1f1f1) !default;
+$ui-default-background-type: gradient !default;
+
+// State-Hover
+$ui-hover-border-width: 1px !default;
+$ui-hover-border-style: solid !default;
+$ui-hover-border-color: #999999 !default;
+$ui-hover-color: #212121 !default;
+$ui-hover-link-color: $ui-hover-color !default;
+$ui-hover-font-weight: normal !default;
+$ui-hover-background-color: #dadada !default;
+$ui-hover-background: linear-gradient(#e4e4e4,#eaeaea) !default;
+$ui-hover-background-type: gradient !default;
+
+// State-Focus
+$ui-focus-border-width: 1px !default;
+$ui-focus-border-style: solid !default;
+$ui-focus-border-color: #999999 !default;
+$ui-focus-color: #212121 !default;
+$ui-focus-link-color: $ui-hover-color !default;
+$ui-focus-font-weight: normal !default;
+$ui-focus-background-color: #dadada !default;
+$ui-focus-background: linear-gradient(#e4e4e4,#eaeaea) !default;
+$ui-focus-background-type: gradient !default;
+
+// State-Active
+$ui-active-border-width: 1px !default;
+$ui-active-border-style: solid !default;
+$ui-active-border-color: #aaaaaa !default;
+$ui-active-color: #212121 !default;
+$ui-active-link-color: $ui-active-color !default;
+$ui-active-font-weight: normal !default;
+$ui-active-background-color: #ffffff !default;
+$ui-active-background: linear-gradient(#fefefe,#ffffff) !default;
+$ui-active-background-type: gradient !default;
+
+// State-Highlight
+$ui-highlight-border-width: 1px !default;
+$ui-highlight-border-style: solid !default;
+$ui-highlight-border-color: #fcefa1 !default;
+$ui-highlight-color: #363636 !default;
+$ui-highlight-link-color: $ui-highlight-color !default;
+$ui-highlight-background-color: #fbf9ee !default;
+$ui-highlight-background: linear-gradient(#fcfaf1, #fbfaf3) !default;
+$ui-highlight-background-type: gradient !default;
+
+// State-Error
+$ui-error-border-width: 1px !default;
+$ui-error-border-style: solid !default;
+$ui-error-border-color: #cd0a0a !default;
+$ui-error-color: #cd0a0a !default;
+$ui-error-link-color: $ui-default-color !default;
+$ui-error-background-color: #fef1ec !default;
+$ui-error-background: linear-gradient(#fef6f3, #fef8f6) !default;
+$ui-error-background-type: gradient !default;
+
+// State-Primary
+$ui-priority-font-weight: bold !default;
+
+// Priority-Secondary
+$ui-priority-secondary-opacity: .7 !default;
+$ui-priority-secondary-font-weight: normal !default;
+
+// State-Disabled
+$ui-disabled-opacity: .35 !default;
+
+// Overlay
+$ui-overlay-opacity: .3 !default;
+$ui-overlay-background-color: #aaaaaa !default;
+$ui-overlay-background: $ui-overlay-background-color !default;
+$ui-overlay-background-type: flat !default;
+
+// Shadow
+$ui-shadow-opacity: .3 !default;
+$ui-shadow-background-color: #aaaaaa !default;
+$ui-shadow-background: $ui-shadow-background-color !default;
+$ui-shadow-background-type: flat !default;
+
+

data/stylesheets/compass-ui/theme/_smoothness.scss

@@ -0,0 +1,35 @@
+@import "compass/css3/border-radius";
+@import "compass/css3/images";
+@import "compass/css3/opacity";
+@import "compass-ui";
+
+// Theme mixin that calls the relevant jQuery and theme mixins when appropriate. 
+@mixin smoothness-theme {
+  @include jquery-ui-theme;
+}
+
+
+// // Header
+$ui-header-background: #cccccc image-url("#{$ui-images-url}ui-bg_highlight-soft_75_cccccc_1x100.png") 50% 50% repeat-x;
+$ui-header-background-type: flat;
+
+// State-Default
+$ui-default-background: $ui-default-background-color image-url("#{$ui-images-url}ui-bg_glass_75_e6e6e6_1x400.png") 50% 50% repeat-x;
+$ui-default-background-type: flat;
+
+// State-Hover
+$ui-hover-background: $ui-hover-background-color image-url("#{$ui-images-url}ui-bg_glass_75_dadada_1x400.png") 50% 50% repeat-x; 
+$ui-hover-background-type: flat;
+
+// State-Active
+$ui-active-background: #ffffff image-url("#{$ui-images-url}ui-bg_glass_65_ffffff_1x400.png") 50% 50% repeat-x; 
+$ui-active-background-type: flat;
+
+// State-Highlight
+$ui-highlight-background: #fbf9ee image-url("#{$ui-images-url}ui-bg_glass_55_fbf9ee_1x400.png") 50% 50% repeat-x;
+$ui-highlight-background-type: flat;
+
+// State-Error
+$ui-error-background: #fef1ec image-url("#{$ui-images-url}ui-bg_glass_95_fef1ec_1x400.png") 50% 50% repeat-x;
+$ui-error-background-type: flat;
+