Merge pull request #2552 from 0xF013/fix/18522-ie-11-broken-inplace-lists

18413, 18522, 18676 a bundle of fixes for details tab (ie11 included)
pull/2562/merge
Alex Coles 10 years ago
commit 5073e96b6d
  1. 9
      app/assets/stylesheets/content/_attributes_key_value.sass
  2. 29
      app/assets/stylesheets/content/_in_place_editing.sass
  3. 1
      app/assets/stylesheets/content/_work_packages.sass
  4. 12
      frontend/app/ui_components/inplace-editor-dispatcher.js
  5. 18
      frontend/public/templates/components/inplace_editor.html
  6. 4
      frontend/public/templates/components/inplace_editor/display/version.html

@ -28,6 +28,8 @@
.attributes-key-value .attributes-key-value
@include grid-block($wrap: true) @include grid-block($wrap: true)
overflow: visible
overflow-y: visible
.attributes-key-value--key .attributes-key-value--key
@include grid-content(4) @include grid-content(4)
@ -37,14 +39,15 @@
font-weight: bold font-weight: bold
line-height: $list-line-height / 0.9 line-height: $list-line-height / 0.9
text-overflow: ellipsis text-overflow: ellipsis
overflow: hidden
white-space: nowrap white-space: nowrap
.attributes-key-value--value-container .attributes-key-value--value-container
@include grid-content(8) @include grid-content(8)
overflow: visible
overflow-y: visible
margin-bottom: 0.4rem margin-bottom: 0.4rem
padding: 0 padding: 0
.attributes-key-value--value .attributes-key-value--value
&.-user overflow: visible
overflow: hidden overflow-y: visible

@ -1,4 +1,8 @@
.select2-container
position: relative!important
.inplace-editor .inplace-editor
ul
margin-left: auto
display: inline display: inline
font-size: medium font-size: medium
.ined-input-wrapper-inner .ined-input-wrapper-inner
@ -44,6 +48,7 @@
margin-bottom: -1px margin-bottom: -1px
.ined-read-value .ined-read-value
display: inline display: inline
position: relative
&.default &.default
span span
font-style: italic font-style: italic
@ -60,10 +65,8 @@
.ined-dashboard .ined-dashboard
min-height: 42px min-height: 42px
.ined-errors .ined-errors
float: right
display: inline-block
line-height: 1.2em line-height: 1.2em
width: 251px width: 100%
padding: 5px padding: 5px
left: 251px left: 251px
bottom: -11px bottom: -11px
@ -102,19 +105,16 @@
display: block display: block
.read-value-wrapper .read-value-wrapper
display: inline-block display: inline-block
width: 400px width: 100%
.editing-link-wrapper .editing-link-wrapper
position: relative top: 5px
display: inline-block right: 0px
float: right
.ined-dashboard .ined-dashboard
padding-left: 0px padding-left: 0px
width: 100% width: 100%
.ined-controls .ined-controls
left: 0px left: 0px
z-index: 1 z-index: 1
.ined-errors
width: 307px
.jstHandle .jstHandle
display: none display: none
.jstElements .jstElements
@ -140,22 +140,13 @@
.jstb_strong, .jstb_em, .jstb_ins, .jstb_del, .jstb_ul, .jstb_ol .jstb_strong, .jstb_em, .jstb_ins, .jstb_del, .jstb_ul, .jstb_ol
display: inline display: inline
&.type-select2 &.type-select2
display: inline-block
width: 344px
.select2-display-none .select2-display-none
display: none display: none
.ui-select-choices
max-height: 100px
input[type='text'] input[type='text']
width: 100% width: 100%
.ined-dashboard .ined-dashboard
padding-left: 0px padding-left: 0px
width: 345px
.ined-errors
width: 225px
.ined-controls .ined-controls
.ined-edit
height: 175px
.ined-read-value .ined-read-value
position: relative position: relative
display: block display: block
@ -164,7 +155,7 @@
outline: 1px solid #cacaca outline: 1px solid #cacaca
.editing-link-wrapper .editing-link-wrapper
position: absolute position: absolute
right: -13px right: -3px
top: 1px top: 1px
width: 30px width: 30px
.icon-context:before .icon-context:before

@ -123,6 +123,7 @@
margin: 0 margin: 0
padding: 0 0 10px 0 padding: 0 0 10px 0
display: block display: block
clear: both
.select-type .select-type
padding-top: 3px padding-top: 3px

@ -103,8 +103,6 @@ module.exports = function($sce, $http, $timeout, AutoCompleteHelper, TextileServ
$scope.options = options; $scope.options = options;
} }
$scope.$broadcast('focusSelect2'); $scope.$broadcast('focusSelect2');
} else {
$scope.isEditable = false;
} }
} }
@ -149,10 +147,14 @@ module.exports = function($sce, $http, $timeout, AutoCompleteHelper, TextileServ
enableAutoCompletion(element); enableAutoCompletion(element);
scope.$on('startEditing', function() { scope.$on('startEditing', function() {
$timeout(function() { $timeout(function() {
element.find('.ined-dashboard').css({ var typeWidth = element
'margin-left': element
.closest('.work-packages--details-content') .closest('.work-packages--details-content')
.find('.select-type:first').width() .find('.select-type:first').width();
element.find('.ined-dashboard').css({
'margin-left': typeWidth
});
element.find('input[type=text]').css({
'width': element.find('.ined-dashboard').width()
}); });
}, 0, false); }, 0, false);
}); });

@ -1,22 +1,6 @@
<div class="inplace-editor type-{{type}} attribute-{{attribute}}" ng-class="{busy: isBusy, preview: isPreview, editable: isEditable}" aria-busy="{{ isBusy }}" ng-disabled="!isEditable"> <div class="inplace-editor type-{{type}} attribute-{{attribute}}" ng-class="{busy: isBusy, preview: isPreview, editable: isEditable}" aria-busy="{{ isBusy }}" ng-disabled="!isEditable">
<div class="ined-read-value" ng-class="{ default: placeholderSet, editable: isEditable }" ng-hide="isEditing" ng-switch="type"> <div class="ined-read-value" ng-class="{ default: placeholderSet, editable: isEditable }" ng-hide="isEditing" ng-switch="type">
<span class="read-value-wrapper" ng-switch-when="wiki_textarea" ng-bind-html="readValue"></span> <span class="read-value-wrapper" ng-include src="getDisplayTemplateUrl()"></span>
<span class="read-value-wrapper" ng-switch-default>
<span ng-if="!isUserLink">
<span ng-if="attribute == 'version.name'">
<span ng-if="entity.links.version">
<a href="{{pathHelper.versionPath(entity.embedded.version.props.id)}}">
{{entity.links.version.props.title}}
</a>
</span>
<span ng-if="!entity.links.version">
{{readValue}}
</span>
</span>
<span ng-if="attribute != 'version.name'" ng-bind="readValue"></span>
</span>
<user-field ng-if="isUserLink" user="readValue"></user-field>
</span>
<span ng-if="isEditable" class="editing-link-wrapper"> <span ng-if="isEditable" class="editing-link-wrapper">
<accessible-by-keyboard execute="startEditing()"> <accessible-by-keyboard execute="startEditing()">
<icon-wrapper icon-name="edit" icon-title="{{ editTitle }}"> <icon-wrapper icon-name="edit" icon-title="{{ editTitle }}">

@ -1,8 +1,8 @@
<span ng-if="entity.links.version"> <span ng-if="entity.links.version.href">
<a href="{{pathHelper.versionPath(entity.embedded.version.props.id)}}"> <a href="{{pathHelper.versionPath(entity.embedded.version.props.id)}}">
{{entity.links.version.props.title}} {{entity.links.version.props.title}}
</a> </a>
</span> </span>
<span ng-if="!entity.links.version"> <span ng-if="!entity.links.version.href">
{{readValue}} {{readValue}}
</span> </span>

Loading…
Cancel
Save