[CDB] Black

For style authors to post and receive feedback on 3.1.x styles still in development. Any development styles you wish to use on your live board should be installed with caution!
Get Involved
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

[CDB] Black

Post by Arty »

Style name: Black

This style looks almost the same as phpBB 3.0 style "Artodia: Black", but uses completely different code.

Demo: click here (click color variations in header to see different color schemes)

Download: click here
GitHub repo: click here

License: BSD (GPL compatible)
Additionally Font Awesome and Glyph Icons included in style have their own licenses. See theme/fonts/*/license.txt for details.

Image

Features:
  • Based on prosilver
  • All icons (except for forum/folder images and logo) have been replaced with Font Awesome and Glyph Icons glyphs.
  • Folder images and logo support high definition displays (such as Apple Retina).
  • Restructured navigation. There are 3 navigation sections: main navigation, context navigation, breadcrumbs. You can see it on screenshot above. Main navigation selected item automatically switches based on page you are browsing. Context navigation changes from page to page. Number of unread private messages and notifications are shown above navigation in red circles, making it easy to spot.
  • Sticky navigation. When you scroll down, navigation stays on top of browser window.
  • No more language specific icons. "Online" icon has been replaced with CSS3 ribbon that is shown semi-transparent above avatar.
  • CSS files have been changed to Sass, a very powerful language for generating stylesheets. Style loads only 1 CSS file instead of multiple CSS files, reducing page loading speed.
  • Style has several configuration options.
Configuration:
There are 2 configuration files that serve different purposes:
  • template/_style_config.html: It sets variables that can be changed in templates.
    • $HIDE_FORUM_DESCRIPTION: toggles forum title and description in header
    • $WRAP_HEADER: toggles inclusion of header and navigation into content wrapper
    • $WRAP_FOOTER: toggles inclusion of footer into content wrapper
  • theme/_style_config.scss: It sets variables that can be changed in theme. See "Sass" section below.
    • $show-logo: toggles logo in header
    • $show-forum-title: toggles forum title. See similar variable in template/_style_config.html
    • $center-logo: if enabled, logo will be centered. If disabled, logo will be aligned to left
    • $logo-width: logo width.
    • $logo-block-padding: padding above and below logo (used for short logos, like default one)
    • $profile-width: width of poster profile section. Unlike prosilver that uses percentages, this style uses fixed width for profiles that looks better at different screen resolutions.
    • $profile-side: Side for profile block in posts. Possible values are "left" or "right".
    • $use-wrapper: toggles content wrapper.
    • $max-width: toggles fixed width. Set to "none" to make layout fluid.
Sass:
This style uses Sass pre-processor for stylesheet. You can edit stylesheet in 2 ways:

1. Edit stylesheet.css directly (bad idea).

2. Edit any .scss file and then compile it into stylesheet.css

Tutorial that explains how to (re)compile stylesheet.css: http://www.artodia.com/phpbb-31-tutoria ... ile-theme/
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
Raul [ThE KuKa]
Style Customisations
Style Customisations
Posts: 11073
Joined: Mon Dec 08, 2003 9:24 pm
Location: Spain
Name: Raul Arroyo
Contact:

Re: [Release] Black

Post by Raul [ThE KuKa] »

Again, nice job Arty. :)
All unsolicited PMs will be ignored.
:warning: Knowledge Base | Documentation | Board rules | phpBB Styles Rules & Policies | Styles Queue Stats :warning:


If you like my styles, translations, etc. and want to show some appreciation, then feel free to Donate.
:flag_es: phpBB Spain - Online Since 2003 :heart:


User avatar
Mess
Registered User
Posts: 985
Joined: Wed Jul 01, 2009 6:37 am
Name: Kim

Re: [Release] Black

Post by Mess »

Very solid, well rounded style. Great job again. :)
User avatar
david63
Registered User
Posts: 20646
Joined: Thu Dec 19, 2002 8:08 am

Re: [Release] Black

Post by david63 »

There appears to be a problem with Memberlist (both full and mini popup) when you have the additional inbuilt profile fields activated in that that column is not wrapping correctly as it does in prosilver
Attachments
Black - incorrect
Black - incorrect
prosilver - correct
prosilver - correct
David
Remember: You only know what you know and - you don't know what you don't know!

I now no longer support any of my extensions but they will start to become available here
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

Style updated.

UCP/MCP layout has been changed and fixed bunch of bugs.
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
david63
Registered User
Posts: 20646
Joined: Thu Dec 19, 2002 8:08 am

Re: [Release] Black

Post by david63 »

I am a bit confused.

This style has as its parent prosilver - I am fine with that. Now my understanding is that any style that has its parent as prosilver should be capable of using template events designed for prosilver but this style doesn't. If there is an extension that adds an item to the top nav bar (such as the official Board Rules extension) then it will display the text but not the icon (OK - I accept that the icon may look out of place - but that is a different issue), and I also wonder what other template event will not work as expected.

Now whilst I do not have any problems with creating a template event for this, or any other style, it seems to me that there is something wrong with inheritance which, from an extension developer's perspective, is cause for concern when extensions are not working as expected. It will also possibly create problems for the users of the extension/style combination.
David
Remember: You only know what you know and - you don't know what you don't know!

I now no longer support any of my extensions but they will start to become available here
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

It supports all template events, except for 2 events: navbar_header_username_append, navbar_header_username_prepend.

Those 2 events are for username item in navigation, which doesn't exist in my styles. They should not be used to add links to top bar because they are executed inside <li> for navigation item. That's what overall_header_navigation_prepend, overall_header_navigation_append and navbar_header_logged_out_content events are for.

It also has 4 custom events for adding navigation items: navtabs_left_after, navtabs_left_before, secondary_navlinks_after and secondary_navlinks_before. If you want to attach something to 2 events that style doesn't support, you can use any of those 4 events as backup for my styles.

I also have basic extension (which I'm using for testing responsive navigation) that adds lots of navigation items as examples of how events should be used: http://www.artodia.com/downloads/phpbb31/extranav.zip
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
melihonline
Registered User
Posts: 31
Joined: Tue Jul 08, 2008 9:42 pm
Location: Antalya / TÜRKİYE
Name: Melih KAYA
Contact:

Re: [Release] Black

Post by melihonline »

Beautiful style... :)

I could not change the site logo and width. How can I do?
İki insan açtır. Biri biliri arayan, diğeri ise parayı.
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

Thanks.

To change logo edit this line in overall_header.html

Code: Select all

				<a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><img src="{T_THEME_PATH}/images/logo.png" data-src-hd="{T_THEME_PATH}/images/logo_hd.png" /></a>
It supports high definition logo, which is used when user opens forum with device that has high definition display, such as modern phone or one of Apple devices with Retina display. High definition logo is basically the same as normal logo, but twice bigger.

Replace this code src="{T_THEME_PATH}/images/logo.png" with path to your logo.

Replace this code data-src-hd="{T_THEME_PATH}/images/logo_hd.png" with path to your high definition logo. If you don't have a high definition logo, delete that code.

To change width open theme/_style_config.scss, find

Code: Select all

$max-width:								none;	// Maximum width. Set to "none" to make layout fluid
and change value to your width. For example

Code: Select all

$max-width:								980px;	// Maximum width. Set to "none" to make layout fluid
then recompile stylesheet. I haven't created detailed tutorial on how to do that yet, but this post can help you: http://www.artodia.com/threads/change-b ... #post-8463
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
melihonline
Registered User
Posts: 31
Joined: Tue Jul 08, 2008 9:42 pm
Location: Antalya / TÜRKİYE
Name: Melih KAYA
Contact:

Re: [Release] Black

Post by melihonline »

Thank you very much for your help.

I changed the logo, but not suitable phpBB logo and height dimensions.

Logo I want to center vertically.

Site: http://www.sanalyeriniz.com/forum
Attachments
1.png
İki insan açtır. Biri biliri arayan, diğeri ise parayı.
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

Your banner is rather large, so its better to hide forum description.

Open theme/_style_config.scss, find

Code: Select all

$show-forum-title:						true;	// true or false
change to

Code: Select all

$show-forum-title:						false;	// true or false
and recompile stylesheet (see second post in this thread on how to recompile it).
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
melihonline
Registered User
Posts: 31
Joined: Tue Jul 08, 2008 9:42 pm
Location: Antalya / TÜRKİYE
Name: Melih KAYA
Contact:

Re: [Release] Black

Post by melihonline »

Code: Select all

$show-forum-title:                  false;   // true or false
I made a false description, but the forum was deleted.

Changing something happened.
İki insan açtır. Biri biliri arayan, diğeri ise parayı.
User avatar
Arty
Former Team Member
Posts: 16654
Joined: Wed Mar 06, 2002 2:36 pm
Name: Vjacheslav Trushkin
Contact:

Re: [Release] Black

Post by Arty »

Version 1.0.1 is available.

Changes from version 1.0.0:
  • Many bug fixes
  • Option to show profile on right side
  • Option to show quick search in navigation instead of header
Vjacheslav Trushkin / Arty.
Free phpBB 3.1 styles | New project: Iconify - modern SVG framework
User avatar
melihonline
Registered User
Posts: 31
Joined: Tue Jul 08, 2008 9:42 pm
Location: Antalya / TÜRKİYE
Name: Melih KAYA
Contact:

Re: [Release] Black

Post by melihonline »

$profile-side: left; // left or right

_style_config.scss files edit.

I cleaned the cache.

No profil left :(
İki insan açtır. Biri biliri arayan, diğeri ise parayı.
Locked

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