Changes to member-grid

Hi @roberton1973

Sorry for the late response. You can try this members-grid.php template. It has your requested changes. Just add the file to your theme folder e.g. /wp-content/themes/your-theme/ultimate-member/members-grid.php

https://drive.google.com/file/d/17aaWw_N6u5seHV_GHT9DnCSvTCttN6Uk/view?usp=sharing

Regards,

Hi.
First of all happy new year and thanks like always for your great support ??

In this case we are almost there… i see the write “more…” and the gear, but

1. The gear is still appearing as a button, i would like to appear like in the profile a little bigger and also more distanced from the name i would say in the right corner under the cover photo in the card

2. Clicking on “more…”, the hidden text is still exit from the card, I wish instead that the card is adapting on how much is long the text plus the space for “less..”

Thanks again

Hi @roberton1973

Could you please provide screenshots for issues #1 and #2 that you’re seeing?

Regards,

Hi.

Its seems that today is the screenshot-day ??

Here is the link. Thaknk you again for your support and patience ??

Cards in member

Hi @roberton1973

It looks like the issue is with your theme, that’s why it shows scrollbar when the texts are overflowing. Could you please try using a default WP theme such as 2020 or 2021? Let’s see if this is an issue with your current theme.

Regards,

Hi.

Yes changing the theme solve the point 2, but only because the additional css is emty. it seeems that there is something in my personalized css that making some disasters there:

#page-content{
	max-width:100%;
	background:#feeeff !important;
	
}

.tabbed-style #secondary .widget-title::before {
		border-color: white white white white !important;	
	}

.widget {
    margin: 0 0 43px;
        margin-bottom: 43px;
    background: #fff;
	border-bottom: solid 3px #9A11E0;
}

.post-item-wrapper .featured-image img {
    width: 100%;
    padding-bottom: 0px;
}

.col-lg-6 {
    width: 100%;
 }

.single .post-categories a, .single .byline a {
    color: #fff !important;
}

.post-item-wrapper .featured-image img {
    width: 100%;
    height: 50% !important;
}

.btn {
    margin-left:0.5% !important;
	margin-bottom:15px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    border: 1px solid;
    border-radius: 0px;
	border-color:black;
	
    padding: 10px 20px;
    color: #9A11E0;
    background-color: transparent;
    font-weight: 400;
	color:BLACK !important;
	
	
}

.btn:hover{
	background:#9a11e0
		!important;
		color:WHITE !important;

}

.btn:[custom-layout id='5776'] 

.entry-title{
	font-size:1rem !important;
	text-transform:uppercase !important;
	margin-left:1% !important;
}

.entry-meta{
	font-size:0.7rem!important;
	/*border: 1px solid !important;*/
	background: #9A11E0; !important;
	font-weight:800 !important;
		margin-bottom: -1px !important;
}

.post-categories a{
	color: white !important;

}

.entry-content{
	font-size:1rem!important;
	height	:60px !important;
	margin-left:1% !important;

}

.entry-container{
	background:white !important;
	border:1px solid
}

.widget-title {
	font-size:1rem !important;
	text-transform:uppercase !important;
	border-bottom: solid 3px lightgray;
}

body.custom-background {
	background:#feeeff !important;
	font-family: verdana !important;
}

a.um-button {
	background: #9a11e0 !important;
	font-family: Verdana !important;
}
#inner-content-wrapper.container.page-section {
	background: #feeeff !important;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-members-edit-btn a.um-edit-profile-
btn {
    padding: 8px 10px !important;
    transition: none !important;
    display: inline-block !important;
    margin: 0 auto !important;
    min-width: 110px; !important;
    width: auto !important;
    text-align: center !important;
    font-size: 12px!important;
}
.um-directory .um-members-wrapper .um-member .um-button {
    margin-top: 20px !important;
	margin:auto !important;

		height:42px !important;
	width: auto !important;
}
.elementskit-submenu-panel{
	
	background:#feeeff !important;
	
}

.um-member-directory .
/*
* CSS code for WordPress Login, Signup Page Design Tutorial.
* Author: WP Academy
& Tutorial Link: 
*/
.wpac-custom-login-form #um-submit-btn , .wpac-custom-signup-form #um-submit-btn {
	background: #9a11e0 !important;
	margin-top: 15px;
	border-radius: 0px !important;
	width: 100% !important;
}
.wpac-custom-signup-form #um-submit-btn {
	width: 100% !important;
	background: #9a11e0 !important;
	margin-top: 15px !important;

}
.wpac-custom-login-form .um .um-form input[type=text], .wpac-custom-login-form .um .um-form input[type=tel], .wpac-custom-login-form .um .um-form input[type=password], .wpac-custom-login-form .um .um-form textarea {
	border: none !important;
	border-bottom: 3px solid #ccc !important;
	padding: 20px 20px 20px 40px !important;
	transition: 0.5s all;
}
.wpac-custom-login-form .um .um-form input[type=text]:focus, .wpac-custom-login-form .um .um-form input[type=password]:focus, .wpac-custom-login-form .um .um-form textarea:focus {
	border: none !important;
	border-bottom: 3px solid !important;
}
.wpac-custom-signup-form .um .um-form input[type=text], .wpac-custom-signup-form .um .um-form input[type=tel], .wpac-custom-signup-form .um .um-form input[type=password], .wpac-custom-signup-form .um .um-form textarea {
	border: none !important;
	border-bottom: 3px solid #ccc !important;
	padding: 10px 20px 10px 20px !important;
	transition: 0.5s all;
}
.wpac-custom-signup-form .um .um-form input[type=text]:focus, .wpac-custom-signup-form .um .um-form input[type=tel]:focus, .wpac-custom-signup-form .um .um-form input[type=password]:focus, .wpac-custom-signup-form .um .um-form textarea:focus {
	border-bottom: 3px none #242A56 !important;
}
.wpac-custom-signup-form .um-field-label {
	margin-bottom: 0 !important;
}

.um-directory .um-button {
	color: #fff !important;

}

.um-directory .um-members-wrapper  .um-members .um-member {
	border: 1px solid gray !important; 
height:456px !important;	
	margin-bottom:20px !important;
}

.um-directory .um-members-wrapper  {
		color: #000 !important;

}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-members-edit-btn {
    margin: -40px 10px !important;
    height: 70px !important;
	margin-top: 195px !important;
	margin-right: -50% !important;
	margin-left: -50% !important;
	margin-top:180px !important;
}

.um-member-cover {
	height:35% !important; 
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member.with-cover .um-member-photo a img {
    width: 125px !important;
    height: 125px !important;
    position: relative;
    top: -150px !important;
    margin-bottom: -90px !important;
    float: none;
    opacity: 1;
}

.um-directory .um-members-wrapper .um-members .um-member .um-member-card .um-member-name a {
    display: flex !important;
    flex-direction: row;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    margin-top: -60px !important;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-members-edit-btn a.um-edit-profile-btn {
    transition: none !important;
    display: inline-block !important;
    margin: 0 auto !important;
        margin-top: -10px !important;
        margin-right: 10px !important;
        margin-bottom: 0px;
    width:130px !important;
}
.um-member-tagline-AstroProfil{
	overflow-y: scroll !important; height:160px !important;
	margin-top:15px; !important;
color:#000 !important;
text-align: justify !important;
}

.um-member-tagline-DatumR{
	margin-top:-292px!important;
	color:#000 !important
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-members-edit-btn a.um-edit-profile-btn::before {
    font-family: FontAwesome;
    margin-right: 8px !important;
    width: 8px !important;
    text-align: left;
    display: inline-block;
    font-size: 16px;
    position: relative;
    left: 0;
    top: 1px !important;
    content: "\f013";
	color: #fff !important;
}

this is all my personalized css. if i take it out completely, the point 2 it works.

Thanks

Hi @roberton1973

This is the line that adds the scroll:

.um-member-tagline-AstroProfil{
	overflow-y: scroll !important; height:160px !important;
	margin-top:15px; !important;
color:#000 !important;
text-align: justify !important;
}

Try commenting out this line:
overflow-y: scroll !important; height:160px !important;

Regards

Hey there!

This thread has been inactive for a while so we’re going to go ahead and mark it Resolved.

Please feel free to re-open this thread by changing the Topic Status to ‘Not Resolved’ if any other questions come up and we’d be happy to help. ??

Regards,