Hide preview in campaigns, override list styles for mobile

This commit is contained in:
Paul Clarke 2016-10-28 10:32:31 +13:00
parent 4373eb6801
commit 71a4eb7d22
6 changed files with 33 additions and 18 deletions

View File

@ -2477,7 +2477,7 @@ key:"componentDidMount",value:function n(){var e=this.props.itemListViewEndpoint
f(t.prototype.__proto__||Object.getPrototypeOf(t.prototype),"componentDidMount",this).call(this),this.setBreadcrumbs(),Object.keys(this.props.record).length||this.props.recordActions.fetchRecord(this.props.treeClass,"get",e).then(this.setBreadcrumbs)
}},{key:"setBreadcrumbs",value:function i(){if(this.props.record){var e=[{text:$["default"]._t("Campaigns.CAMPAIGN","Campaigns"),href:this.props.sectionConfig.url}]
e.push({text:this.props.record.Name,href:this.props.sectionConfig.url+"/set/"+this.props.campaignId+"/show"}),this.props.breadcrumbsActions.setBreadcrumbs(e)}}},{key:"render",value:function r(){var e=this,t=this.props.campaign.changeSetItemId,n=null,i=t?"":"campaign-admin__campaign--no-selected-item",r=this.props.campaignId,o=this.props.record,a=this.groupItemsForSet(),s=[]
e.push({text:this.props.record.Name,href:this.props.sectionConfig.url+"/set/"+this.props.campaignId+"/show"}),this.props.breadcrumbsActions.setBreadcrumbs(e)}}},{key:"render",value:function r(){var e=this,t=this.props.campaign.changeSetItemId,n=null,i=t?"":"campaign-admin__campaign--hide-preview",r=this.props.campaignId,o=this.props.record,a=this.groupItemsForSet(),s=[]
Object.keys(a).forEach(function(i){var l=a[i],u=l.items.length,c=[],d=u+" "+(1===u?l.singular:l.plural),f="Set_"+r+"_Group_"+i
@ -2597,7 +2597,7 @@ return this.props.itemLinks&&this.props.itemLinks.edit&&(i=this.props.itemLinks.
className:"btn__title"},d["default"]._t("Preview.EDIT","Edit"))))),e=this.props.itemId?t?n&&0===n.indexOf("image/")?u["default"].createElement("div",{className:"preview__file-container panel--scrollable"
},u["default"].createElement("img",{alt:t,className:"preview__file--fits-space",src:t})):u["default"].createElement("iframe",{className:"flexbox-area-grow preview__iframe",src:t}):u["default"].createElement("div",{
className:"preview__overlay"},u["default"].createElement("h3",{className:"preview__overlay-text"},"There is no preview available for this item.")):u["default"].createElement("div",{className:"preview__overlay"
},u["default"].createElement("h3",{className:"preview__overlay-text"},"No preview available.")),u["default"].createElement("div",{className:"flexbox-area-grow fill-height preview"},e,u["default"].createElement("div",{
className:"toolbar toolbar--south"},u["default"].createElement("button",{className:"btn btn-secondary font-icon-left-open-big toolbar__back-button hidden-lg-up",type:"button",onClick:this.handleBackClick
},"Back"),u["default"].createElement("div",{className:"btn-toolbar"},o)))}}]),t}(p["default"])
},u["default"].createElement("h3",{className:"preview__overlay-text"},"No preview available.")),u["default"].createElement("div",{className:"flexbox-area-grow fill-height preview campaign-admin__campaign-preview"
},e,u["default"].createElement("div",{className:"toolbar toolbar--south"},u["default"].createElement("button",{className:"btn btn-secondary font-icon-left-open-big toolbar__back-button hidden-lg-up",type:"button",
onClick:this.handleBackClick},"Back"),u["default"].createElement("div",{className:"btn-toolbar"},o)))}}]),t}(p["default"])
h.propTypes={itemLinks:u["default"].PropTypes.object,itemId:u["default"].PropTypes.number,onBack:u["default"].PropTypes.func},t["default"]=h}])

View File

@ -15965,7 +15965,7 @@ body,html{
}
@media (max-width:991px){
.cms-content.has-panel .cms-content-tools{
.CMSPageEditController.has-panel .cms-content-tools,.CMSPageSettingsController.has-panel .cms-content-tools{
display:none;
}
}
@ -16052,13 +16052,20 @@ body,html{
}
@media (max-width:991px){
.campaign-admin__campaign--no-selected-item .preview{
.campaign-admin__campaign.campaign-admin__campaign--hide-preview .campaign-admin__campaign-preview{
display:none;
}
.campaign-admin__campaign--no-selected-item .list-group-item.active{
background-color:inherit;
color:inherit;
.campaign-admin__campaign .list-group-item.active{
background-color:#fff;
color:#4f5861;
z-index:0;
}
.campaign-admin__campaign .list-group-item.active:hover{
background-color:#f5f5f5;
color:#4f5861;
border-color:#ddd;
}
}

View File

@ -34,7 +34,7 @@
color: $white;
opacity: 1;
}
}
}
}
.list-group-item-heading {

View File

@ -75,7 +75,7 @@ class Preview extends SilverStripeComponent {
// Combine elements
return (
<div className="flexbox-area-grow fill-height preview">
<div className="flexbox-area-grow fill-height preview campaign-admin__campaign-preview">
{body}
<div className="toolbar toolbar--south">
<button

View File

@ -2,19 +2,27 @@
.campaign-admin__campaign {
position: relative;
height: 100%;
}
@include media-breakpoint-down(md) {
.campaign-admin__campaign--no-selected-item {
.preview {
// On smaller screens hide the preview and show list of items with nothing selected
@include media-breakpoint-down(md) {
&.campaign-admin__campaign--hide-preview .campaign-admin__campaign-preview {
display: none;
}
.list-group-item.active {
background-color: inherit;
color: inherit;
background-color: $list-group-bg;
color: $list-group-link-color;
z-index: 0;
&:hover {
background-color: $list-group-hover-bg;
color: $list-group-link-color;
border-color: $list-group-border-color;
}
}
}
}
.campaign-admin__campaign-items {
width: 100%;
z-index: 1;

View File

@ -73,7 +73,7 @@ class CampaignAdminList extends SilverStripeComponent {
render() {
let itemId = this.props.campaign.changeSetItemId;
let itemLinks = null;
const selectedClass = (!itemId) ? 'campaign-admin__campaign--no-selected-item' : '';
const selectedClass = (!itemId) ? 'campaign-admin__campaign--hide-preview' : '';
const campaignId = this.props.campaignId;
const campaign = this.props.record;