Viewing 15 replies - 1 through 15 (of 18 total)
  • Plugin Author eleopard

    (@eleopard)

    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.

    Thread Starter andreave89

    (@andreave89)

    Thanks, you are the best.

    Plugin Author eleopard

    (@eleopard)

    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
    http://www.andreaverzola.com/project

    Please let me know if this works.

    Plugin Author eleopard

    (@eleopard)

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

    Thread Starter andreave89

    (@andreave89)

    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 http://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

    Plugin Author eleopard

    (@eleopard)

    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

    Thread Starter andreave89

    (@andreave89)

    I’m sorry but unfortunately it does not work

    Plugin Author eleopard

    (@eleopard)

    I do not see the applied on the page:
    http://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.

    Thread Starter andreave89

    (@andreave89)

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

    Thread Starter andreave89

    (@andreave89)

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

    • This reply was modified 7 years, 4 months ago by andreave89.
    Plugin Author eleopard

    (@eleopard)

    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, 4 months ago by eleopard.
    Plugin Author eleopard

    (@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.

    Thread Starter andreave89

    (@andreave89)

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

    Plugin Author eleopard

    (@eleopard)

    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.

    Thread Starter andreave89

    (@andreave89)

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

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Css Style Portfolio grid’ is closed to new replies.