Change colors

[jenny555]

First of all, I still would like to congratulate you on your great work!
I meet some difficulties to change the colors of a few elements and their location. I tried to compile my questions for not open too many topics.
here are my questions:

Page members: (attachment 1)

1) I managed to put a grayblack background to the first member card, but how to apply the background to all cards / columns?
2) how to display 4 or 5 columns instead of three?
3) how to align columns? because they are displaced.
4) how to display “years old” (“ans” in french) after the date of birth? (ex: 35 ans)
5) how to add the text “i’m looking …”

Profile page (Attachment 2 and 2a)

1) I would like to change the background for the tabs, buttons and fields but I can not.
2) I have six tabs to display (in the image, the tab rtmedia does not appear because I did not have any media) … my question is: can we display them on a single line, because it is not pretty like that.
3) I installed “rating widget” plugin, and I would like to see the stars below the photo and not above. Is it possible to display the votes also in the members cards? can you help me do that?
all my other questions are on the attached files.

I will be very grateful for your help!

[jenny555]

The attachment here… Thanks

[Laura]

Hello, could you share a link and admin credentials? 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jenny555]

Hi Laura,

admin link

id: laura
password: laura987

style.css :

COPY CODE

/*
Theme Name:     Sweetdate Child
Theme URI:
Description:    Child theme for Sweetdate
Author:         SeventhQueen
Author URI:     http://seventhqueen.com
Template:       sweetdate
Tags: dating, clean, responsive, creative, minimal, modern, landing page, social, buddypress,bbpress, woocommerce
License: GNU General Public License
License URI: license.txt
*/
@import url("../sweetdate/style.css");

/*
* Please add your custom styles below
*/
.sticky.fixed {
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.77);
    height: 43px;
    padding-top: 3px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
ul#menu-sweetdate a {
    color: #C79F4B !important;
	
}
ul#menu-sweetdate a:hover {
    color: white !important;
}

#breadcrumbs-wrapp a: hover {
    color: #000;
}

#call-to-actions .alert {
    background-color: #101010;
    border: 1px solid #101010;
}

#call-to-actions .alert a:hover{
    background-color: #C79F4B;
    border: 1px solid #C79F4B;
}

.form-footer {
    color: #D1A14F;
    padding: 20px 20px 10px;
    border-left: 10px solid #D1A14F;
    border-bottom: 10px solid #D1A14F;
    border-right: 10px solid #D1A14F;
    background-color: #1A1A1A;
}

.search-item .author {
    background-color: #C79F4B;
}

.search-item .date, .search-item .date a {
    height: 26px;
    overflow: hidden;
    color: #C79F4B;
    font-style: inherit;
    font-weight: bold;
	background-color: #303133;
}
.search-item .search-body {
    height: 60px;
    margin-bottom: 10px;
    overflow: hidden;
    text-align: justify;
    color: #737272;
}

.search-item {
    border: 1px solid #e5e5e5;
    list-style: none;
    text-align: center;
    margin-top: 100px;
    background-color: #fff;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    width: 250px;
}

.four, .row .four {
    /* width: 33.33333%; */
   
    /* clear: left; */
    /* background-color: #303131; */
    width: 250px;
    padding-left: 0px;
    padding-right: 0px;
    border-radius: 5px;
    margin-right: 15px;
    /* padding-top: 10px; */
}
.bp-member-dir-buttons {
    margin-bottom: 0px;
    height: 35px;
    background: #d4d9dd;
    background-image: initial;
    background-position-x: initial;
    background-position-y: initial;
    background-size: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: rgb(212, 217, 221);
    margin-top: 0px;
    text-align: center;
}

#members-list .four.columns:nth-child(3n+1) {
    clear: left;
    background-color: #303131;
    width: 250px;
    padding-left: 0px;
    padding-right: 0px;
	border-radius: 5px;
}
/*
background: rgba(14, 103, 143, 0.17);
*/
/* Search Box Borders Color */

.form-search {
border-left: 10px solid #C79F4B !important;
border-right: 10px solid #C79F4B !important;
}
/* Form Background color */
.form-search, .form-header, div.alert-box, div.pagination span.current {
background: rgba(0, 0, 0, 0) !important;
}
.form-search .notch {
    border-top: 10px solid #202020 !important;
}
.form-header {
    border-left: 10px solid rgb(209, 161, 79) !important;
    border-top: 10px solid rgb(199, 159, 75)!important; 
    border-right: 10px solid rgb(199, 159, 75) !important;
}
.form-footer {
    color: #D1A14F !important;
  
    border-left: 10px solid #D1A14F !important;
    border-bottom: 10px solid #D1A14F !important;
    border-right: 10px solid #D1A14F !important;
    background-color: #151515 !important;
}
/*footer*/

#footer hr {
    border: solid #fff;
    border-width: 1px 0 0;
}

.latest-blog span.avatar {
 
    background: rgb(199, 159, 75);
}
#footer h5 {
    color: #C79F4B;
    margin-bottom: 20px;
}

/*profil rounded avatar*/
#profile #item-header-avatar .avatar {
    border: 6px solid;
    width: 100%;
    border-radius: 100%;
}

#header {
    padding-top: 20px;
    padding-bottom: 10px;
    margin: 0 auto;
    /* background-color: #35406B; */
   background: #232323;;
   
}

#breadcrumbs-wrapp {
    background: #3C5C8D;
}

ul.rtm-activity-media-list .rtmedia-list-item.media-type-photo a, ul.rtm-activity-media-list .rtmedia-list-item.media-type-photo .rtmedia-item-thumbnail, ul.rtm-activity-media-list .rtmedia-list-item.media-type-photo .rtmedia-item-thumbnail img {
    max-width: 100% !important;
    max-height: none !important;
    width: 100%;
    padding: 0px !important;
    margin: 0px !important;
    display: block;
}

.top-links {
    
    border-bottom: 1px solid #C79F4B;
   
}
div#message.updated p {
    background-color: #C79F4B;
    border-color: #C79F4B;
    color: #000000;
}
.activity-list .activity-content .activity-header, .activity-list .activity-content .comment-header {
    color: #C79F4B;
    font-size: 11px;
    line-height: 220%;
}
#footer h5 {
    color: #C79F4B;
    margin-bottom: 20px;
}

.regulartab dd {
    background: rgba(15, 15, 15, 0.63);
    color: #ffffff;
}

.circular-item .hearts {
    background: url(http://www.speedmazal.com/wp-content/uploads/2015/08/coeurs.png) no-repeat !important;
    display: block;
    width: 39px;
    height: 30px;
    position: absolute;
    right: 0;
    top: -20px;
}

#profile .generic-button a, .tabs.pill.custom dd:not(.active) a, #profile .callout, .regulartab dt, .regulartab dd {
    background: rgba(15, 15, 15, 0.65);
    color: #ffffff;
}

.dl-horizontal dt {
    float: left;
    width: 160px;
    line-height: 2.3em;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: bold;
    background: rgba(15, 15, 15, 0.65);
}

functions.php

COPY CODE

<?php
/**
 * @package WordPress
 * @subpackage Sweetdate
 * @author SeventhQueen <themesupport@seventhqueen.com>
 * @since Sweetdate 1.0
 */

/**
 * Sweetdate Child Theme Functions
 * Add extra code or replace existing functions
*/ 
//Avatar default
add_filter( 'bp_core_fetch_avatar_no_grav', '__return_true' );
	function myavatar_add_default_avatar( $url )
	{
		global $bp;
		$gender = xprofile_get_field_data('Je suis un(e)', bp_get_member_user_id());
		if ($gender == "Homme") {
			return $img_url = '/wp-content/uploads/2015/08/man-avatars.jpg';
		}
		else {
			return $img_url ='/wp-content/uploads/2015/08/woman-avatars.jpg';
		}
	}
	add_filter( 'bp_core_mysteryman_src', 'myavatar_add_default_avatar' );
	add_filter( 'bp_core_default_avatar_user', 'myavatar_add_default_avatar' );
	
	

//manual total members
	add_filter( 'bp_get_total_member_count', 'kleo_my_total_members' );
function kleo_my_total_members($number) {
	$number = str_replace(".","",$number);
	return 1284;
}
//manual number online members
add_filter( 'kleo_online_users_count', 'kleo_my_online_users', 10, 2);
function kleo_my_online_users($number, $value) {
	switch ($value) {
		//ALL MEMBERS ONLINE
		case FALSE:
			return '195';
			break;

		case "Woman":
			return $number+51;
			break;
		
		case "Man":
			return $number+134;
			break;
		
		
		default:
			return $number;
			break;
	}
    
}

//carte membres avec champs 
add_action('after_setup_theme','kleo_my_member_data');
function kleo_my_member_data() 
{
    global $kleo_config;
    
    //this display the fields under the name, eq: 36 / Woman / Divorced / Berlin. Modify with the names of the fields you want to appear there
    $kleo_config['bp_members_loop_meta'] = array(
        'Je suis un(e)',
        'Courant religieux',
		'Ville'
   );
  //this is the details field, right now it take the "About me" field content 
    $kleo_config['bp_members_details_field'] = 'Je recherche...'; 
	 
}
//masque les membres du même sexe
class BP_Custom_User_Ids {

    private $custom_ids = array();

    public function __construct() {

        $this->custom_ids = $this->get_custom_ids();

        add_action( 'bp_pre_user_query_construct',  array( $this, 'custom_members_query' ), 1, 1 );
        add_filter( 'bp_get_total_member_count',    array( $this, 'custom_members_count' ), 1, 1 );

    }

private function get_custom_ids() {
    global $wpdb;

    //figure out if the logged-in user is male or female
   $sex = xprofile_get_field_data( 3, bp_loggedin_user_id() );

   if ( $sex == 'Homme' ) 
      $query = "SELECT user_id FROM {$wpdb->prefix}bp_xprofile_data WHERE field_id = 3 AND value = 'Femme'";
   else
   if ( $sex == 'Femme' ) 
      $query = "SELECT user_id FROM {$wpdb->prefix}bp_xprofile_data WHERE field_id = 3 AND value = 'Homme'";
   else 
      $query = "SELECT user_id FROM {$wpdb->prefix}bp_xprofile_data WHERE field_id = 3 AND value = ''";          

    $custom_ids = $wpdb->get_col( $query );

    return $custom_ids;
}

    function custom_members_query( $query_array ) {

        $query_array->query_vars['include'] = $this->custom_ids;

    }  

    function custom_members_count ( $count ) {

        $new_count = count( $this->custom_ids );
        return $new_count;

    }
}

function custom_user_ids( ) {

    new BP_Custom_User_Ids ();

}

add_action( 'bp_before_directory_members', 'custom_user_ids' );
?>

Regards,
Thanks

[jenny555]

I also wrote this message: https://archived.seventhqueen.com/forums/topic/sweetdate-wider-grafic
you can answer me here.
thanks

[Laura]

Hello, for:
First Attachment

1,2 Are css codes added to your style.css in child theme

1- Member Background

COPY CODE

/* MEMBER BACKGROUND */
div#members-list .four.columns {
    background-color: #303131;
    margin-top: 30px;
}

2- 4 COLUMNS

COPY CODE

/* 4 COLUMNS */
#members-list .four.columns:nth-child(3n+1) {
    clear: none !important;
}
.search-list {
    margin: 0 0 40px;
    display: inline-block;
    width: 115%;
    margin-left: -3%;
}
#members-list .four.columns:nth-child(4n+1) {
    clear: left !important;
}

3- I will need access to your ftp

4- Done

5- Copy bp-functions.php from custom_buddypress folder inside sweetdate theme folder and paste it inside custom_buddypress folder of sweetdate child, if there is not that folder, just create it, then edit bp-functions.php in your new folder of child theme and find this:

COPY CODE

 echo '<div class="search-meta">';
 echo apply_filters('kleo_bp_members_dir_name','<h5 class="author"><a href="'. bp_get_member_permalink().'">'. bp_get_member_name().'</a></h5>');	

then change it for this:

COPY CODE

	
 echo '<div class="search-meta">';
 echo apply_filters('kleo_bp_members_dir_name','<h5 class="author"><a href="'. bp_get_member_permalink().'">'. bp_get_member_name().'</a></h5>');	
 echo '<strong> YOUR TEXT HERE</strong>';

6- Done in your style.css

COPY CODE

/* REMOVE MEMBER BORDER RADIUS */
.search-item {
    border-radius: 0PX !IMPORTANT;
}

7- Its an image, cant edit color

8- Done in your style.css

COPY CODE

/* NAME COLOR */
.search-meta a {
    color: white !important;
}

Second attachment

1- Done, added to your style.css

COPY CODE

/* PROFILE TABS COLOR */
#profile .generic-button a, .tabs.pill.custom dd:not(.active) a, #profile .callout, .regulartab dt, .regulartab dd {
    background: rgba(0, 0, 0, 0.43) !important;
    color: #ffffff;
}

Third Attachment

1- Done, added to your style.css

COPY CODE

/* CHANGE AVATAR LINK POSITION */
.image-hover .profile-hover-link {
    margin: -40px 22px !important;
}

2- Done, added to your style.css

COPY CODE

/* HEART RATING POSITION */
.rw-ui-container.rw-urid-9004.rw-ui-star.rw-size-large.rw-dir-ltr.rw-halign-right.rw-valign-middle.rw-style-lean_heart.rw-theme-star_lean_heart.rw-class-user {
    margin-top: 85%;
    position: absolute;
}

Fourth Attachment

1- Done

COPY CODE

/* FORM SELECT COLOR */
.form-search.custom div.custom.dropdown ul li.selected {
    background: #EEEEEE;
    color: black;
}

Other:
Video button hover

COPY CODE

/* BUTTON HOVER */
#call-to-actions .alert:hover, #call-to-actions .alert:focus {
    background: #D1A14F;
    border: 1px solid #D1A14F;
}

Video not displaying
The issue may be related to a plugin, please try to deactivate one by one and test again?

Button centered

COPY CODE

/* BUTTON CENTERED */
div#kleo_support_box-2 .small.button {
    margin-left: 20%;
}

Form fields centered

COPY CODE

form#newsletter-form .four.columns {
    margin-left: 10%;
}

FIELDS CENTERED
/* FIELDS CENTERED */
button#newsletter-submit {
margin-left: 354%;
}

Last attachment: Right now i dont know any way of making thse links a dropdown

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jenny555]

Hello Laura.
Wow, you are great! really! thank you for the considerable work that you do! I shall have wanted help to relieve you a little, but I am still not able and my English is bad. but if you need anything, I’m here.

I think if you have not been able to enter in the admin, it is because the “goodbyeaptchka” plugin. I turned off, you should normally have access.
Now I will test all this.

And especially when you have a little more time, could you help me put the buddypress menu like as kleo ( with icons)…? Thank you, I wish you good luck. 😉

[Laura]

Hello, i could enter and i did all changes in your site i posted that or others if they need 🙂
Let me know if something doesnt work or needs to be changed. About the kleo look for icons i am working on that and will post it soon in the forum

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jenny555]

Hi Laura,
sorry for the delay,
everything works perfectly (thank you a lot.) except joint attachments (and I didn’t find the plugin that prevents the video on the home page to run.).

Also, I try to do what you said in this topic, but I can not, can you help me please? https://archived.seventhqueen.com/forums/topic/gender-related-question-sweetdate
Laura thank you

[Laura]

Hello, can you share cpanel or ftp? I am testing code

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jenny555]

Hello Laura,

ftp

host: speedmazal.com

user: u75996062-laura

password : lauralaura

Dashboard (admin)

http://www.speedmazal.com/wp-admin

laura
password: lauralaura

Thanks

[Laura]

Hello, did what i could with the update profile button, aall should be ready. The only thing i could not help with is the age next to the number, its simple but requires some development

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts