ENHANCEMENT: merging of Ed Knight's changes from: 52acf3532f. (SSO-12)

admin/scss/_forms.scss

@@ -16,6 +16,15 @@ form.nostyle {
 
 .field {
 	display: block;
+	padding: 10px 0;
+	border-bottom-width: 2px;
+	border-bottom: 2px groove lighten($color-shadow-light, 95%);
+	-webkit-border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch;
+	border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch;
+	//TODO: use single border line with shadow instead:: http://daverupert.com/2011/06/two-tone-borders-with-css3/
+	//@include border-image(url(../images/textures/bg_fieldset_elements_border.png), 2, stretch); //not yet supported
+	//overflow: hidden;
+
 	
 	// bottom padding accounts for the border and we have a negative
 	// margin with a postive padding to ensure the bottom border extends

admin/scss/_style.scss

@@ -350,30 +350,59 @@ html,body {
 
 .cms-page-add-form-dialog {
 	#PageType li {
-		clear: left;
+		padding: 9px 0 9px 15px;
-		height: 40px;
+		overflow: hidden;
-		border-bottom: 1px solid $color-shadow-dark;
+		border-bottom-width: 2px;
-		
+		border-bottom: 2px groove lighten($color-shadow-light, 95%);
+		-webkit-border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch;
+		border-image: url(../images/textures/bg_fieldset_elements_border.png) 2 stretch stretch;
+				
 		&:hover, &.selected {
-			background-color: lighten($color-highlight, 10%);
+			background-color: $color-highlight-opacity;
 		}
 		
 		input, label, .icon, .title {
 			float: left;
+			line-height: 1.3em;
 		}
 		
 		.icon {
 			width: 20px;
+			display: block;
+			width:  16px;
+			height:  16px;
+			margin: 0 4px;
+			background-color: transparent;
+			background-image: url(../images/sitetree_ss_pageclass_icons_default.png);
+			background-repeat: no-repeat;
+		}
+			
+		.class-HomePage {
+			background-position: 0 -48px;
 		}
 		
+		.class-RedirectorPage {
+			background-position: 0 -16px;
+		}
+		
+		.class-VirtualPage {
+			background-position: 0 -32px;
+		}
+		
+		.class-ErrorPage {
+			background-position: 0 -112px;
+		}
+			
 		.title {
-			width: 100px;
+			width: 120px;
 			font-weight: bold;
+			padding-right: 10px;
 		}
 		
 		.description {
 			font-style: italic;
 		}
+		
 	}
 }
 
@@ -807,4 +836,33 @@ form.member-profile-form {
 	a {
 		padding-right: 1em;
 	}
-}
+}
+
+/** -------------------------------------------------------
+ * Modal - JQuery UI Dialog
+ * -------------------------------------------------------- */
+ .cms .ui-widget-overlay {
+ 	background-color: #000;
+ 	background-image: none;
+ }
+ 
+ .cms .ui-dialog {
+ 	background: #fafafa url(../images/textures/bg_cms_main_content.png) repeat top left;
+ 	padding:  0;
+ 	border:  3px solid #000;
+ 	overflow: visible;
+ 	
+ 	& .ui-dialog-content {
+ 		padding: 0.5em 0;
+ 	}
+ 	
+ 	.Actions {
+ 		float:  right;
+ 		padding: 15px;	
+ 	}
+ 	
+ 	.field {
+ 		border-bottom: none;
+ 		border-image: none;
+ 	}
+ }

admin/scss/_tree.scss

@@ -521,18 +521,18 @@ a .jstree-pageicon {
 	background-repeat: no-repeat;
 }
 
-li.class-HomePage a .jstree-pageicon {
+li.class-HomePage > a .jstree-pageicon {
 	background-position: 0 -48px;
 }
 
-li.class-RedirectorPage a .jstree-pageicon {
+li.class-RedirectorPage > a .jstree-pageicon {
 	background-position: 0 -16px;
 }
 
-li.class-VirtualPage a .jstree-pageicon {
+li.class-VirtualPage > a .jstree-pageicon {
 	background-position: 0 -32px;
 }
 
-li.class-ErrorPage a .jstree-pageicon {
+li.class-ErrorPage > a .jstree-pageicon {
 	background-position: 0 -112px;
 }

admin/scss/_uitheme.scss

@@ -50,11 +50,49 @@
 		font-family: $font-family;
 		border: 0;
 	}
-	
+
-	.ui-widget-header {
+	.ui-widget-header {			
-		background: $color-widget-bg;
+		background-color: darken($color-widget-bg, 20%);
-		border: 0;
+		padding: 8px 8px 6px 8px;	
-		padding: 0;
+		border-bottom: 2px solid darken($color-widget-bg, 35%);
+		@include linear-gradient(color-stops(
+			darken($color-widget-bg, 5%),
+			darken($color-widget-bg, 30%)
+		));
+		border-bottom: 3px solid darken($color-widget-bg, 50%);
+		padding: 8px;	
+		@include border-radius(0);
+			
+		& .ui-dialog-title {
+			padding: 6px 0;
+			text-shadow: lighten($color-base, 10%) 1px 1px 0;
+		}
+		
+		
+		
+		& a.ui-dialog-titlebar-close {
+			position:  absolute;
+			top: -8px;
+			right: -15px;
+			width: 30px;
+			height:  30px;
+		}
+		
+		& a.ui-state-hover {
+			border-color: transparent;
+			background: transparent;
+			
+			& .ui-icon-closethick {
+				background-position: 0 -30px;
+			}
+		}
+		
+		& .ui-icon-closethick {
+			background-image: url(../images/dialog_close.png);
+			background-position: 0 0;
+			width: 30px;
+			height:  30px;
+		}
 	}
 
 	.ui-state-hover {

admin/scss/themes/_default.scss

@@ -21,6 +21,7 @@ $color-shadow-light: rgba(201, 205, 206, 0.8);
 $color-shadow-dark: rgba(107, 120, 123, 0.5);
 
 $color-highlight: #FFFF66;
+$color-highlight-opacity: rgba(255, 255, 102, 0.3);
 
 $color-menu-button: #338DC1;
 $color-menu-background: #c6d7df;
@@ -78,4 +79,4 @@ $grid-horizontal: 8px;
 /** -----------------------------------------------
  * Application Logo (CMS Logo) Must be 24px x 24px
  * ------------------------------------------------ */
-$application-logo-small: image-url("logo_small.png");
+$application-logo-small: image-url("logo_small.png");