[CDB] Blackfog 3.2.2 Version 3.2.2.2

For style authors to post and receive feedback on 3.2.x styles still in development. Any development styles you wish to use on your live board should be installed with caution!
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

[CDB] Blackfog 3.2.2 Version 3.2.2.2

Post by Tastenplayer »

Style name: Blackfog
Autor: Tastenplayer
Style Version:3.2.2.1
phpBB Version: 3.2.2
Inherits from: prosilver

Description of the style: Black with fog (looks almost like an image behind plexiglass), silver-gray and a little bit red.
All icons are gradient icons(In IE they are displayed unicoloured)
The style has a special thick, silver/white border
The header image/logo is shown in each display (in the contrib file there are more header images)
Texture Wrap background
Special No-Ava is displayed
Offline/online display is without image - with color display on the right margin
The cookie hint is completely recolored
The statistics part is reformatted as a block, fitting the style
Added Count Badge to the topic/post /forum statistics.
Important:With this style prosilver, the respective phpbb version, must be installed!

For this style the Dark Style Smilies must be installed

There is also a Blackfog_Extra version with header links, which can be edited in top_modern.html.

Info:There is a problem with the wrapborder and mousover function with the first avatar with the "Who visited this topic Extension" from dmzx. Therefore, for this style, the avatar display should be disabled.

There are also some instructions for extension adjustments for this style in my forum.

More screenshoots and Download: https://www.forum.my-tastenworld.ch/vie ... 151#p12089
Image
Image
Image

Demo URL: https://www.forum.my-tastenworld.ch Style 3.2.1
Last edited by Tastenplayer on Fri Sep 14, 2018 7:27 pm, edited 8 times in total.
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by Tastenplayer »

DEMO of the headerlink version is now on the liveboard for guests.
I've adapted it a little better.
Also the.wrap was double, so I moved it to the common.css.
(However, the link "Partner" is still empty)

As soon as I have checked everything again, I will create a new version with download.

The style only looks really cool if the Red title for new topic and new reply Ext is installed and color-matched! It's usually pretty simple.
https://www.phpbb.com/customise/db/exte... new_reply/
(see logged in: User Jimmy / Password Frühling)

I also noticed that the whole formatting for the links pages is not correct. Since there was nothing at all to read in the Blackfog. Should be right now. Created a new file in pages. Seems to be displayed correctly in every style.
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
zardos
Registered User
Posts: 130
Joined: Mon Feb 29, 2016 12:23 pm
Location: England, uk

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by zardos »

Very nice style, thanks for your hard work. ;)
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by Tastenplayer »

Glad if you like my style
That's a derivation of my first style. With the first style there are problems with the font color adjustment, because it has dark and light background.

However, I noticed today that there may be problems with the English language because I did not insert the empty css in the en language folder.
The new version should be checked for download by Saturday.

I apologize for that stupid lapse :oops: With the german language there were never problems because of it :lol:
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
RomaamoR
Registered User
Posts: 253
Joined: Tue Feb 24, 2015 4:45 pm
Location: Ukraine
Name: Roman
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by RomaamoR »

Well, why not make the style adaptive? Why do I have to constantly make edits css.
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by 3Di »

it looks to me pretty responsive.
tastenw_mini.png
.
Thanks for your hard work @Tastenplayer, I will give it a shot.

Eine schöne tag noch. :)
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by Tastenplayer »

RomaamoR wrote: Fri May 18, 2018 5:50 am Well, why not make the style adaptive? Why do I have to constantly make edits css.
What do you mean exactly? What do you have to change in the css?

You already know that the style is not yet released and not yet validated! There may already be several changes.
For most styles you have to adjust the extensions or make changes in the style for it.
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
RomaamoR
Registered User
Posts: 253
Joined: Tue Feb 24, 2015 4:45 pm
Location: Ukraine
Name: Roman
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by RomaamoR »

What do you mean exactly? What do you have to change in the css?
All styles are fixed. Not adapted to the mobile screen.
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.0

Post by Tastenplayer »

RomaamoR wrote: Fri May 18, 2018 2:21 pm
What do you mean exactly? What do you have to change in the css?
All styles are fixed. Not adapted to the mobile screen.
That's not true!
My style is fully responsive down to the smallest phone, including the header image. The most validated styles are completely responsive.
It couldn't be better!

And that's a huge job, make a header with a large image and getting a header image responsive, down to the smallest screen. Luckily another style developer did this for me.
I had ever received very good codes and tips for my first style on phpbb.de(not this style - the first is quite complicated)

So what's your problem in responsive? https://abload.de/img/blackfog_responsivex0uic.jpg https://abload.de/img/blackfoginsidemaoj2.jpg https://abload.de/img/headerblackfogresponsw9q1n.jpg

Edit:
One problem is just: If someone has such a long forum title and description as I have in my forum, then it is no longer responsive. It is simply impossible to take everything into account. Then you as a forum operator just have to adapt this yourself in the css. What I simply forgot, when I uploaded the styles as DEMO in my forum :oops:
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.1

Post by Tastenplayer »

It took a little longer than I thought. But: Good things take time.

-I corrected two not allowed css codes, which was quite complicated
-All style checked again for css errors with CSS Lint
-Added the correct image folder (unfortunately this was the wrong one before :oops: )
-The responsive adjusted even better(I hope I have not worsened it now, instead of improving it :mrgreen: )

Everything should definitely be right now!

Downloadlink in the first Post with version 2.1.1 is updated!
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
FranckTH
Registered User
Posts: 364
Joined: Thu Jul 28, 2011 12:14 pm
Location: France
Name: Franck
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.1

Post by FranckTH »

Hi,

Very good job, thanks, i like black and red color ;) ;)
Free Flash & HTML5 Games for Phpbb 3.2.2 + Extension Relax Arcade Pro
Free Flash & HTML5 Games for Relax Arcade Pro
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.1

Post by Tastenplayer »

FranckTH wrote: Sun Jun 03, 2018 8:54 am Hi,
Very good job, thanks, i like black and red color ;) ;)
Thanks - if it's a good job, I'll see when I submit it for validation :)
I have adjusted the background of the online display. I have to check everything again now.
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [RC]Blackfog 3.2.2 Version 2.1.1

Post by 3Di »

Tastenplayer wrote: Fri May 18, 2018 6:26 pm Edit:
One problem is just: If someone has such a long forum title and description as I have in my forum, then it is no longer responsive. It is simply impossible to take everything into account. Then you as a forum operator just have to adapt this yourself in the css.
You could make the use of CSS here and "ellipsis" I think, I do.

Code: Select all

/* Manage long names */
.my-awesome-class {
	white-space: nowrap;
	/* you MUST set a fixed width of choice here, to make all of this working */
	width: 160px;
	overflow: hidden;
	text-overflow: ellipsis;
}
result: "a very very very long name for the winner ..." note the ellipsis (...) at the end, when truncated.

And use @media screens to change the fixed width, in case - for every device.

In Firefox hit CTRL+SHIFT+m to see the variouses media screens.
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
User avatar
Tastenplayer
Registered User
Posts: 999
Joined: Thu Jul 03, 2014 9:20 pm
Location: Village in the middle of Switzerland
Name: Jutta Koliofotis
Contact:

Re: [RC]Blackfog 3.2.2 Version 3.2.2

Post by Tastenplayer »

@3Di
Would it be a possibility, but does it look good in a forum, if the whole description is not fully displayed? I don't know if that's the way to do it. :)
I think a responsive code for each resolution does not solve the problem that the description below goes beyond the background
But this also has an influence on long titles in contributions, long names in contributions, etc.
I've now tried that

Code: Select all

h5 {
	font-family: Arial, Sans-serif;
	margin-top: 16px;
	font-size: 1.2em;
	white-space: nowrap;
	/* you MUST set a fixed width of choice here, to make all of this working */
	width: 220px;
	overflow: hidden;
	text-overflow: ellipsis;
}
But the problem is: if you go with the mouse on it, the whole description would have to be displayed, which is not the case.
h5ellipsis.jpg
h5ellipsis.jpg (82.64 KiB) Viewed 3097 times
We need something like this

Code: Select all

h5{
    font-family: Arial, sans-serif;
    font-size: 1.2em;   
    width: 600px;
    text-overflow: ellipsis;    
    cursor: pointer;
    word-break: break-all;
    overflow:hidden;
    white-space: nowrap;
    margin-top: 16px;
}

h5:hover{
    overflow: visible; 
    white-space: normal;
    width: auto; 
}
It actually seems to work. Only the syllabification of words on mouseover is a bit like from another star :)
beschreibung_blackfog_responsive.jpg
Even better in hover with background

Code: Select all

h5:hover{
    overflow: visible; 
    white-space: normal;
    width: auto; 
    background: #222;
}
blackfog_h5 responsive with background.jpg
blackfog_h5 responsive with background.jpg (61.36 KiB) Viewed 3086 times
And you dont need @media screens to change the fixed width, in case - it seems that only that is needed

Code: Select all

@media (max-width: 700px) {
	h5 {
		width: 310px;
	}
}
However, touch screens should not have a hover function? Unfortunately I do not own such a device. I haven't even got a smartphone yet. :lol:

@All
The last few days I have:
Style completely controlled again
Style files completely checked and corrected again
Correct another link button
Try to integrate another link navigation. Nothing has worked satisfactorily so far.

Download link with final version 3.2.2 has been updated
More of my styles you can find in my phpBB Style Board & More
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
🎨 All my styles are updated to 3.3.8 and can be downloaded here
User avatar
3Di
I've Been Banned!
Posts: 17538
Joined: Mon Apr 04, 2005 11:09 pm
Location: I'm with Ukraine 🇺🇦
Name: Marco
Contact:

Re: [RC]Blackfog 3.2.2 Version 3.2.2

Post by 3Di »

H8 doesn't exist, https://www.w3schools.com/tags/tag_hn.asp

Let's create a fake H8 then - we copy some of the H5 properties to create it.
We add/remove things here, to fit our needs.

The media screen below is for small phones, you should modify some bit for the other 3 media screens usually needed and the default CSS.

CSS

Code: Select all

@media all and (max-width: 525px) {
	.h8 {
		font-family: Arial, Sans-serif;
		font-size: 1.1em;
		text-align: center;
		display: block;
		margin-top: 1.1em;
		font-weight: bold;
		color: #aaaaaa;
	}
}
HTML We use a span instead of a div.

Code: Select all

<span class="h8">
	EIN TREFFPUNKT FÜR KEYBOARDER, TASTENPLAYER, LIVE-MUSIKER UND GESANGTALENTE
</span>
small_phones.png
.
.
In Firefox hit CTRL+SHIFT+m on the keyboard to see test media screens.
And the inspector to modify the dummy view on the fly, like I did.

I am not a big expert but I think you can get the point.

This is your original on the same device enclosed within H5
.
.
small_phones_H5.png
🆓 Free support for our extensions also provided here: phpBB Studio
🚀 Looking for a specific feature or alternative option? We will rock you!
Please PM me only to request paid works. Thx. Buy me a coffee -> Image
My development's activity º PhpStorm's proud user º Extensions, Scripts, MOD porting, Update/Upgrades
Locked

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