silverstripe-dms/scss/DMSDocumentCMSFields.scss

@import "compass/css3";


$color-button-generic: #e6e6e6 !default;

form.small .field input.text, 
form.small .field textarea, 
form.small .field select, 
form.small .field .TreeDropdownField, 
.field.small input.text, .field.small textarea, 
.field.small select, .field.small .TreeDropdownField{
	width: 100%;
}

#FileP{
	.fieldgroup-field{
		width:100%;
		.cms-file-info-preview{
			box-shadow:none;
		}
		.cms-file-info-data{
			width:400px;
		}
		.fieldholder-small{
			margin-top: 5px;
			label{
				width:auto;
				margin-left: 0;
				padding-top: 0;
				margin-right: 10px;
				font-weight: bold;
				float: left;
			}
			.readonly{
				font-style:italic;
				color: #666;
			}
		}
	}
}

#DocumentTypeID{
	ul{
		padding:0;
		input[type="radio"]{
			display:none;
		}
		li{
			display:inline-block;
			padding:0;
			width:90px;
			margin-right: -1px;
			border-radius:0;
			&.val1{
				width:130px;
				label{
					max-width:105px;
				}
			}
			&:first-child{
				border-radius: 6px 0 0 6px;
				border-left: 1px solid #C0C0C2;
			}
			&:last-child{
				border-radius: 0 6px 6px 0;
			}
			&.selected{
				border-bottom:1px solid #C0C0C2;
				@include background(
					linear-gradient(color-stops(
						darken($color-button-generic, 15%),
						$color-button-generic
					))
				);
				box-shadow: 0 1px 1px 0 #A0A0A0 inset;
				:after{
					box-shadow: 0 1px 1px 0 #DDD;
				}
			}
			label{
				padding: .4em 1em;
				display: inline-block;
				line-height: 1.4;
				white-space:normal;
				max-width:60px;
			}
		}
	}
}
#Actions{
	box-shadow:none;
	border:none;
	padding:0;
	li{
		margin-left: 2px;
		&:first-child{
			margin-left: 0;
		}
		&.delete-button-appended{
			display: inline-block;
			position: relative;
			margin-left: 0;
		}
		&.dms-active{
			border-bottom:1px solid #C0C0C2;
			@include background(
				linear-gradient(color-stops(
					darken($color-button-generic, 15%),
					$color-button-generic
				))
			);
			box-shadow: 0 1px 1px 0 #A0A0A0 inset;
			&:after{
				content: '';
				display: block;
				position: absolute;
				top: 33px;
				left: 50%;
				margin-left: -6px;
				width: 12px;
				height: 12px;
				background: #F8F8F8;
				border-right: 1px solid #B3B3B3;
				border-top: 1px solid #B3B3B3;
				-moz-transform:rotate(-45deg);
				-webkit-transform:rotate(-45deg);
				pointer-events:none;
			}
		}
	}
}

#ActionsPanel{
	.middleColumn{
		margin-left:184px;
		width: 510px;
		form.small &{
			margin-left: 120px;
		}
	}
	label.fieldholder-small-label{
		display: none;
	}
	.fieldgroup-field{
		float:none;
		width:auto;
 		.fieldholder-small{
			label{
				float:none;
				width:auto;
				margin:0;
				padding:0;
				&.ss-ui-button{
					float: left;
					margin: 0 10px 0 0;
				}
			}
		}
		.embargo, .expiry{
			li{
				float: none;
				width: 100%;
				margin-left: 8px;
				label{
					padding-left: 10px;
				}	
			}
			.embargoDatetime, .expiryDatetime{
				margin-top: 0;
				margin-left: 34px;
				.field{
					&.date, &.time{
						display: inline-block;
						width: auto;
					}
					&.date{
						.middleColumn{
							background: url('../images/calendar-month.png') 90px 7px no-repeat;
						}
					}
					&.time{
						.middleColumn{
							background: url('../images/clock-frame.png') 90px 7px no-repeat;
						}
					}
				}
				.middleColumn{
					margin-left: 0;
					width: auto;
					border: none;
					input{
						width: 80px;
						margin-right: 40px;
					}
				}
			}
		}
	}
	.ss-uploadfield-files{
		.ss-uploadfield-item-preview{
			background: url('../images/app_icons/generic_32.png') -10px -6px no-repeat;
		}
		.ss-uploadfield-item-name{
			span.name{
				width: 260px;
			}
		}
		.ss-uploadfield-item-actions{
			.ss-uploadfield-item-cancel{
				width: auto;
				text-indent:0;
				.btn-icon-deleteLight{
					background-position: 0 -128px;
					display: inline-block;
				}
				.ui-button-text{
					display: block;
					position: relative;
					float: right;
					color: #555;
					padding:0;
					padding-left: 2em;
				}
			}
		}
	}
}

#Form_ItemEditForm{
	fieldset{
		table.ss-gridfield-table{
			width: 508px;
			//max-width:508px;
			tr{
				th.main{
					min-width:175px;
					&.col-action_SetOrderID{
						width:60px;
						min-width:60px;
					}
				}
				td{
					white-space:normal;
				}
			}
		}
	}
}

#ui-datepicker-div{
	border: 1px solid #DDD;
}