[STYLEDB]Pro_ubuntu - Close this one please

For style authors to post and receive feedback on 3.0.x styles still in development. Any development styles you wish to use on your live board should be installed with caution!
Anti-Spam Guide
Locked
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

[STYLEDB]Pro_ubuntu - Close this one please

Post by Ishimaru Chiaki »

Hello.

Here's a style I almost finished : http://ishimaru-design.servhome.org/tests/phpBB3/
Logins for testing : testuser + test00

It's not ready yet to be released because I still have some corrections and testings to do (I haven't tested under IE7 yet, it will be done next time I boot - my PC has a winXP/Ubuntu dualboot)

For now, I have just corrected a template attribution issue (the style was loading the wrong template set - this happened only on the online board, not on the local board).

And now, I still have a problem : I can't remove or comment the rounded corner in the header part without screwing up the header's display. Here's a screenshot : http://img.photobucket.com/albums/v381/ ... header.png

Here is the code of overall_header.html

Code: Select all

       <div id="page-header">
          <div class="headerbar">
             <div class="inner"><span class="corners-top"><span></span></span>

             <div id="site-description">
                <a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
                <h1>{SITENAME}</h1>
                <p>{SITE_DESCRIPTION}</p>
                <p style="display: none;"><a href="#start_here">{L_SKIP}</a></p>
             </div>

          <!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
             <div id="search-box">
                <form action="{U_SEARCH}" method="post" id="search">
                <fieldset>
                   <input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" />
                   <input class="button2" value="{L_SEARCH}" type="submit" /><br />
                   <a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
                </fieldset>
                </form>
             </div>
          <!-- ENDIF -->

             <span class="corners-bottom"><span></span></span></div>
          </div>

          <div class="navbar">
             <div class="inner"><span class="corners-top"><span></span></span>

             <ul class="linklist navlinks">
                <li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a> <!-- BEGIN navlinks --> <strong>&#8249;</strong> <a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAME}</a><!-- END navlinks --></li>

                <li class="rightside"><a href="#" onclick="fontsizeup(); return false;" onkeypress="fontsizeup(); return false;" class="fontsize" title="{L_CHANGE_FONT_SIZE}">{L_CHANGE_FONT_SIZE}</a></li>

                <!-- IF U_EMAIL_TOPIC --><li class="rightside"><a href="{U_EMAIL_TOPIC}" title="{L_EMAIL_TOPIC}" class="sendemail">{L_EMAIL_TOPIC}</a></li><!-- ENDIF -->
                <!-- IF U_EMAIL_PM --><li class="rightside"><a href="{U_EMAIL_PM}" title="{L_EMAIL_PM}" class="sendemail">{L_EMAIL_PM}</a></li><!-- ENDIF -->
                <!-- IF U_PRINT_TOPIC --><li class="rightside"><a href="{U_PRINT_TOPIC}" title="{L_PRINT_TOPIC}" accesskey="p" class="print">{L_PRINT_TOPIC}</a></li><!-- ENDIF -->
                <!-- IF U_PRINT_PM --><li class="rightside"><a href="{U_PRINT_PM}" title="{L_PRINT_PM}" accesskey="p" class="print">{L_PRINT_PM}</a></li><!-- ENDIF -->
             </ul>

             <!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
             <ul class="linklist leftside">
                <li class="icon-ucp">
                   <a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="u">{L_PROFILE}</a>
                      <!-- IF S_DISPLAY_PM --> (<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a>)<!-- ENDIF --> &bull;
                   <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
                   <!-- IF U_RESTORE_PERMISSIONS --> &bull;
                   <a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a>
                   <!-- ENDIF -->
                </li>
             </ul>
             <!-- ENDIF -->

             <ul class="linklist rightside">
                <li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
                <!-- IF not S_IS_BOT -->
                   <!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
                   <!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED --><li class="icon-register"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
                   <li class="icon-logout"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="l">{L_LOGIN_LOGOUT}</a></li>
                <!-- ENDIF -->
             </ul>

             <span class="corners-bottom"><span></span></span></div>
          </div>

       </div>
Here's the dirty tweak I had to add in colours.css in order to hide those corners :

Code: Select all

    .headerbar span.corners-top, .headerbar span.corners-top span, .headerbar span.corners-bottom, .headerbar span.corners-bottom span, #page-header div.navbar span.corners-top, #page-header div.navbar span.corners-top span, #page-header div.navbar span.corners-bottom, #page-header div.navbar span.corners-bottom span
    {
       background: none;
    }
I would like to have this header issue solved.

Thanks in advance.

Ishimaru

EDIT on 11/01/08 : I finished the style. It is now under validation process on both English and French support forums. You can download it here until it is accepted.
Last edited by Ishimaru Chiaki on Thu Mar 19, 2009 4:46 am, edited 3 times in total.
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

I bump and change the title, hoping it will be more explicit.
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Raimon
Former Team Member
Posts: 12088
Joined: Tue May 30, 2006 5:31 pm
Location: Netherlands
Name: Raimon Meuldijk
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Raimon »

When i take a look at your board, i don't see anything that's wrong, where did you get that error like the one as your screenshot ?
Both tested on IE7 and FF3.
Need phpBB installation, extenstions, Styles or integrate phpBB with you website?
Contact me for fair prices and good service!
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

Raimon wrote:When i take a look at your board, i don't see anything that's wrong, where did you get that error like the one as your screenshot ?
Both tested on IE7 and FF3.
Have you at least tested the archive and removed the corners in overall_header.html ???

*god****... I thought I explained well...*
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Raimon
Former Team Member
Posts: 12088
Joined: Tue May 30, 2006 5:31 pm
Location: Netherlands
Name: Raimon Meuldijk
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Raimon »

which archive ?
Need phpBB installation, extenstions, Styles or integrate phpBB with you website?
Contact me for fair prices and good service!
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

Damn... I thought I posted the archive link >.<

Here's the link of the latest version : http://sd-1.archive-host.com/membres/up ... _beta3.zip
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Raimon
Former Team Member
Posts: 12088
Joined: Tue May 30, 2006 5:31 pm
Location: Netherlands
Name: Raimon Meuldijk
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Raimon »

Just replace every :

Code: Select all

 <div class="inner"><span class="corners-top"><span></span></span>
with:

Code: Select all

<div class="inner"><span style="display: block;
   height: 5px; margin: 0 -5px;"><span></span></span>
and :

Code: Select all

<span class="corners-bottom"><span></span></span></div>
with:

Code: Select all

<span style="display: block;
   height: 5px; margin: 0 -5px;
   clear: both;"><span></span></span></div>
But i don't understand why you want to deleted the rounded corners, if i view it on your link i don't see any corners.
Need phpBB installation, extenstions, Styles or integrate phpBB with you website?
Contact me for fair prices and good service!
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

You can't see them because I had to hide them with CSS, look in my first post to see the dirty code I had to insert in order to hide them.
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

The code given has solved my problem :) Thank you.

It took me some time before I could reply, because I don't remember my password for this account, and I have the autologin on Ubuntu's side, but i'm logged out on winXP's side, so I had to wait until I boot under Ubuntu.
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

I finally could find a clean way to remove corners without using dirty ways (extra divs/spans or css tweaks to hide the corners) : It's because of the floating elements ! So to avoid the header and navbar to collapse, a height must be given to the header and navbar blocks :

Code: Select all

#headerbar
{
    height: XXXpx;
}

#page-header .navbar
{
    height: XXpx;
}
Just replace the X's by the number of pixels you want your blocks to be.

Here's the result : http://ishimaru-design.servhome.org/tes ... /index.php
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
kenta
Registered User
Posts: 85
Joined: Fri Feb 09, 2007 8:41 am

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by kenta »

Whoa so clean.
<3 Phpbb
User avatar
Zaid
Registered User
Posts: 590
Joined: Thu Nov 08, 2007 2:06 pm
Location: South Pacific Ocean

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Zaid »

User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Need help for the header's corners

Post by Ishimaru Chiaki »

Hello.

For information, I updated the pack lately, in order to replace the troublesome PNG folders by GIFS, so I can get rid of those insane tweaks I had to use to make the skin compatible IE6/Opera.

Link : http://ishimaru-design.servhome.org/div ... _beta9.zip

Please report any small bug or something wrong you encounter, so I can correct them for the final version.
I am currently waiting for a reply from the GFX guys on phpBB-fr. If they find no more bug, I will pass the style to final version for validation on phpBB-fr before submitting it here on the English forum.
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Finished and under validation process

Post by Ishimaru Chiaki »

New update : The style is now at its final version !

I have just submitted the style here and on phpbb-fr.com. Until it is accepted, you can download it here. It is compatible 3.0.4 !
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
User avatar
Ishimaru Chiaki
Registered User
Posts: 179
Joined: Thu Nov 15, 2007 4:39 am
Location: Baie-Comeau, Québec, Canada
Name: Caroline
Contact:

Re: [Dev]Pro_ubuntu - Finished and under validation process

Post by Ishimaru Chiaki »

The style has been approved and is now available there : http://www.phpbb.com/community/viewtopi ... &t=1506285

I request to have my topic closed !
Find my phpBB3 and GIMP tutorials on http://ishimaru.pingveno.net (New address)
My DeviantArt gallery
Locked

Return to “[3.0.x] Styles in Development”