WordPress.org

Ready to get started?Download WordPress

Forums

Custom Community
Would the following CSS conflict with Custom Community? (6 posts)

  1. Number_6
    Member
    Posted 1 year ago #

    Hi folks,

    I've got a good chunk of CSS I need to implement, and it's not doing it's magic, so I wonder if Custom Community might be halting it with other CSS.

    .p1 {display:block; width:100px; text-decoration:none; background:#fff; border:0; margin:20px 0 0 50px; float:left; position:relative; z-index:50;}
    .p1 img {display:block; border:0;}
    .p1:hover {text-decoration:none; background-color:#8c97a3; color:#000; position:relative; z-index:500;}
    .p1 b {display:block; position:absolute; left:-9999px; padding:10px; opacity:0;
    
     border-radius:3px;
     box-shadow:0 15px 10px -15px rgba(0,0,0,0.4);
    
    -webkit-transition: opacity 0.6s ease-in-out;
    -moz-transition: opacity 0.6s ease-in-out;
    -o-transition: opacity 0.6s ease-in-out;
    -ms-transition: opacity 0.6s ease-in-out;
    transition: opacity 0.6s ease-in-out;
    }
    
    .p1:hover b {top:-120px; left:110px; padding:10px; border:1px solid #ddd; background:#fff; opacity:1.0;}

    And where in the theme is it best that I drop this?

    Thanks muchly

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Does CC have those classes (i.e. "p1"); Hard to help with CSS without seeing the page in question.

  3. Number_6
    Member
    Posted 1 year ago #

    It's within the image output template of Buddypress Activity Plus. Had it working in another installation before.

    Here's the page:

    <div class="bpfb_images">
    <?php $rel = md5(microtime() . rand());?>
    <?php foreach ($images as $img) { ?>
    	<?php if (!$img) continue; ?>
    	<?php if (preg_match('!^https?:\/\/!i', $img)) { // Remote image ?>
            <span class="p1" ><img src="<?php echo $img; ?>" width="400" /><b><img class="large" src="<?php echo $img; ?>" /></b></span>
    	<?php } else { ?>
    		<?php $info = pathinfo(trim($img));?>
    		<?php $thumbnail = file_exists(bpfb_get_image_dir($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])) ?
    			bpfb_get_image_url($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])
    			:
    			bpfb_get_image_url($activity_blog_id) . trim($img)
    		;
    		$target = 'all' == BPFB_LINKS_TARGET ? 'target="_blank"' : '';
    		?>
    		<a href="<?php echo bpfb_get_image_url($activity_blog_id) . trim($img); ?>" class="<?php echo $use_thickbox; ?>" rel="<?php echo $rel;?>" <?php echo $target; ?> >
    			<img src="<?php echo $thumbnail;?>" />
    		</a>
    	<?php } ?>
    <?php } ?>
    </div>

    You can see the CSS in action on this HTML here: http://nagualgrove.com/img-test.html (rollover image)

  4. konradS
    Member
    Posted 1 year ago #

    CC doesn't have the class .p1, but when it appears somewhere in the html it should work, except some other CSS is stronger... but that we could find out then..

    first, i would drop all the CSS into the CSS overwrite section of the theme, which is the strongest as it comes loaded "at last"..

    go to THEME SETTINGS -> CSS tab and drop it there..

    let us know, konrad

  5. Number_6
    Member
    Posted 1 year ago #

    The CSS worked in the CSS editor.
    However, I am getting a strange effect. The second image that appears on rollover is resized to a tiny width. Is this something in CC?

    For right now my solution is to add a fixed with in the CSS (width:800px;) (which doesn't work, either. grr)

  6. konradS
    Member
    Posted 1 year ago #

    hmm no idea..

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.