Jump to content
TNG Community

T.N.G.Colouring Book


XerxX

Recommended Posts

~ T.N.G. COLOURING BOOK ~

is an easy-to-use editor that lets you set your own colour to (almost) any detail in your template.

This is an image of the interface while editing template #4:

IPB Image

And the result (getperson.php):

IPB Image

Test your colour scheme in semi-live index.php and getperson.php pages.

Generate and download your mytngstyle.css to use at your T.N.G. site.

Or re-load it into the editor at a later time to modify it further.

Lots of options for all eleven templates.

A generous User's Manual is there.

And it's all for free!

The site is now opened to the public:

T.N.G. Colouring Book (xerxx.se/tcb/)

ENJOY!

XerxX

PS.

Please, do us all the favour to initially report bugs and such here, so "everyone" can be aware of them.

Thank You.

Link to comment
Share on other sites

~ T.N.G. COLOURING BOOK ~

is an easy-to-use editor that lets you set your own colour to (almost) any detail in your template.

This is an image of the interface while editing template #4:

IPB Image

And the result (getperson.php):

IPB Image

Test your colour scheme in semi-live index.php and getperson.php pages.

Generate and download your mytngstyle.css to use at your T.N.G. site.

Or re-load it into the editor at a later time to modify it further.

Lots of options for all eleven templates.

A generous User's Manual is there.

And it's all for free!

The site is now opened to the public:

T.N.G. Colouring Book (xerxx.se/tcb/)

ENJOY!

XerxX

PS.

Please, do us all the favour to initially report bugs and such here, so "everyone" can be aware of them.

Thank You.

Brilliant idea! I especially like what you did with de-colorizing and adding partial transparency to some images (particularly Template 10). There are probably more images you could do this with. I customized Template 10 for a client and had to re-color 25 separate small image files in PhotoShop! I too have transparent versions of the Template 8 image files (those were easier to do). Perhaps we could get Darrin to use background images that are more friendly to color changes.

Best regards,

Bryan

Link to comment
Share on other sites

Brilliant idea! I especially like what you did with de-colorizing and adding partial transparency to some images (particularly Template 10). There are probably more images you could do this with. I customized Template 10 for a client and had to re-color 25 separate small image files in PhotoShop! I too have transparent versions of the Template 8 image files (those were easier to do). Perhaps we could get Darrin to use background images that are more friendly to color changes.

Best regards,

Bryan

Bryan and Erik,

If you are having to change template images for transparency, you should provide those to Darrin for inclusion in TNG V10.

Erik,

I took a brief look at your TNG Colouring Book selecting a color scheme and then selecting Template 4, the left nav area does not appear to get changed from the TNG red to the color scheme selected.

Link to comment
Share on other sites

Hello Ken,

Darrin knows everything about this. I'm sure he has seen the images and as they are all his, he can do whatever he likes.

Re: your experience with the preset, it sets only classes common to all templates.

What that means is described in the beginning of the manual.

Happy colouring,

Erik

Link to comment
Share on other sites

Hello Ken,

Darrin knows everything about this. I'm sure he has seen the images and as they are all his, he can do whatever he likes.

Re: your experience with the preset, it sets only classes common to all templates.

What that means is described in the beginning of the manual.

Happy colouring,

Erik

You think people read documentation.

Even though the images are all Darrin's does not mean that he will make them transparent, so if you have already done so it would be a courtesy to provide them back to him.

Link to comment
Share on other sites

Jennifer Crockett

Erik,

I took a brief look at your TNG Colouring Book selecting a color scheme and then selecting Template 4, the left nav area does not appear to get changed from the TNG red to the color scheme selected.

Yes, I use Template 4 and also noticed the left navigation area stays red.

Jennifer

Link to comment
Share on other sites

Yes, I use Template 4 and also noticed the left navigation area stays red.

Jennifer

Hi,

I'm sorry for the confusion.

I changed the text from "(set classes common to all)" to "(set classes/items used by all") in an attempt to make it more clear.

A preset is a complete css for template #1 but only the same classes are set for the other templates.

(It's a pre-defined set of classes - the same for all templates)

It will be very hard, I think, to give all templates complete preset colour schemes.

But it's on the whish-list now.

And remember (as the manual says): The presets are not intended for final use as is.

(Really not ;) )

Happy colouring!

Erik

Link to comment
Share on other sites

Hi,

I'm sorry for the confusion.

I changed the text from "(set classes common to all)" to "(set classes/items used by all") in an attempt to make it more clear.

A preset is a complete css for template #1 but only the same classes are set for the other templates.

(It's a pre-defined set of classes - the same for all templates)

It will be very hard, I think, to give all templates complete preset colour schemes.

But it's on the whish-list now.

And remember (as the manual says): The presets are not intended for final use as is.

(Really not ;) )

Happy colouring!

Erik

Erik,

I have added a TNG Wiki page on your TNG Colouring Book using the email that Darrin sent to the user lists. Please feel free to update.

I also anchored it in the Getting Started Category page and the Main Page

Very nicely done!

Link to comment
Share on other sites

Thank You, Ken!

I have to say that I'm a bit overwhelmed by all the positive responses I've had today.

I really didn't expect all this.

Thank you, all.

Erik

(It seems like I can't post with quote: I end up at a blank page. This is quickedit)

Link to comment
Share on other sites

Hello all,

I have just now uploaded an update to TCB.

From the changelog:

2013-12-29: V 1.1

* Class .slidedown added to output css (and input). Was missing.

* Template #2: index.php is internationalized: Can use $text[ ] strings, instead of three images:

"Pedigree chart", "Photos & Histories" and "Search".

Update in scripts and Important Stuff file.

* Template #6: Important stuff file updated to make the internationalisation of index.php more clear.

Also minor updates in index.php for the same reason.

* Outputs: All outputs had a string of "-"s to underscore, generating bad HTML.

Now replaced by "- - - ...".

xerxx.se/tcb/

Happy colouring!

Erik

Link to comment
Share on other sites

Jennifer Crockett

Hi,

I'm sorry for the confusion.

I changed the text from "(set classes common to all)" to "(set classes/items used by all") in an attempt to make it more clear.

A preset is a complete css for template #1 but only the same classes are set for the other templates.

(It's a pre-defined set of classes - the same for all templates)

It will be very hard, I think, to give all templates complete preset colour schemes.

But it's on the whish-list now.

And remember (as the manual says): The presets are not intended for final use as is.

(Really not ;) )

Happy colouring!

Erik

For those interested in changing the Template 4 left menu colour from the default red to another colour, what I did in mytngstyle.css was add the following:

/* fieldnameback: background color for column and row title sections */

/* sideback: background color for side and top frames */

/* color changed from #990000 red to #3366CC blue */

.LB_closeAjaxWindow, .bar, .sideback, .fieldnameback {

background-color : #3366CC;

}

I also did all the other colour changes for my site in mytngstyle.css

Jennifer

http://colston-wenck.com

Link to comment
Share on other sites

For those interested in changing the Template 4 left menu colour from the default red to another colour, what I did in mytngstyle.css was add the following:

/* fieldnameback: background color for column and row title sections */

/* sideback: background color for side and top frames */

/* color changed from #990000 red to #3366CC blue */

.LB_closeAjaxWindow, .bar, .sideback, .fieldnameback {

background-color : #3366CC;

}

I also did all the other colour changes for my site in mytngstyle.css

Jennifer

http://colston-wenck.com

Hi Jennifer,

I must say that I'm a bit confused and don't know what to reply ... or reply at all...

When you open TCB with template #4 you can click on the menu (or select the Template specific control-set with a radio-button) and set the colour with the second control from the left.

As you modify the background colour of the menu, you maybe also have to modify the menu items.

The colour controls for them are just to the right of the menu background control.

Click the "Make CSS" (save) button and you'll get the mytngstyle.css - no editing; just a "save as..."

But maybe I misunderstand something..?

Happy colouring

Erik

TNG Coluring Book

Link to comment
Share on other sites

Jennifer Crockett

Hi Jennifer,

I must say that I'm a bit confused and don't know what to reply ... or reply at all...

When you open TCB with template #4 you can click on the menu (or select the Template specific control-set with a radio-button) and set the colour with the second control from the left.

As you modify the background colour of the menu, you maybe also have to modify the menu items.

The colour controls for them are just to the right of the menu background control.

Click the "Make CSS" (save) button and you'll get the mytngstyle.css - no editing; just a "save as..."

But maybe I misunderstand something..?

Happy colouring

Erik

TNG Coluring Book

Yes, I should have said perhaps the "left navigation bar" in a site using template 4, and also should have replied to this post instead:

QUOTE(Ken Roy @ Dec 20 2013, 12:15 PM) *

Erik,

I took a brief look at your TNG Colouring Book selecting a color scheme and then selecting Template 4, the left nav area does not appear to get changed from the TNG red to the color scheme selected.

Yes, I use Template 4 and also noticed the left navigation area stays red.

Jennifer

Link to comment
Share on other sites

Yes, I should have said perhaps the "left navigation bar" in a site using template 4, and also should have replied to this post instead:

QUOTE(Ken Roy @ Dec 20 2013, 12:15 PM) *

Erik,

I took a brief look at your TNG Colouring Book selecting a color scheme and then selecting Template 4, the left nav area does not appear to get changed from the TNG red to the color scheme selected.

Yes, I use Template 4 and also noticed the left navigation area stays red.

Jennifer

Yes..?

The red left menu/navigation bar. With "Search" on top.

That's the one I'm referring to above.

Erik

(Okay, it's 4am here right now so maybe it gets clearer when I wake up. 'nite.)

Link to comment
Share on other sites

Jennifer Crockett

Yes..?

The red left menu/navigation bar. With "Search" on top.

That's the one I'm referring to above.

Erik

(Okay, it's 4am here right now so maybe it gets clearer when I wake up. 'nite.)

Sorry, Erik.

It was my misunderstanding of how to change the left menu bar colour (I was under the misconception it was not possible with the TNG colouring Book.)

... so, I clicked on NOW EDITING - Template spec., Footer Lnk

then, changed the colour in LEFT MENU Backg

SUCCESS

Link to comment
Share on other sites

Sorry, Erik.

It was my misunderstanding of how to change the left menu bar colour (I was under the misconception it was not possible with the TNG colouring Book.)

... so, I clicked on NOW EDITING - Template spec., Footer Lnk

then, changed the colour in LEFT MENU Backg

SUCCESS

Great!

I love sucess-stories!

(I should have mentioned, though, that you have to un-check the checkbox to use RGB-buttons or input values)

Happy colouring,

Erik

TNG Colouring Book

Link to comment
Share on other sites

  • 1 month later...

TNG COLOURING BOOK v1.2 is released today (Feb 12, 2014)

v1.2 is TNG10-compatible and includes the three new templates.

It's easy to make your TCB 1.0 or 1.1 css TNG10 compatible for the mobile site:

Just load it into your template's editor and save it again.

The TNG Colouring Book

Happy colouring!

Erik

xerxx.se/ (genealogy site for Andersson - Hoppe - Sahlin - Thorell)

xerxx.se/tcb/ - TNG Colouring Book

Link to comment
Share on other sites

  • 2 weeks later...

I was using TCB to make some changes to template 14 and couldn't find any control to change the colour of the bar that are on the index page under the Site Title and under the 'Other Features' heading. While not an css expert, using Firebug, I believe the controlling html/css are:

<hr> and

hr {

border: 1px solid #723C01;

height: 0;

}

If this control is not included in TCB, is there some way I can include a colour change for this control into the mytngstlye.css produced by TCB such that the css file could still be loaded correctly into TCB at a later time?

thanks, Arthur

Link to comment
Share on other sites

Hi Arthur,

If I understand you correctly, you should try the "Header & Footer Bar" control in the Template specific controlset.

It's the bottom radio-button.

Or you can click the "HH Side" / "Mouse over HH-side" text and the correct controlset will be available.

It's the second control from the left. You can select flat or 3D bars also.

(Not individually, though)

Happy colouring!

Erik

TNG Colouring Book

Genealogy site f Andersson - Hoppe - Sahlin - Thorell

Link to comment
Share on other sites

Just a large THANK YOU for the T.N.G.Colouring Book. It helped me quickly isolate for my Template (11) I could borrow from another Template (12) the parchment like background by looking for colors. Fantastic tool.

Ron

www.kmtrees.com

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...