Css Style Portfolio grid

Dear Andrea,

Thanks for using the Portfolio Manager.
What you need can definitely be done by adding some custom CSS in the Plugin’s CSS.

Please wait while I prepare the CSS for you.

Thanks, you are the best.

Dear Andrea,

Please follow these steps:

1. Go to Portfolio Manager > Settings > Advanced Tab > Custom CSS Box

2. Paste the folloiwng CSS:

.eds-bpm-view{
	overflow: visible;
	box-shadow: none;
	height: 330px !important;
}
.eds-bpm-view, .eds-bpm-view img{
	width: 320px;
	height: 230px;
	transition: all 0s linear !important;
}
.isotope-item{
	width: 320px;
	height: 330px;
}
.eds-bpm-view .eds-bpm-mask{
	width: 320px;
	height: 330px;
	top: 0;
	padding-top: 230px;
	opacity: 1 !important;
	background-color: transparent !important;
}
.eds-bpm-view .eds-bpm-view-heading{
	transform: translateY(0) !important;
	opacity: 1 !important;
	padding: 5px !important;
	text-align: left;
	font-family: 'Montserrat';
	font-size: 28px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -1px;
	margin-top: 10px;
	margin-bottom: 40px;
	text-decoration: underline;
	background: transparent;
}
.eds-bpm-view:hover .eds-bpm-view-heading{
	color: #d5d822;
}
.eds-bpm-view .eds-bpm-view-para{
	transform: translateY(0) !important;
	opacity: 1 !important;
	color: #939aa5;
	text-align: left;
	font-style: normal;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0px;
	margin-top: 10px !important;
	margin-bottom: 15px;
	text-transform: uppercase;
}
.eds-bpm-view a.eds-bpm-info{
	opacity: 0 !important;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 !important;
	width: 100%;
	height: 100%;
	min-height: 355px;
	z-index: 9999999;
}
.mosaic-view-one .eds-bpm-view-first:hover img{
	transform: scale(1) !important;
}

3. Save

This should make the look of the projects similar to
https://www.andreaverzola.com/project

Please let me know if this works.

Oh and you can check the demo of this CSS in action here:
https://bpmdemo.cloudaccess.host/

thank you so much! I ask you the last thing! By activating the plugin I lose the formatting of posts within the blog, you can see an example here https://www.andreaverzola.com/guida-definitiva-alla-macchina-fotografica-le-vacanze/.

The text goes wide, the column is narrower if you disable the plugin, I think it overwrites the theme css

thank you so much
Andrea

Yes that’s a CSS conflict.

Please add the following CSS to the bottom of previously posted CSS:

.body-width-unlimited div.section.sub div[class*="entry-"]{
	max-width: 900px !important;
}

This should resolve the issue

I’m sorry but unfortunately it does not work

I do not see the applied on the page:
https://www.andreaverzola.com/guida-definitiva-alla-macchina-fotografica-le-vacanze/

Could you please double check that you pasted it at the bottom of
Portfolio Manager > Settings > Advanced Tab > Custom CSS Box

so just below:
.mosaic-view-one .eds-bpm-view-first:hover img{
transform: scale(1) !important;
}

in Custom CSS box.

I checked and pasted into his box but it does not seem to go..

Narrows the column of the single portfolio but not the text of the post
https://www.andreaverzola.com/portfolio-behance/bproject/occhialeria-artigiana-quando-larte-supera-la-moda/

• This reply was modified 7 years, 3 months ago by andreave89.

Dear Andrea,
Lets try this one more time

1. Go to Portfolio Manager > Settings > Advanced Tab > Custom CSS Box

2. Delete all the CSS added and paste the following CSS:

.eds-bpm-view{
	overflow: visible;
	box-shadow: none;
	height: 330px !important;
}
.eds-bpm-view, .eds-bpm-view img{
	width: 320px;
	height: 230px;
	transition: all 0s linear !important;
}
.isotope-item{
	width: 320px;
	height: 330px;
}
.eds-bpm-view .eds-bpm-mask{
	width: 320px;
	height: 330px;
	top: 0;
	padding-top: 230px;
	opacity: 1 !important;
	background-color: transparent !important;
}
.eds-bpm-view .eds-bpm-view-heading{
	transform: translateY(0) !important;
	opacity: 1 !important;
	padding: 5px !important;
	text-align: left;
	font-family: 'Montserrat';
	font-size: 28px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -1px;
	margin-top: 10px;
	margin-bottom: 40px;
	text-decoration: underline;
	background: transparent;
}
.eds-bpm-view:hover .eds-bpm-view-heading{
	color: #d5d822;
}
.eds-bpm-view .eds-bpm-view-para{
	transform: translateY(0) !important;
	opacity: 1 !important;
	color: #939aa5;
	text-align: left;
	font-style: normal;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0px;
	margin-top: 10px !important;
	margin-bottom: 15px;
	text-transform: uppercase;
}
.eds-bpm-view a.eds-bpm-info{
	opacity: 0 !important;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 !important;
	width: 100%;
	height: 100%;
	min-height: 355px;
	z-index: 9999999;
}
.mosaic-view-one .eds-bpm-view-first:hover img{
	transform: scale(1) !important;
}
.entry-content{
    max-width: 900px !important;
}

Let me know if this works.

• This reply was modified 7 years, 3 months ago by eleopard.

Please add

.entry-content{
    max-width: 900px !important;
}

to your theme’s style.css

You can do this by going to
Appearance > Editor
and selecting style.css from the right.

Let me know if this works.

Nothing to do, maybe on the upcoming update of the plugin try to verify this conflict that can help other users!

Dear Andrea,

We’ll definitely take care of this in the upcoming update.

But this issue can be fixed on your end right away.
Do you remember anywhere in the Crush theme that you are using, there is a section to add custom CSS? If so just add

.entry-content{
    max-width: 900px !important;
}

to it and the post content should load fine.

Generally all the themes come with section to add custom CSS.

I have tried to add it, https://www.andreaverzola.com/portfolio-behance/ the problem is that it strikes me as a result also this page