diff --git a/client/dist/styles/bundle.css b/client/dist/styles/bundle.css index df7a376e..6cfc90ac 100644 --- a/client/dist/styles/bundle.css +++ b/client/dist/styles/bundle.css @@ -1 +1 @@ -.elemental-edit{display:-webkit-box;display:-webkit-flex;display:flex;color:inherit}.elemental-edit:focus,.elemental-edit:hover{text-decoration:none;color:inherit}.elemental-editor .col-EditorPreview{padding-left:0}.elemental-preview__detail{display:inline-block;margin-left:.76925rem;margin-top:1px}.elemental-preview__detail h3{font-weight:400;line-height:26px;margin:0;-webkit-font-smoothing:antialiased}.elemental-preview__detail p{-webkit-box-align:center;-webkit-align-items:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:flex;margin-bottom:0;margin-top:6px}.elemental-preview__detail small{color:#566b8d;font-size:13px}.elemental-preview__thumbnail-image{margin-right:.76925rem}.elemental-preview__thumbnail-image img{border-radius:.192rem}.elemental-preview__thumbnail-image--placeholder{border-radius:0;height:36px;margin-left:-4px}.elemental-preview__icon{color:#566b8d;display:inline-block;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;flex-direction:row;font-size:2.3rem;width:28px;vertical-align:top;margin-top:-1px}.ss-gridfield-orderable.elemental-editor .col-reorder .handle{opacity:.5;padding:22px 0 0}.ss-gridfield-orderable.elemental-editor .col-reorder .handle .icon{font-size:1.3em}.elemental-editor .ss-gridfield-item:hover .handle{opacity:1}.elemental-editor .grid-field__table{margin-bottom:12px}@media (max-width:991.98px){.elemental-editor .grid-field__table .col-EditorPreview{display:table-cell}}.elemental-report__grid-field .element-editor-header__version-state{bottom:9px;left:14px}.elemental-block__history-tab{margin-top:-1.5385rem}.cms-edit-form .fieldgroup.elemental-area__element--historic{margin-left:0;margin-right:0}.cms-edit-form .fieldgroup.elemental-area__element--historic.form-group{border-top:1px solid #dbe0e9}.cms-edit-form .fieldgroup.elemental-area__element--historic .form__field-holder{-webkit-box-flex:0;-webkit-flex:0 0 100%;flex:0 0 100%;max-width:100%}.elemental-preview{line-height:20px}.elemental-preview--historic{margin-bottom:1rem}.elemental-preview__link{float:right;margin-top:4px}div.elemental-area__element--historic.elemental-area__element--historic-inner{background:transparent;border:0;padding-left:0;padding-right:0;padding-top:1.5385rem}.elemental-area--read-only{border-bottom:1px solid #dbe0e9;margin:2.30775rem -1.5385rem}.history-viewer__version-detail fieldset{overflow:visible}.elemental-report__grid-field .ss-gridfield-item td:first-child{width:1px}.elemental-report__grid-field .col-Icon{font-size:1.5rem}.elemental-report__grid-field .element-item--draft,.elemental-report__grid-field .element-item--modified{bottom:8px;left:14px;height:6px;width:6px}.textcheckboxgroup .input-group-append .form-check-input{margin-left:0;position:relative}.elemental-editor__add-new-block-control{width:20rem}.elemental-editor__add-new-block-control a{line-height:1.85em}.element-editor__element{border-bottom:1px solid #dbe0e9;color:inherit;cursor:pointer;padding:.9231rem 1.5385rem 1.8462rem}.element-editor__element:focus,.element-editor__element:hover{-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);outline-width:0}.element-editor__element:last-child{border-bottom:0}.elemental-editor__list{background-color:#fff;border-bottom:1px solid #dbe0e9;border-top:1px solid #dbe0e9;margin-left:-1.5385rem;margin-right:-1.5385rem;min-height:6rem;position:relative}.elemental-editor__list--empty{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center}.element-editor-editform{margin-top:.76925rem;cursor:auto}.element-editor-editform--collapsed{display:none}.element-editor-header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.element-editor-header__title{font-size:15px;font-weight:400;margin:0 0 0 .76925rem;-webkit-font-smoothing:antialiased;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor-header__actions,.element-editor-header__info{-webkit-box-align:center;-webkit-align-items:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;flex-grow:1}.element-editor-header__info{max-width:calc(100% - 60px)}.element-editor-header__actions{-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.element-editor-header__actions-toggle{padding-top:3px;padding-bottom:3px}.element-editor-header__icon-container{margin-left:-2px;color:#566b8d;font-size:2.154rem;height:28px;line-height:1.5rem}.element-editor-header__expand{font-size:1.1rem;margin-left:3px;width:unset}.element-editor-header__version-state{-webkit-box-shadow:0 1px 4px rgba(0,0,0,.2);box-shadow:0 1px 4px rgba(0,0,0,.2);border:1px solid #cf3f00;border-radius:100%;bottom:6px;-webkit-box-shadow:0 0 1px .5px #fff;box-shadow:0 0 1px .5px #fff;display:block;height:8px;left:22px;position:relative;width:8px;z-index:1}.element-editor-header__version-state--draft{background-color:#fff7f0}.element-editor-header__version-state--modified{background-color:#ff7f22}.element-editor-summary{display:-webkit-box;display:-webkit-flex;display:flex;margin-top:.9231rem;margin-left:36px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.element-editor-summary__thumbnail-image{border-radius:.1536rem;height:36px;margin:-.6154rem .9231rem -.6154rem 0}.element-editor-summary__content{color:#566b8d;line-height:1.3;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor__toolbar{margin-bottom:1rem}.element-editor-add-element{min-width:320px;max-height:356px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;border-radius:.23rem;overflow-y:scroll}.element-editor-add-element:focus,.element-editor-add-element:hover{outline-width:0}.element-editor-add-element:focus,.element-editor-add-element:hover,.element-editor-add-element__button-container{-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1)}.element-editor-add-element__button-container{width:100%;padding:10px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.element-editor-add-element__button-container :nth-child(odd){margin-right:.76925rem}.element-editor-add-element__button-container :nth-child(2n){margin-right:0}.element-editor-add-element__button-container :nth-last-child(-n+2){margin-bottom:0}.element-editor-add-element__button-container .element-editor-add-element__no-results{text-align:center;vertical-align:middle;width:100%;margin:0;padding:.76925rem}.element-editor-add-element__button{width:calc(100% * 0.5 - 5px);padding:.76925rem;text-align:start;margin-bottom:4px;border:0;max-height:40px}.element-editor-add-element .element-editor-add-element__button:before{font-size:2.1rem;margin-right:.76925rem}.element-editor-add-element__search{height:52px}.element-editor-add-element__search-clear,.element-editor-add-element__search-clear:active,.element-editor-add-element__search-clear:focus,.element-editor-add-element__search-clear:hover,.element-editor-add-element__search-input,.element-editor-add-element__search-input:active,.element-editor-add-element__search-input:focus,.element-editor-add-element__search-input:hover{-webkit-box-shadow:none;box-shadow:none;border:none;border-bottom:1px solid #dbe0e9;border-radius:0;outline:none}.element-editor-add-element__search-input{padding-left:1.5385rem}.element-editor-add-element__search .input-group-append .btn-link{padding-right:1.5385rem}.element-editor-add-element__inline{z-index:1}.element-editor__add-block-area-container{height:0;display:-webkit-box;display:-webkit-flex;display:flex;width:100%;position:relative;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.element-editor__add-block-area{background-color:transparent;min-height:1.8462rem;width:100%;margin:0;padding:0;border:0;outline:0;-webkit-transition:0s;-o-transition:0s;transition:0s;display:-webkit-box;display:-webkit-flex;display:flex}.element-editor__add-block-hover-bar{-webkit-align-self:center;align-self:center;width:100%;-webkit-appearance:button;border:none;position:absolute;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.element-editor__add-block-hover-bar:before{font-size:1.5rem;background-image:-webkit-radial-gradient(#fff 50%,transparent 0);background-image:-o-radial-gradient(#fff 50%,transparent 50%);background-image:radial-gradient(#fff 50%,transparent 0);-o-transform:translateY(50%);-webkit-transform:translateY(50%);transform:translateY(-50%);position:relative;z-index:2;margin-right:.76925rem}.element-editor__add-block-hover-bar--delay{background-color:#c1cad9;max-height:3px}.element-editor__add-block-hover-bar--delay:before{color:#c1cad9}.element-editor__add-block-hover-bar--inst{background-color:#0071c4;max-height:5px}.element-editor__add-block-hover-bar--inst:before{color:#0071c4} \ No newline at end of file +.elemental-edit{display:-webkit-box;display:-webkit-flex;display:flex;color:inherit}.elemental-edit:focus,.elemental-edit:hover{text-decoration:none;color:inherit}.elemental-editor .col-EditorPreview{padding-left:0}.elemental-preview__detail{display:inline-block;margin-left:.76925rem;margin-top:1px}.elemental-preview__detail h3{font-weight:400;line-height:26px;margin:0;-webkit-font-smoothing:antialiased}.elemental-preview__detail p{-webkit-box-align:center;-webkit-align-items:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:flex;margin-bottom:0;margin-top:6px}.elemental-preview__detail small{color:#566b8d;font-size:13px}.elemental-preview__thumbnail-image{margin-right:.76925rem}.elemental-preview__thumbnail-image img{border-radius:.192rem}.elemental-preview__thumbnail-image--placeholder{border-radius:0;height:36px;margin-left:-4px}.elemental-preview__icon{color:#566b8d;display:inline-block;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;flex-direction:row;font-size:2.3rem;width:28px;vertical-align:top;margin-top:-1px}.ss-gridfield-orderable.elemental-editor .col-reorder .handle{opacity:.5;padding:22px 0 0}.ss-gridfield-orderable.elemental-editor .col-reorder .handle .icon{font-size:1.3em}.elemental-editor .ss-gridfield-item:hover .handle{opacity:1}.elemental-editor .grid-field__table{margin-bottom:12px}@media (max-width:991.98px){.elemental-editor .grid-field__table .col-EditorPreview{display:table-cell}}.elemental-report__grid-field .element-editor-header__version-state{bottom:9px;left:14px}.elemental-block__history-tab{margin-top:-1.5385rem}.cms-edit-form .fieldgroup.elemental-area__element--historic{margin-left:0;margin-right:0}.cms-edit-form .fieldgroup.elemental-area__element--historic.form-group{border-top:1px solid #dbe0e9}.cms-edit-form .fieldgroup.elemental-area__element--historic .form__field-holder{-webkit-box-flex:0;-webkit-flex:0 0 100%;flex:0 0 100%;max-width:100%}.elemental-preview{line-height:20px}.elemental-preview--historic{margin-bottom:1rem}.elemental-preview__link{float:right;margin-top:4px}div.elemental-area__element--historic.elemental-area__element--historic-inner{background:transparent;border:0;padding-left:0;padding-right:0;padding-top:1.5385rem}.elemental-area--read-only{border-bottom:1px solid #dbe0e9;margin:2.30775rem -1.5385rem}.history-viewer__version-detail fieldset{overflow:visible}.elemental-report__grid-field .ss-gridfield-item td:first-child{width:1px}.elemental-report__grid-field .col-Icon{font-size:1.5rem}.elemental-report__grid-field .element-item--draft,.elemental-report__grid-field .element-item--modified{bottom:8px;left:14px;height:6px;width:6px}.textcheckboxgroup .input-group-append .form-check-input{margin-left:0;position:relative}.elemental-editor__add-new-block-control{width:20rem}.elemental-editor__add-new-block-control a{line-height:1.85em}.element-editor__element{border-bottom:1px solid #dbe0e9;color:inherit;cursor:pointer;padding:.9231rem 1.5385rem 1.8462rem}.element-editor__element:focus,.element-editor__element:hover{-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);outline-width:0}.element-editor__element:last-child{border-bottom:0}.elemental-editor__list{background-color:#fff;border-bottom:1px solid #dbe0e9;border-top:1px solid #dbe0e9;margin-left:-1.5385rem;margin-right:-1.5385rem;min-height:6rem;position:relative}.elemental-editor__list--empty{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center}.element-editor-editform{margin-top:.76925rem;cursor:auto}.element-editor-editform--collapsed{display:none}.element-editor-header{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.element-editor-header__title{font-size:15px;font-weight:400;margin:0 0 0 .76925rem;-webkit-font-smoothing:antialiased;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor-header__actions,.element-editor-header__info{-webkit-box-align:center;-webkit-align-items:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;flex-grow:1}.element-editor-header__info{max-width:calc(100% - 60px)}.element-editor-header__actions{-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.element-editor-header__actions-toggle{padding-top:3px;padding-bottom:3px}.element-editor-header__icon-container{margin-left:-2px;color:#566b8d;font-size:2.154rem;height:28px;line-height:1.5rem}.element-editor-header__expand{font-size:1.1rem;margin-left:3px;width:unset}.element-editor-header__version-state{-webkit-box-shadow:0 1px 4px rgba(0,0,0,.2);box-shadow:0 1px 4px rgba(0,0,0,.2);border:1px solid #cf3f00;border-radius:100%;bottom:6px;-webkit-box-shadow:0 0 1px .5px #fff;box-shadow:0 0 1px .5px #fff;display:block;height:8px;left:22px;position:relative;width:8px;z-index:1}.element-editor-header__version-state--draft{background-color:#fff7f0}.element-editor-header__version-state--modified{background-color:#ff7f22}.element-editor-summary{display:-webkit-box;display:-webkit-flex;display:flex;margin-top:.9231rem;margin-left:36px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.element-editor-summary__thumbnail-image{border-radius:.1536rem;height:36px;margin:-.6154rem .9231rem -.6154rem 0}.element-editor-summary__content{color:#566b8d;line-height:1.3;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor__toolbar{margin-bottom:1rem}.element-editor-add-element{min-width:320px;max-height:356px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;border-radius:.23rem;overflow-y:scroll}.element-editor-add-element:focus,.element-editor-add-element:hover{outline-width:0}.element-editor-add-element:focus,.element-editor-add-element:hover,.element-editor-add-element__button-container{-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1)}.element-editor-add-element__button-container{width:100%;padding:10px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.element-editor-add-element__button-container :nth-child(odd){margin-right:.76925rem}.element-editor-add-element__button-container :nth-child(2n){margin-right:0}.element-editor-add-element__button-container :nth-last-child(-n+2){margin-bottom:0}.element-editor-add-element__button-container .element-editor-add-element__no-results{text-align:center;vertical-align:middle;width:100%;margin:0;padding:.76925rem}.element-editor-add-element__button{width:calc(100% * 0.5 - 5px);padding:.76925rem;text-align:start;margin-bottom:4px;border:0;max-height:40px}.element-editor-add-element .element-editor-add-element__button:before{font-size:2.1rem;margin-right:.76925rem}.element-editor-add-element__search{height:52px}.element-editor-add-element__search-clear,.element-editor-add-element__search-clear:active,.element-editor-add-element__search-clear:focus,.element-editor-add-element__search-clear:hover,.element-editor-add-element__search-input,.element-editor-add-element__search-input:active,.element-editor-add-element__search-input:focus,.element-editor-add-element__search-input:hover{-webkit-box-shadow:none;box-shadow:none;border:none;border-bottom:1px solid #dbe0e9;border-radius:0;outline:none}.element-editor-add-element__search-input{padding-left:1.5385rem}.element-editor-add-element__search .input-group-append .btn-link{padding-right:1.5385rem}.element-editor-add-element__inline{z-index:1}.element-editor__add-block-area-container{height:0;display:-webkit-box;display:-webkit-flex;display:flex;width:100%;position:relative;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.element-editor__add-block-area{background-color:transparent;min-height:1.8462rem;width:100%;margin:0;padding:0;border:0;outline:0;-webkit-transition:0s;-o-transition:0s;transition:0s}.element-editor__add-block-hover-bar{-webkit-align-self:center;align-self:center;width:100%;-webkit-appearance:button;border:none;position:absolute;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;padding:0;top:50%;-webkit-transform:translateY(-66%);-o-transform:translateY(-66%);transform:translateY(-66%)}.element-editor__add-block-hover-bar:before{font-size:1.5rem;background-image:-webkit-radial-gradient(#fff 50%,transparent 0);background-image:-o-radial-gradient(#fff 50%,transparent 50%);background-image:radial-gradient(#fff 50%,transparent 0);-webkit-transform:translateY(-35%);-o-transform:translateY(-35%);transform:translateY(-35%);position:relative;z-index:2;margin-right:.76925rem;display:block;height:1em}.element-editor__add-block-hover-bar--delay{background-color:#c1cad9;max-height:3px}.element-editor__add-block-hover-bar--delay:before{-webkit-transform:translateY(calc(1.5px + -50%));-o-transform:translateY(calc(1.5px + -50%));transform:translateY(calc(1.5px + -50%));color:#c1cad9}.element-editor__add-block-hover-bar--inst{background-color:#0071c4;max-height:5px}.element-editor__add-block-hover-bar--inst:before{-webkit-transform:translateY(calc(2.5px + -50%));-o-transform:translateY(calc(2.5px + -50%));transform:translateY(calc(2.5px + -50%));color:#0071c4} \ No newline at end of file diff --git a/client/src/components/ElementEditor/HoverBar.scss b/client/src/components/ElementEditor/HoverBar.scss index 31756818..a1a1a58a 100644 --- a/client/src/components/ElementEditor/HoverBar.scss +++ b/client/src/components/ElementEditor/HoverBar.scss @@ -15,7 +15,6 @@ border: 0; outline: 0; transition: 0s; - display: flex; } .element-editor__add-block-hover-bar { @@ -26,18 +25,21 @@ position: absolute; display: flex; justify-content: flex-end; + padding: 0; + top: 50%; + transform: translateY(-66%); &:before { font-size: 1.5rem; background-image: radial-gradient(#fff 50%, transparent 50%); - -moz-transform: translateY(50%); - -o-transform: translateY(50%); - -webkit-transform: translateY(50%); - transform: translateY(-50%); + // Fallback for IE11 & other browsers that don't support the calc() below + transform: translateY(-35%); // position plus 'button' to be able to modify it's z-index position: relative; z-index: 2; margin-right: $panel-padding-x/2; + display: block; + height: 1em; } &--delay { @@ -45,6 +47,7 @@ max-height: 3px; &:before { + transform: translateY(calc((3px/2) + -50%)); color: $border-color-dark; } } @@ -54,6 +57,7 @@ max-height: 5px; &:before { + transform: translateY(calc((5px/2) + -50%)); color: $component-active-bg; } }