Hey, first of all thank you for this great theme.

I have 2 issues with it.

I've been struggling for a couple of hours to add a border to the blocks in the main area. Where ever I try to put the border tag it doesn't show up. It would be great if someone can give me some help on this one.

For the image slider, I want to put it under the blocks. But if I put the code under the one of the main area blocks, it doesn't stay in the center, it goes to the left. I've tried to edit the CSS but without any result. I'm wondering as well if I can resize it or put it in a block.

I'm quiet a newbie so sorry if my questions look a bit silly.

CommentFileSizeAuthor
#10 screenshot.png287.43 KBkjessie
#2 extreme-bluemasters7.1.1.jpg242.78 KBgtsopour
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

gtsopour’s picture

Assigned: Unassigned » gtsopour
gtsopour’s picture

FileSize
242.78 KB

Hello kjessie,

1. In order to add a border to the blocks in the main area, you should add a style css rule on style.css file. For example, if you want border around each block

.block { border:1px solid red; }

If you want border around each block in #main-area, try this in style.css file

#main-area .block { border:1px solid red; }

2. For your second question, just change the order of divs #home-blocks-area and #banner in page--front.tpl.php. I attached a screenshot with this change, I LIKE IT...

    <div id="home-blocks-area" class="clearfix">
        <div class="home-block-area first">
            <?php print render($page['home_area_1']);?> 		
        </div>
        <div class="home-block-area">
            <?php print render($page['home_area_2']);?> 
        </div>
        <div class="home-block-area last">
            <?php print render($page['home_area_3']);?> 
            <?php print render($page['home_area_3_b']);?> 
        </div>
    </div>
    
    <div id="banner">
    <?php print render($page['banner']); ?>
    
        <div class="main_view">
            <div class="window">
                <div class="image_reel">
                    <a href="<?php print url('node/3'); ?>"><img src="<?php print base_path() . drupal_get_path('theme', 'bluemasters') . '/images/slide-image-3.jpg'; ?>"></a>
                    <a href="<?php print url('node/2'); ?>"><img src="<?php print base_path() . drupal_get_path('theme', 'bluemasters') . '/images/slide-image-2.jpg'; ?>"></a>
                    <a href="<?php print url('node/1'); ?>"><img src="<?php print base_path() . drupal_get_path('theme', 'bluemasters') . '/images/slide-image-1.jpg'; ?>"></a>
                </div>
                <div class="descriptions">
                    <div class="desc" style="display: none;">About Bluemasters</div>
                    <div class="desc" style="display: none;">Our Portfolio</div>
                    <div class="desc" style="display: none;">Creation of Beaches</div>
                </div>
            </div>
        
            <div class="paging">
                <a rel="1" href="#">1</a>
                <a rel="2" href="#">2</a>
                <a rel="3" href="#">3</a>
            </div>
        </div>
    </div><!--EOF:banner-->
kjessie’s picture

Great!! Thanks for the quick reply! I'm gonna try it out and I'll let you know!

kjessie’s picture

I've tried the

#main-area .block { border:1px solid red; }

but unfortunately it's not working. I think that there's a conflict somewhere. Maybe another element that says that there should be no borders.

gtsopour’s picture

Could you give me a url with your drupal installation? I would like to see your blocks and their classes. Thanks!

kjessie’s picture

For now it's on http://beta.mcpuck.net/ I still need to fix many things, I've just started working on it yesterday. Oh and like you'll see, the image slider is working great!! :D

gtsopour’s picture

Fine... Could you tell me the blocks in which you want border?

gtsopour’s picture

For blocks in front-page, in style.css (line 121) file there is the following code,

#home-blocks-area .block {
    background-color: #000000;
    padding-bottom: 20px;
}

Simple add your border,

#home-blocks-area .block {
    background-color: #000000;
    padding-bottom: 20px;
    border: 1px solid #FFFFFF;
}
kjessie’s picture

Thanks gonna try that!!! There's another thing. In the back-end we get errors for Facebook Connect and we can't get it working on the site. Should I open a new topic about it?

kjessie’s picture

FileSize
287.43 KB

Look it's not working. It gives me a border around the total main area, while I want it only around the blocks and it puts the block of the Home Area 3 in the Home Area 2. I've attached a screenshot for you.

gtsopour’s picture

Yes, open a new topic.Tell me if you solved the problem with borders in order to close this issue. Thanks again.

gtsopour’s picture

You put the border in your total #home-blocks-area

#home-blocks-area {
    background-image: url("images/home-block-box-bg.png");
    border: 1px solid #FFFFFF;
    min-height: 100px;
    overflow: hidden;
    padding: 20px 20px 0;
}

not on #home-blocks-area .block as i told you before,

#home-blocks-area .block {
    background-color: #000000;
    padding-bottom: 20px;
    border: 1px solid #FFFFFF;
}
kjessie’s picture

About my last comment: Actually it can stay like this, I kinda like it, the border this way. But I need just to get the 3rd area back in its place. I guess it's something with the width. I'm checking it out.

kjessie’s picture

Ok, one sec, gonna try that! :)

kjessie’s picture

Sorry my bad, I just realized it! Issue solved! Thanks so much for the 1st class support!

gtsopour’s picture

Status: Active » Closed (fixed)

Nothing, you are welcome kjessie