What style is this?

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

What style is this?

Post by fliper4o »

I came across a forum probably with the newest phpBB, it looks great, simple, nice layout. Shorten width, font colored background(soft blue), above the picture(attachment), there is 2 images as logos that overlap one another, so cute, so I was wondering 1st what is the them(style) is it self modified(probably), can I rearrange some things on my forum too,like Board Index before Quick links; Home, Wiki, Forums, Issue buttons & search on that "tab" & the style itself.
1.png
2.jpg
Compare both!
Thanks
-fliper4o
User avatar
Tom Brady
Registered User
Posts: 3
Joined: Thu Aug 13, 2015 10:46 am

Re: What style is this?

Post by Tom Brady »

Prosilver
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

Mine is prosilver too, how can I edit it to look alike just like Love?
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

How to do it like that?
4.png
4.png (9.37 KiB) Viewed 2563 times
5.png
Spot the differences.
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: What style is this?

Post by Hanakin »

Step 1 post links to sites not images so we can see the code.

As for how, it looks like they removed the header and merged prosilver into there own frame then added a new section above the wrap and added search and buttons. Then gave it a bottom border blue background and rounded top corners
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

Okey, here we go... : )
https://love2d.org/forums/
//So far I just managed to change my "background-color:"
User avatar
Mannix_
Registered User
Posts: 1850
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Contact:

Re: What style is this?

Post by Mannix_ »

Image For this you need to open and navbar_header.html put

Code: Select all

<ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">....</ul>
between

Code: Select all

<div class="inner">
and

Code: Select all

<ul id="nav-main" class="nav-main linklist" role="menubar">
and adjust the border from this
colors.css

Code: Select all

ul.navlinks {
    border-top-color: #FFFFFF;
}
common.css

Code: Select all

ul.navlinks {
    border-top: 1px solid transparent;
}
to this
colors.css

Code: Select all

ul.navlinks {
    border-bottom-color: #FFFFFF;
}
common.css

Code: Select all

ul.navlinks {
    border-bottom: 1px solid transparent;
}
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

Hm, done exactly what u've said but something is not fine.
phpBB3\styles\prosilver\template\navbar_header.html

Code: Select all

	<div class="inner">

<ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">....</ul>

	<ul id="nav-main" class="nav-main linklist" role="menubar">
phpBB3\styles\prosilver\theme\colours.css

Code: Select all

ul.navlinks {
	border-bottom-color: #FFFFFF;
phpBB3\styles\prosilver\theme\common.css

Code: Select all

ul.navlinks {
	border-bottom: 1px solid transparent;
I honestly like that colored buttons & the search tab as well as the logos space.
Last edited by fliper4o on Thu Aug 17, 2017 1:03 pm, edited 1 time in total.
User avatar
Mannix_
Registered User
Posts: 1850
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Contact:

Re: What style is this?

Post by Mannix_ »

You need to copy and paste the whole section from

Code: Select all

 <ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">
to

Code: Select all

</ul>
I just did it like that

Code: Select all

<ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">....</ul>

	
for time saving :)
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

Thank you, worked fine, except the white line which divides 'em(it was gone). Anyway...
I am more focused on the overall style.
  • Background color + logo like it is under the main windows(forum board). The logo(banner, etc) are outside of the main window.
  • Home, Wiki, Forums... buttons + search are on a separate bar, enlarged to the main window(forum) width but buttons & search are fixed to the Board Index bar
//I can & probably will check some .css from the original forum(Love) but I'll need some help.
User avatar
Mannix_
Registered User
Posts: 1850
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Contact:

Re: What style is this?

Post by Mannix_ »

  • to make it look like it's behind you need to add box-shadow to the wrap section
on that forum it's

Code: Select all

-webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 150, 0.20);
    -moz-box-shadow: 0px 0px 10px 0px rgba(50, 50, 150, 0.20);
    box-shadow: 0px 0px 10px 0px rgba(50, 50, 150, 0.20);
  • the home button etc. is done by adding extra div called nav on that forum and the look is controlled via css
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

How? Where?
User avatar
andares
Registered User
Posts: 93
Joined: Sat Feb 28, 2009 5:53 pm
Location: Spain
Name: Pedro
Contact:

Re: What style is this?

Post by andares »

fliper4o wrote: Thu Aug 17, 2017 2:32 pm How? Where?
These buttons are very similar to those generated by this extension:

viewtopic.php?f=456&t=2410101
Sorry for my bad English, I use a translator...
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

andares wrote: Thu Aug 17, 2017 5:18 pm These buttons are very similar to those generated by this extension:
almost ^^
Mannix_ wrote: Thu Aug 17, 2017 1:32 pm
  • to make it look like it's behind you need to add box-shadow to the wrap section
  • the home button etc. is done by adding extra div called nav on that forum and the look is controlled via css
I would try to make it to be just like the Love forum so I'll need your help guys. The link is UP so u can easily get the code & let me test, but please provide me some info cuz I'm newbie & don't know where is the code like path,where to put it/between this & this/ etc
Thanks for the help!
-fliper4o
fliper4o
Registered User
Posts: 267
Joined: Wed Mar 23, 2011 8:15 pm
Contact:

Re: What style is this?

Post by fliper4o »

Help me modify it, thanks.
I'm focused on the header & the
Mannix_ wrote: Thu Aug 17, 2017 1:32 pm
  • the home button etc. is done by adding extra div called nav on that forum and the look is controlled via css
So far :D
sofar.jpg
Post Reply

Return to “[3.2.x] Styles Support & Discussion”