diff --git a/admin/css/screen.css b/admin/css/screen.css index 3bc99d387..0ae049be1 100644 --- a/admin/css/screen.css +++ b/admin/css/screen.css @@ -141,7 +141,7 @@ form.nostyle label.left { float: none; display: inherit; width: auto; padding: 0 form.nostyle .middleColumn { margin-left: 0; } form.nostyle input.text, form.nostyle textarea, form.nostyle select, form.nostyle .TreeDropdownField { width: auto; max-width: auto; } -.field { display: block; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); padding: 0 0 7px 0; margin: 0 0 8px 0; *zoom: 1; } +.field { display: block; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(244, 245, 245, 0.8); -moz-box-shadow: 0 1px 0 rgba(244, 245, 245, 0.8); box-shadow: 0 1px 0 rgba(244, 245, 245, 0.8); padding: 0 0 7px 0; margin: 0 0 8px 0; *zoom: 1; } .field:last-child { border-bottom: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .field:after { content: "\0020"; display: block; height: 0; clear: both; overflow: hidden; visibility: hidden; } .field.nolabel .middleColumn { margin-left: 0; } @@ -151,11 +151,10 @@ form.nostyle input.text, form.nostyle textarea, form.nostyle select, form.nostyl .field span.readonly { padding-top: 8px; line-height: 16px; display: block; } .field .help { color: #777777; font-style: italic; padding-top: 1em; } .field input.text, .field textarea, .field select, .field .TreeDropdownField { width: 100%; max-width: 512px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } -.field .fieldholder-small { margin-top: 8px; } -.field .fieldholder-small label { padding-top: 8px; width: 64px; float: left; margin-left: -64px; } .field input.text, .field textarea, .field .TreeDropdownField { background: #fff; border: 1px solid #b3b3b3; padding: 7px 7px; line-height: 16px; margin: 0; outline: none; -webkit-transition: 0.2s box-shadow ease-in; -moz-transition: 0.2s box-shadow ease-in; -ms-transition: 0.2s box-shadow ease-in; -o-transition: 0.2s box-shadow ease-in; transition: 0.2s box-shadow ease-in; -webkit-transition: 0.2s border ease-in; -moz-transition: 0.2s border ease-in; -ms-transition: 0.2s border ease-in; -o-transition: 0.2s border ease-in; transition: 0.2s border ease-in; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eaeaea), color-stop(10%, #ffffff)); background-image: -webkit-linear-gradient(#eaeaea, #ffffff 10%); background-image: -moz-linear-gradient(#eaeaea, #ffffff 10%); background-image: -o-linear-gradient(#eaeaea, #ffffff 10%); background-image: -ms-linear-gradient(#eaeaea, #ffffff 10%); background-image: linear-gradient(#eaeaea, #ffffff 10%); } .field input.text:focus, .field textarea:focus, .field .TreeDropdownField:focus { border: 1px solid #9a9a9a; border-top-color: gray; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset; } .field input[disabled], .field input.disabled, .field textarea[disabled], .field textarea.disabled, .field select[disabled], .field select.disabled { color: #777777; background: #efefef; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JjYmNiYyIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZWZlZmVmIi8+PHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiY2JjYmMiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #bcbcbc), color-stop(10%, #efefef), color-stop(90%, #ffffff), color-stop(100%, #bcbcbc)); background-image: -webkit-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: -moz-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: -o-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: -ms-linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); background-image: linear-gradient(#bcbcbc, #efefef 10%, #ffffff 90%, #bcbcbc); border: 1px solid #b3b3b3; } +.field#Action { box-shadow: none; } form.stacked .field label, .field.stacked label { display: block; float: none; padding-bottom: 10px; } form.stacked .field .middleColumn, .field.stacked .middleColumn { margin-left: 0px; clear: left; } @@ -226,6 +225,7 @@ input.radio { margin-left: 0; } /** ---------------------------------------------------- HTML Text ---------------------------------------------------- */ .htmleditor textarea { visibility: hidden; } .htmleditor .mceEditor input, .htmleditor .mceEditor select { width: auto; } +.htmleditor label.left { padding-bottom: 4px; } .action-hidden { display: none; } @@ -365,7 +365,7 @@ body.cms { overflow: hidden; } .cms-content-tools { background-color: #F1F4F5; background: #f0f3f4 url(../images/textures/bg_cms_main_content.png) repeat top left; width: 192px; border-right: 1px solid #bfcad2; overflow-y: auto; overflow-x: hidden; z-index: 70; -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0 2px 3px; -moz-box-shadow: rgba(0, 0, 0, 0.6) 0 2px 3px; box-shadow: rgba(0, 0, 0, 0.6) 0 2px 3px; float: left; position: relative; } .cms-content-tools.filter { padding: 0 !important; } .cms-content-tools .cms-panel-header { clear: both; margin: 0 0 7px; line-height: 24px; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); } -.cms-content-tools .cms-panel-content { width: 176px; padding: 0 8px; overflow: auto; height: 100%; } +.cms-content-tools .cms-panel-content { width: 176px; padding: 8px 8px 0; overflow: auto; height: 100%; } .cms-content-tools .cms-panel-content .dropdown select { width: 160px; } .cms-content-tools .cms-panel-content #LastEditedFrom { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .cms-content-tools .cms-panel-content #LastEditedFrom input { width: 160px; } @@ -456,6 +456,9 @@ form.member-profile-form .ui-tabs-nav .ui-corner-all, form.member-profile-form . .cms .cms-content-fields #Root_Main .customFormat { max-width: 80px; } .cms .cms-content-fields #Root_Main .cms-help-toggle { text-indent: -9999em; display: inline-block; width: 20px; background: url(../images/question.png) no-repeat 0px 0px; } .cms .cms-content-fields #Root_Permissions ul.optionset li { float: none; } +.cms .cms-content-fields .field .fieldholder-small { margin-top: 8px; } +.cms .cms-content-fields .field .fieldholder-small label { padding-top: 8px; width: 64px; float: left; margin-left: -64px; } +.cms .cms-content-fields .field table .fieldholder-small { margin-top: 0; } /** -------------------------------------------- "Settings" Form -------------------------------------------- */ #CanViewType .optionset li, #CanEditType .optionset li, #CanCreateTopLevelType .optionset li { float: none; width: auto; white-space: nowrap; } diff --git a/admin/scss/_forms.scss b/admin/scss/_forms.scss index 189cf2d4a..7519b2555 100644 --- a/admin/scss/_forms.scss +++ b/admin/scss/_forms.scss @@ -17,7 +17,7 @@ form.nostyle { .field { display: block; border-bottom: 1px solid $color-shadow-light; - @include box-shadow(0 1px 0 lighten($color-shadow-light, 95%)); + @include box-shadow(0 1px 0 lighten($color-shadow-light, 16%)); //TODO: use single border line with shadow instead:: http://daverupert.com/2011/06/two-tone-borders-with-css3/ //overflow: hidden; @@ -89,16 +89,6 @@ form.nostyle { @include box-sizing(border-box); } - // Small fields have a second set of headers - .fieldholder-small { - margin-top: $grid-y; - label { - padding-top: $grid-x; - width: $grid-x * 8; - float: left; - margin-left: $grid-x * -8; - } - } input.text, textarea, @@ -129,7 +119,9 @@ form.nostyle { @include background-image(linear-gradient(darken(#efefef, 20%), #efefef 10%, #fff 90%, darken(#efefef, 20%))); border: 1px solid lighten($color-medium-separator, 20%); } - + &#Action { + box-shadow: none; + } } form.stacked .field, .field.stacked { @@ -513,7 +505,9 @@ input.radio { width: auto; } } - + label.left { + padding-bottom: $grid-y/2; + } } diff --git a/admin/scss/_style.scss b/admin/scss/_style.scss index ea2811408..3108256b8 100644 --- a/admin/scss/_style.scss +++ b/admin/scss/_style.scss @@ -630,7 +630,7 @@ body.cms { .cms-panel-content { width: ($grid-x * 22); - padding: 0 $grid-x; + padding: $grid-x $grid-x 0; overflow: auto; height:100%; .dropdown select { @@ -1082,6 +1082,21 @@ form.member-profile-form { float:none; } } + + .field { + .fieldholder-small { // Small fields have a second set of headers + margin-top: $grid-y; + label { + padding-top: $grid-x; + width: $grid-x * 8; + float: left; + margin-left: $grid-x * -8; + } + } + table .fieldholder-small { + margin-top: 0; + } + } } } diff --git a/css/AssetUploadField.css b/css/AssetUploadField.css index d3cff5b08..a0c7dc4a2 100644 --- a/css/AssetUploadField.css +++ b/css/AssetUploadField.css @@ -8,7 +8,6 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fieldset { padding: 16px; overflow: auto; background: #E2E2E2; } body.cms.ss-uploadfield-edit-iframe span.readonly, .composite.ss-assetuploadfield .details fieldset span.readonly { font-style: italic; color: #777777; text-shadow: 0px 1px 0px #fff; } -body.cms.ss-uploadfield-edit-iframe .fieldholder-small, .composite.ss-assetuploadfield .details fieldset .fieldholder-small { margin-top: -8px; } body.cms.ss-uploadfield-edit-iframe .fieldholder-small label, .composite.ss-assetuploadfield .details fieldset .fieldholder-small label { margin-left: 0; } .ss-assetuploadfield h3 { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin: 0 0 8px; padding: 0 0 7px; clear: both; } diff --git a/css/GridField.css b/css/GridField.css index 2f1535c9b..13d4cf6e9 100644 --- a/css/GridField.css +++ b/css/GridField.css @@ -71,7 +71,7 @@ .cms table.ss-gridfield-table tr th div.fieldgroup.filter-buttons { min-width: 0; } .cms table.ss-gridfield-table tr th div.fieldgroup.filter-buttons div { width: auto; display: inline; } .cms table.ss-gridfield-table tr th.main { white-space: nowrap; border-top: 1px solid #a4b4bf; border-left: 1px solid #a4b4bf; color: #fff; background: #98aab6; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } -.cms table.ss-gridfield-table tr th.main span { text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0; padding-left: 8px; padding-right: 8px; } +.cms table.ss-gridfield-table tr th.main span { text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0; padding-left: 8px; padding-right: 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; o-text-overflow: ellipsis; margin-right: 8px; } .cms table.ss-gridfield-table tr th.main.col-listChildrenLink { border-right: none; } .cms table.ss-gridfield-table tr th.extra, .cms table.ss-gridfield-table tr th.action { padding: 0; cursor: default; } .cms table.ss-gridfield-table tr th.extra { position: relative; background: #637276; background: rgba(0, 0, 0, 0.7); padding: 5px; border-top: rgba(0, 0, 0, 0.2); } diff --git a/forms/CheckboxSetField.php b/forms/CheckboxSetField.php index 11b623389..d6e158905 100644 --- a/forms/CheckboxSetField.php +++ b/forms/CheckboxSetField.php @@ -179,7 +179,7 @@ class CheckboxSetField extends OptionsetField { if($fieldname && $record && $relation && $relation instanceof RelationList) { $idList = array(); if($this->value) foreach($this->value as $id => $bool) { - if($bool) { + if($bool) { $idList[] = $id; } } @@ -187,7 +187,7 @@ class CheckboxSetField extends OptionsetField { } elseif($fieldname && $record) { if($this->value) { $this->value = str_replace(',', '{comma}', $this->value); - $record->$fieldname = implode(",", $this->value); + $record->$fieldname = implode(',', (array) $this->value); } else { $record->$fieldname = ''; } diff --git a/scss/AssetUploadField.scss b/scss/AssetUploadField.scss index 6c813e77a..4c8495027 100644 --- a/scss/AssetUploadField.scss +++ b/scss/AssetUploadField.scss @@ -23,7 +23,7 @@ body.cms.ss-uploadfield-edit-iframe, .composite.ss-assetuploadfield .details fie text-shadow: 0px 1px 0px #fff; } .fieldholder-small{ - margin-top:-8px; + label{ margin-left:0; } diff --git a/scss/GridField.scss b/scss/GridField.scss index 4efaa6f3a..68708cb0e 100644 --- a/scss/GridField.scss +++ b/scss/GridField.scss @@ -21,6 +21,7 @@ //multiple images. $experimental-support-for-svg: true; + $gf_colour_gradient_dark: darken($color-base, 8%); $gf_colour_header_border: $gf_colour_gradient_dark; $gf_colour_subheader: saturate(lighten($color-base, 15%),5%); @@ -39,6 +40,12 @@ $gf_grid_x: 16px; -webkit-box-shadow: none; box-shadow: none; } +@mixin hide-text-overflow { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + o-text-overflow: ellipsis; +} .cms { .ss-gridfield { @@ -360,6 +367,9 @@ $gf_grid_x: 16px; @include single-text-shadow($gf_colour_text_shadow, 0px, -1px, 0); padding-left: $gf_grid_x/2; padding-right: $gf_grid_x/2; + @include hide-text-overflow; // Add ellipses to overflowing text + margin-right: 8px; + } &.col-listChildrenLink { border-right:none;