Flat and Squared mod
![]() |
The mod Flat and Squared mod needs a new support person since the original mod developer or subsequent developers are no longer available to support the mod | ![]() |
![]() |
Downloads of Flat and Squared mod are restricted to logged in users. If you do not have a user account on the TNG Wiki use the Request Account link to request a user account | ![]() |
![]() |
If you have trouble downloading with Google Chrome, Vivaldi, Brave or other Chromium based browser, try using a right-click and select Open in new Window, then F5, or use another browser such as Firefox | ![]() |
Flat and Squared mod | |||||
---|---|---|---|---|---|
Summary | Makes the interface flat and squared. | ||||
Validation | The mod is XHTML compliant.![]() | ||||
Mod Updated | 01 Oct 2020 | ||||
Download link | For
For
| ||||
Download stats | Flat and Squared | ||||
Author(s) | Erik Hoppe | ||||
Homepage | Flat and Squared mod (this page) | ||||
Mod Support | TNG Community Forums | ||||
Contact Developer | TNG Community Forums | ||||
Latest Mod | 11.1.2.2 for TNG v11.1.2+ 13.0.0.2 for TNG13+ | ||||
Min TNG V | 11.1.2 | ||||
Max TNG V | 14.0+ | ||||
Files modified | |||||
Related Mods | |||||
Notes |
Purpose of the mod
While I was adding Template #15 to the TNG Colouring Book I was inspired by the flat look of the index page - and some recent webdesigns I've seen.
So I created a design add-on that I call
Flat and2
It removes shadows, 3D-borders and rounded corners making the interface "flat and squared".
A site using this mod with template #15 (customized) is found here: botebygden.se (Community research site - in Swedish only).
Developer
This mod was developed by Erik Hoppe who is NOT maintaining or developing this mod.
See Mod Support in the data box top right.
Requirements
TNG 12.0 |
TNG 11.1 |
- A working TNG installation.
- A backup of all affected files (see the list below)
- An installed current version of the Mod Manager (is already included in TNG)
Before Installation
- If you want to use one or more of templates # 9, 10, 11, 13 a/o 14
- If you use the Scrollbox mod
You may need to edit a few things at the end of file flat2.css.php that is found in the mod folder Flat_and_Squared.X ("X" being the current version number).
You will have access to that folder and file when you have un-zipped the download file.
Scrollbox mod users
The mod will by default make a 1-pixel border to mark the scrollbox. This is a good visual sign.
The Flat and 2 mod removes this border.
If you want to keep this border, there are two lines you have to delete or remark (I suggest remark, so they are left there).
>>> Look for this, close to the end of the file:
/* *** SCROLLBOX MOD */ /* *** If you use my SCROLLBOX MOD and WANT TO SEE THE BOX BORDER: DELETE/REMARK the next TWO lines */ #xerxxScrollbox { border: none !important; } #fanWrapper { border: none !important; }
Remark (or delete) the two last lines:
/* *** SCROLLBOX MOD *//* *** If you use my SCROLLBOX MOD and WANT TO SEE THE BOX BORDER: DELETE/REMARK the next TWO lines */ /* #xerxxScrollbox { border: none !important; } */
/* #fanWrapper { border: none !important; } */
Templates #9 and #10
The horizontal bar, below the toplogo and the background of the right side menu headings of the index-pages, are graphics:
If you have set colour to any of them, and want to keep the colour
there are a few lines you need to delete or remark (I suggest remark, so they are left there).
>>> Look for this, close to the end of the file - there are corresponding lines for template #10:
/* *** TEMPLATE #9: If you HAVE SET COLOUR to the horizontal bar: DELETE/REMARK the next line */ .art-nav-l, .art-nav-r { background-image: url('img/f2t9nav.png'); } /* *** TEMPLATE #9: If you HAVE SET COLOUR to the right side menu headings background: DELETE/REMARK the next line */ .art-blockheader .l, .art-blockheader .r { background-image: url('img/f2t9blockheader.png'); }
Remark (or delete) the two lines:
/* *** TEMPLATE #9: If you HAVE SET COLOUR to the horizontal bar: DELETE/REMARK the next line */ /* .art-nav-l, .art-nav-r { background-image: url('img/f2t9nav.png'); } */ /* *** TEMPLATE #9: If you HAVE SET COLOUR to the right side menu headings background: DELETE/REMARK the next line */ /* .art-blockheader .l, .art-blockheader .r { background-image: url('img/f2t9blockheader.png'); } */
Templates #11 and #13
The top horizontal bar will lose its colour. If you use another colour than the light grey, you will have to edit that colour.
>>> Look for this, close to the end of the file - there are corresponding lines for template #13:
/* *** TEMPLATE #11: Set the colour of the Top bar if not original (gray) */ /* Try = class ".art-sheet-cc" (= center background: See file "templates/template11/css/templatestyle.css") */ .art-nav-inner { background-color: #D5D5D5; /* Gray */ }
Change the D5D5D5 to your chosen colour.
(I suggest you look for the colour of class .art-sheet-cc in the TNG file templates/template11 (or 13) /css/mytngstyle.css.
If it's not there, it will be in templates/template11 (or 13) /css/templatestyle.css.)
Template #14
The top and bottom horizontal bars will lose their colour. If you use another colour than the light brown, you will have to edit that colour.
>>> Look for this, close to the end of the file:
/* *** TEMPLATE #14: Set the colour of the Top and Bottom bars if not original (brown) */ /* Try = class "div.innercontainer" = #E2B993, the menu bar (see file "templates/template14/css/templatestyle.css") */ .art-nav-inner { background-color: #CCA37D; /* Original-ish */ }
Change the CCA37D to your chosen colour.
(I suggest you look for the colour of class div.innercontainer in the TNG file templates/template14/css/mytngstyle.css.
If it's not there, it will be in templates/template14/css/templatestyle.css.)
Installation
- Click on the download link, shown in the summary in the upper right corner of the page.
- Un-zip the file you receive and you will find a folder called Flat_and_Squared_mod_v11.1.2.2. Open it.
Now perform the above step (Before Installation) and make sure it's complete.
- Move/copy/FTP the file flat_and_squared_mod_v11.1.2.2.cfg and the included folder Flat_and_Squared.2 to the mods folder of your TNG system.
- Follow the normal automated installation for Mod Manager, as shown in the example Mod Manager - Installing Config Files to install the mod.
In the event of a problem
- Try using the Mod Manager Remove capability
- Replace all affected files with the copies you made before the installation.
- TNG Community Forums
Conflicts
No known conflicts - yet.
Uninstalling the mod
If you want to completely Remove (uninstall) this mod and any tables if created, you should
- click the Remove button to uninstall the mod and then
- click the Delete button to delete the config file from the mods folder.
Revision History
Version | Date | Description |
---|---|---|
v13.0.0.2 | 1 Oct 2020 | Update for TNG v13 |
v11.1.2.2 | 13 Oct 2018 | Template #16 index page works now. Pages in Subdirectories don't lose icons now. DD-menuitems now have thin border. Menus' downarrows are stable. |
v11.1.2.1 | 7 Jan 2018 | Mod Maternal Paternal Lines (if installed), Modmanager styles (both thanks to Jean-Louis V.) and Mainphoto for templ #2 included. Borders in the left menu of template #9 removed. |
v11.1.2.0 | 26 Dec 2017 | Introduction. |
Visualization of this mod
Have a look through the Botebygden site, at the top of the below site-table:
Sites using this mod
If you download and install this mod, please add your TNG site to the table below:
URL | User | Note | Mod-Version | TNG-Version | User-language |
---|---|---|---|---|---|
Botebygden Swedish only (community research site). |
Lars Arén | Open public site: Many of Erik Hoppe's mods on display. | 13.0.0.2 | 13.1.2 | SE |
Racine d'Alsace | J-Louis Valory | Public/Private - Template 1 | 11.1.2 | FR | |
Familiestamboom.frl | Renze Petersohn | Public/Private - Template 16 | 11.1.2.2 | 12.0.2 | NL,DE,EN |
Van Peer Project | Drew McClenaghan | Private Site - Installs and works well with TNG12.3 & 14.0 and Template 15. Great little Mod, currently under modification and testing across all Templates. |
13.0.0.2 | 12.3 / 14.0 | NL,EN |
The SandBox | Drew McClenaghan | The Sand Box - Installs and works well with TNG14.0 14.1 14.2 and 14.3 on Template 15. Upgraded the Sprite Menu icons to test further. | 13.0.0.2 | 14.1 / 14.2 / 14.3 | NL,EN |
TNG Modules Impacted
The following TNG Modules are modified, and should be backed up prior to installing this mod:
- descend.php
- familychart.php
- pedigree.php
- adminlib.php
- genlib.php