Simple Machines Community Forum

Customizing SMF => Graphics and Templates => Theme Site Themes => Topic started by: TwitchisMental on September 11, 2021, 02:40:16 PM

Title: Flatline 2.1
Post by: TwitchisMental on September 11, 2021, 02:40:16 PM
Link to the theme (https://custom.simplemachines.org/index.php?theme=2968)


Flatline
Flatline is a multicolor flat and clean SMF theme.

Features :
Flat Style
Multiple Color Options
Slick Header
Slick Board Index


Author : TwitchisMental



Screenshots :
(https://ibb.co/SxcVrGg)

Version History -

1.1
Bug Fix : The category description will now adjust based on how long the category title is.
Bug Fix : Fixed the menu not showing for mobile.
Bug Fix : Fixed an HTML validation issue with the cat desc.
Adjustment :  Added box-shadow to the numbers in the top menu and main menu.

1.2
Update : Updated to work with SMF 2.1.0
Feature Added : Readded the time/date and news sections.

1.2.1
Update : Updated for SMF 2.1.3
Adjustment: Adjusted some link colors in posts and Admin CP.
Adjustment: Adjusted News&Date section to flow better.

1.2.2
Updated for SMF 2.1.4 and the Attachment UI changes.
Adjustment: Adjusted the background colors for various moderation specific styles.
Adjustment: Added background color to the admin menu and generic menu for blue. Other colors already had the background color.
Adjustment: Adjusted the new post indicator colors and made the text bold for legibility.
Title: Re: Flatline 2.1
Post by: d3vcho on September 11, 2021, 02:44:18 PM
Nice looking theme!

Good job :)
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 11, 2021, 02:55:15 PM
Quote from: d3vcho on September 11, 2021, 02:44:18 PMNice looking theme!

Good job :)
Thank you
Title: Re: Flatline 2.1
Post by: Mick. on September 11, 2021, 03:41:46 PM
Very cool yo!
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 11, 2021, 03:58:16 PM
Quote from: Mick. on September 11, 2021, 03:41:46 PMVery cool yo!
Thank you.
Title: Re: Flatline 2.1
Post by: Antechinus on September 11, 2021, 04:35:37 PM
Interesting. It looks like Dziner Studio's Silent Wave combined with phpBB Prosilver.
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 11, 2021, 04:56:49 PM
Quote from: Antechinus on September 11, 2021, 04:35:37 PMInteresting. It looks like Dziner Studio's Silent Wave combined with phpBB Prosilver.
The border around the category section,info center etc was inspired by Prosilver, nice catch there :). Played around with making a theme/style for phpBB and thought the border thing would look good here.(It does) Other than that though its just based on the Flatline version I made for smf 2.0.

Thank you for looking at it :).

Title: Re: Flatline 2.1
Post by: Antechinus on September 11, 2021, 05:11:25 PM
I've been playing with phpBB a bit too. It's an interesting change. Frankly I still prefer to work with SMF or Elk, but having to do things a different way, and seeing what other people have done with it, is good for getting more ideas.*

Silent Wave was a nice theme too. If you can remember it you have probably been around SMF far too long. :D It was an early experiment wih "mostly flat design". These days you would probably want to change the typography a bit, but a good mixture of blue and grey always works well.

*Incidentally, I think Christian's Prosilver Dark is easily one of the best themes made for phpBB. Worth a look if you haven't seen it. ;)
Title: Re: Flatline 2.1
Post by: marcosbr on September 11, 2021, 09:40:14 PM
Excellent. But I think the forum title and the SMF logo are selfish. I want options that "I" choose!
Title: Re: Flatline 2.1
Post by: Antechinus on September 11, 2021, 09:50:41 PM
You can choose your own. The defaults are just placeholders. ;)
Title: Re: Flatline 2.1
Post by: marcosbr on September 11, 2021, 10:07:10 PM
For beginners like me... Everything makes it easy! Do not use images in the title!
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 11, 2021, 10:37:54 PM
Quote from: marcosbr on September 11, 2021, 09:40:14 PMExcellent. But I think the forum title and the SMF logo are selfish. I want options that "I" choose!
You can modify the theme in any way you see fit.

Thank you for the feedback.
Title: Re: Flatline 2.1
Post by: marcosbr on September 11, 2021, 10:51:49 PM
The question is exactly this...
It is easy for you to change everything, for the "simple mortals" it is more difficult!
  That's why no one leaves the original.
Your theme is great. It was just a suggestion!
I love modifying. As far as I know!
Grateful!
Title: Re: Flatline 2.1
Post by: -Rock Lee- on September 12, 2021, 11:33:32 AM
Oh very nice, brings back memories when I visited my first forums. Great job :D


Regards!
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 12, 2021, 12:41:37 PM
Quote from: marcosbr on September 11, 2021, 11:26:36 PMWhen you mess with the "look" of the house, the tenants think it's great. As long as you don't touch the "structure"
I have been testing wonderful themes. But they mess too much with certain things...
80% of users are NOT experts.
Look for this audience!
Too much water kills the plant.
REPEATING...
Your theme is excellent. I am referring to themes in GENERAL!
One of the favorite things about SMF is its theme/template system and how easy it is to learn.

I think with two small steps you would get more of what you are looking for in this theme.
Copy the index.template.php file from the "default" theme folder and paste it over the version in the "Flatline" theme folder.
Next copy the settings.template.php file from the "default" theme folder and paste it over the version in the "Flatline" theme folder.

This will bring back any features that were removed. However the header will look different and certain sections will be in different locations. This is a possible solution for you.


I understand what you are trying to say about the default features. Luckily there are enough themes made by many different people that you(or anyone else) do not have to use mine.

Something else to note is that my themes are all under the MIT Open Source license, so you can do whatever you want with it. As far as the knowledge for modifying templates goes, we all have to start somewhere. Why not start by modifying something you like right :)?

I hope this clears up any confusion :).

Quote from: RockLee on September 12, 2021, 11:33:32 AMOh very nice, brings back memories when I visited my first forums. Great job :D


Regards!

Thank you, I am glad you like it.


Title: Re: Flatline 2.1
Post by: TwitchisMental on September 12, 2021, 01:16:05 PM
Quote from: Antechinus on September 11, 2021, 05:11:25 PMI've been playing with phpBB a bit too. It's an interesting change. Frankly I still prefer to work with SMF or Elk, but having to do things a different way, and seeing what other people have done with it, is good for getting more ideas.*

Silent Wave was a nice theme too. If you can remember it you have probably been around SMF far too long. :D It was an early experiment wih "mostly flat design". These days you would probably want to change the typography a bit, but a good mixture of blue and grey always works well.

*Incidentally, I think Christian's Prosilver Dark is easily one of the best themes made for phpBB. Worth a look if you haven't seen it. ;)

phpBB is different for sure, but it was fun learning.  As far the Silent Wave theme, that was the one with the water drop in the header correct? If so that was a good theme.

I also agree that Prosilver Dark is one of the best overall themes for phpBB.

Title: Re: Flatline 2.1
Post by: shadav on September 12, 2021, 06:58:42 PM
i've split the posts out of this one to clean it up and keep it on topic about your theme

keep up the good work TwitchisMental
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 27, 2021, 12:18:24 PM
New version has been uploaded. 1.1

1.1
Bug Fix : The category description will now adjust based on how long the category title is.

Adjustment :  Added box-shadow to the numbers in the top menu and main menu.
Title: Re: Flatline 2.1
Post by: RML on October 23, 2021, 02:49:39 AM
Hello. I like your theme, especially the color changer. I installed it on my test board but when I use it on my mobile phone or a smaller tablet there is no mobile menu at all.

You cannot view this attachment.
Title: Re: Flatline 2.1
Post by: TwitchisMental on October 23, 2021, 02:09:45 PM
Quote from: RML on October 23, 2021, 02:49:39 AMHello. I like your theme, especially the color changer. I installed it on my test board but when I use it on my mobile phone or a smaller tablet there is no mobile menu at all.

You cannot view this attachment.
Thank you for reporting this bug. I will get this fixed ASAP.

I have one or two others to work out aswell.

Edit: The fixed version has been uploaded.
Title: Re: Flatline 2.1
Post by: RML on October 24, 2021, 03:32:06 AM
Many thanks TwitchisMental.
Title: Re: Flatline 2.1
Post by: TwitchisMental on February 11, 2022, 10:51:00 AM
Version 1.2 has been uploaded and ready for download.
1.2
Update : Updated to work with SMF 2.1.0
Feature Added : Readded the time/date and news sections.

You cannot view this attachment.
Title: Re: Flatline 2.1
Post by: RML on February 21, 2022, 10:58:11 AM
Hello. I have a problem again with this theme. I upgraded my 2.1 RC3 site to 2.1.1. Before the upgrade I deleted all themes and mods. After the upgrade installed the latest version of your theme and it doesn't look good. (On a clean 2.1.1 install no such problem with your theme but I don't really want to do that.) Is there any solution for this problem?

You cannot view this attachment.
Title: Re: Flatline 2.1
Post by: TwitchisMental on February 21, 2022, 03:11:24 PM
Quote from: RML on February 21, 2022, 10:58:11 AMHello. I have a problem again with this theme. I upgraded my 2.1 RC3 site to 2.1.1. Before the upgrade I deleted all themes and mods. After the upgrade installed the latest version of your theme and it doesn't look good. (On a clean 2.1.1 install no such problem with your theme but I don't really want to do that.) Is there any solution for this problem?

You cannot view this attachment.
If it is working without issue on a clean install, that leads me to believe this is being caused by a mod or something else.

Do you have a link to the forum ?
Title: Re: Flatline 2.1
Post by: RML on February 22, 2022, 02:47:39 AM
As I said I uninstalled all themes and mods before upgrading so there was no any mods installed when I upgreded the forum so it can't cause by any mod. In the meantime, I noticed that if I log out and see the forum as a guest, the situation is even worse.

You cannot view this attachment.

Link to my forum:
https://board.missyforum.info/index.php

You can log in with guest user name and password.
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 03:09:14 AM
Just wondering: you css is minified. Was this minified from 'before'  the upgrade?

You may want to check your css (just to be sure) and switch the option to Minify css off
Then hard refresh the page (clear the cache)

Admin > Configuration > Features and options > General

Minimize CSS and JavaScript files > switch off
Title: Re: Flatline 2.1
Post by: RML on February 22, 2022, 05:21:07 AM
Quote from: @rjen on February 22, 2022, 03:09:14 AMJust wondering: you css is minified. Was this minified from 'before'  the upgrade?

Yes, it was. Now I unchecked it, cleard the casche, cleard all the cookies and cashe of my browser too but it didn't help.
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 05:45:02 AM
Found it.

There is an issue with the theme: if the news is not showing on the main page, the div class="newsandtime" is not closed properly.

Go to Admin > Configuration > Current theme

then choose option: "Enable random news line in the forum header" and you issue will go away..
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 05:54:38 AM
Index.template.php

find
    echo '
<div class="newsandtime">
<div class="row">
     <div class="column">
<div class="user">
<time datetime="', smf_gmstrftime('%FT%TZ'), '">', $context['current_time'], '</time>';
if ($context['user']['is_logged'])
echo '
<ul class="unread_links">
<li>
<a href="', $scripturl, '?action=unread" title="', $txt['unread_since_visit'], '">', $txt['view_unread_category'], '</a>
</li>
<li>
<a href="', $scripturl, '?action=unreadreplies" title="', $txt['show_unread_replies'], '">', $txt['unread_replies'], '</a>
</li>
</ul>

    </div></div>
 
  <div class="column">';
// Show a random news item? (or you could pick one from news_lines...)

if (!empty($settings['enable_news']) && !empty($context['random_news_line']))
echo '
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>
    </div>
      </div></div>';

// The main content should go here.

replace with
    echo '
<div class="newsandtime">
<div class="row">
<div class="column">
<div class="user">
<time datetime="', smf_gmstrftime('%FT%TZ'), '">', $context['current_time'], '</time>';
if ($context['user']['is_logged'])
echo '
<ul class="unread_links">
<li>
<a href="', $scripturl, '?action=unread" title="', $txt['unread_since_visit'], '">', $txt['view_unread_category'], '</a>
</li>
<li>
<a href="', $scripturl, '?action=unreadreplies" title="', $txt['show_unread_replies'], '">', $txt['unread_replies'], '</a>
</li>
</ul>
</div>
</div>';
 
// Show a random news item? (or you could pick one from news_lines...)

if (!empty($settings['enable_news']) && !empty($context['random_news_line'])) {
echo '
<div class="column">
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>
</div>';
}
echo '
</div>
</div>';

// The main content should go here.
Title: Re: Flatline 2.1
Post by: RML on February 22, 2022, 10:02:24 AM
Many thanks for your help @rjen. It worked.
Title: Re: Flatline 2.1
Post by: RML on February 22, 2022, 12:00:22 PM
Sorry for bother you again but it solved the problem only for logged in users. This is what guests see.

You cannot view this attachment.
Title: Re: Flatline 2.1
Post by: Diego Andrés on February 22, 2022, 12:22:34 PM
It's a bug in the theme, to fix:

index.template.php
Code (Search) Select
if (!empty($settings['enable_news']) && !empty($context['random_news_line']))
echo '
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>
    </div>
      </div></div>';
Code (Replace) Select
if (!empty($settings['enable_news']) && !empty($context['random_news_line']))
echo '
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>';

echo '
    </div>
      </div></div>';
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 12:30:33 PM
I believe that is what I already wrote?

What fix did you apply?
Title: Re: Flatline 2.1
Post by: Diego Andrés on February 22, 2022, 12:35:03 PM
Your fix is more complete for sure, I missed your reply.
Btw the theme is not marked for 2.1.1, is that a mistake? Just noticed none are marked for it so just no changes in the themes, they should work just fine  :)
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 12:40:10 PM
Actually, my fix was incomplete: there is indeed another issue due to user being guest...

Let me post the complete fix...
Title: Re: Flatline 2.1
Post by: @rjen on February 22, 2022, 12:55:59 PM
find

    echo '
<div class="newsandtime">
<div class="row">
     <div class="column">
<div class="user">
<time datetime="', smf_gmstrftime('%FT%TZ'), '">', $context['current_time'], '</time>';
if ($context['user']['is_logged'])
echo '
<ul class="unread_links">
<li>
<a href="', $scripturl, '?action=unread" title="', $txt['unread_since_visit'], '">', $txt['view_unread_category'], '</a>
</li>
<li>
<a href="', $scripturl, '?action=unreadreplies" title="', $txt['show_unread_replies'], '">', $txt['unread_replies'], '</a>
</li>
</ul>

    </div></div>
 
  <div class="column">';
// Show a random news item? (or you could pick one from news_lines...)

if (!empty($settings['enable_news']) && !empty($context['random_news_line']))
echo '
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>
    </div>
      </div></div>';

// The main content should go here.

replace with

    echo '
<div class="newsandtime">
<div class="row">
<div class="column">
<div class="user">
<time datetime="', smf_gmstrftime('%FT%TZ'), '">', $context['current_time'], '</time>';
if ($context['user']['is_logged']) {
echo '
<ul class="unread_links">
<li>
<a href="', $scripturl, '?action=unread" title="', $txt['unread_since_visit'], '">', $txt['view_unread_category'], '</a>
</li>
<li>
<a href="', $scripturl, '?action=unreadreplies" title="', $txt['show_unread_replies'], '">', $txt['unread_replies'], '</a>
</li>
</ul>';
}
echo '
</div>
</div>';
 
// Show a random news item? (or you could pick one from news_lines...)

if (!empty($settings['enable_news']) && !empty($context['random_news_line'])) {
echo '
<div class="column">
<div class="news">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>
</div>
</div>';
}
echo '
</div>
</div>';

// The main content should go here.
Title: Re: Flatline 2.1
Post by: TwitchisMental on February 22, 2022, 01:29:33 PM
Looks like @rjen has already resolved this issue.

I have uploaded the fixed version. Sorry about that.
Title: Re: Flatline 2.1
Post by: RML on February 23, 2022, 01:21:31 AM
Thank you very much @rjen, now everything is perfect.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 16, 2022, 02:11:21 PM
Hi

i'm working to open up my community forum later on, and at the moment still build up smf on my localhost. flatline simply a beautiful theme. for my community, i'm intend my forum users on the same page, means everyone check in into the very same place.Thus, may i know how can i remove the color selector,located on top left?  thank you

Title: Re: Flatline 2.1
Post by: TwitchisMental on August 16, 2022, 02:34:08 PM
Quote from: iqbalresources on August 16, 2022, 02:11:21 PMHi

i'm working to open up my community forum later on, and at the moment still build up smf on my localhost. flatline simply a beautiful theme. for my community, i'm intend my forum users on the same page, means everyone check in into the very same place.Thus, may i know how can i remove the color selector,located on top left?  thank you

Open index.template.php in your favorite editor.

Find line 369
    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            <div class="styleselect">
            <a class="red" href="', $scripturl, '?variant=red" title="'.$txt['colorred'].'"></a>
            <a class="blue" href="', $scripturl, '?variant=blue" title="'.$txt['colorblue'].'"></a>   
            <a class="green" href="', $scripturl, '?variant=green" title="'.$txt['colorgreen'].'"></a>
            <a class="purple" href="', $scripturl, '?variant=purple" title="'.$txt['colorpurple'].'"></a>
            <a class="turquoise" href="', $scripturl, '?variant=turquoise" title="'.$txt['colorturquoise'].'"></a>
            </div>
            </div>

Replace With

    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            </div>
Title: Re: Flatline 2.1
Post by: iqbalresources on August 16, 2022, 02:54:32 PM
Quote from: TwitchisMental on August 16, 2022, 02:34:08 PM
Quote from: iqbalresources on August 16, 2022, 02:11:21 PMHi

i'm working to open up my community forum later on, and at the moment still build up smf on my localhost. flatline simply a beautiful theme. for my community, i'm intend my forum users on the same page, means everyone check in into the very same place.Thus, may i know how can i remove the color selector,located on top left?  thank you

Open index.template.php in your favorite editor.

Find line 369
    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            <div class="styleselect">
            <a class="red" href="', $scripturl, '?variant=red" title="'.$txt['colorred'].'"></a>
            <a class="blue" href="', $scripturl, '?variant=blue" title="'.$txt['colorblue'].'"></a>   
            <a class="green" href="', $scripturl, '?variant=green" title="'.$txt['colorgreen'].'"></a>
            <a class="purple" href="', $scripturl, '?variant=purple" title="'.$txt['colorpurple'].'"></a>
            <a class="turquoise" href="', $scripturl, '?variant=turquoise" title="'.$txt['colorturquoise'].'"></a>
            </div>
            </div>

Replace With

    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            </div>


thank you!  :)
Title: Re: Flatline 2.1
Post by: TwitchisMental on August 16, 2022, 02:59:08 PM
Quote from: iqbalresources on August 16, 2022, 02:54:32 PM
Quote from: TwitchisMental on August 16, 2022, 02:34:08 PM
Quote from: iqbalresources on August 16, 2022, 02:11:21 PMHi

i'm working to open up my community forum later on, and at the moment still build up smf on my localhost. flatline simply a beautiful theme. for my community, i'm intend my forum users on the same page, means everyone check in into the very same place.Thus, may i know how can i remove the color selector,located on top left?  thank you

Open index.template.php in your favorite editor.

Find line 369
    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            <div class="styleselect">
            <a class="red" href="', $scripturl, '?variant=red" title="'.$txt['colorred'].'"></a>
            <a class="blue" href="', $scripturl, '?variant=blue" title="'.$txt['colorblue'].'"></a>   
            <a class="green" href="', $scripturl, '?variant=green" title="'.$txt['colorgreen'].'"></a>
            <a class="purple" href="', $scripturl, '?variant=purple" title="'.$txt['colorpurple'].'"></a>
            <a class="turquoise" href="', $scripturl, '?variant=turquoise" title="'.$txt['colorturquoise'].'"></a>
            </div>
            </div>

Replace With

    echo '
    <div id="wrapper">
        <div id="header">
            <h1 class="forumtitle">
                <a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/custom/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>
            </h1>   
            </div>


thank you!  :)
You're welcome :).
Title: Re: Flatline 2.1
Post by: TwitchisMental on August 16, 2022, 04:55:10 PM
Quote from: iqbalresources on August 16, 2022, 04:28:56 PMone more thing. how do i change the font color of 'my community'? . tqvm
Open index.css

Find Line 1165
h1.forumtitle a {
color: #a85400;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
}

Change color: #a85400; to whatever you'd like it to be.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 16, 2022, 05:54:00 PM
One more thing. how can i make 'link' words (thread title) bold? (in attachment, the words shown i.e 'saja'). i've tried font-weight : bold; , but still couldn't. thank you.

Title: Re: Flatline 2.1
Post by: TwitchisMental on August 16, 2022, 07:13:44 PM
I am not seeing an attachment.

With that said it is bold by default. If you want it bigger, it would be best to change the font-size.

Find line 3715

h3.catbg {
overflow: hidden;
font-size: 1.1em;
font-family: "Tahoma", sans-serif;
}
Change font-size to whatever you'd like.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 17, 2022, 06:05:16 PM
thank you!  ;)
Title: Re: Flatline 2.1
Post by: iqbalresources on August 18, 2022, 01:03:53 PM
Hi

May i know if flatline have option tu put facebook, twitter and github (not sure) icon on board. similar like features on Bend. thank you
Title: Re: Flatline 2.1
Post by: TwitchisMental on August 18, 2022, 02:29:38 PM
Quote from: iqbalresources on August 18, 2022, 01:03:53 PMHi

May i know if flatline have option tu put facebook, twitter and github (not sure) icon on board. similar like features on Bend. thank you
Unfortunately, Flatline does not have that feature.  I simply remade the SMF 2.0 version for SMF 2.1.

Where would you want to put the social icons ? I might be able to whip something up for you or anyone to add to it.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 18, 2022, 02:55:14 PM
Quote from: TwitchisMental on August 18, 2022, 02:29:38 PM
Quote from: iqbalresources on August 18, 2022, 01:03:53 PMHi

May i know if flatline have option tu put facebook, twitter and github (not sure) icon on board. similar like features on Bend. thank you
Unfortunately, Flatline does not have that feature.  I simply remade the SMF 2.0 version for SMF 2.1.

Where would you want to put the social icons ? I might be able to whip something up for you or anyone to add to it.

owh. too bad  :(  . eh? really appreciate if u can help. still thinking it is might better to have social icon. just in case website down, would be able to inform everyone.  :)
Title: Re: Flatline 2.1
Post by: iqbalresources on August 18, 2022, 03:10:55 PM
I was thinking at the below header , the red spot. the menu button on the left side, and social icon on the right side. pretty much balance i guess. :D
(https://postimg.cc/30hn9qpq)

but to be honest, u might have better idea. i don't have any problem to follow. no problem  :)
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 07:39:58 AM
Hi

i was thinking to modify the index.css (blue color) into maroon color. and planning tu put background image. But that background didn't appear. is it something related with the code that i might wrongly displace?. before this, i'm adjust in index_red, and it worked. but rite now, not sure about index.css  ;D

body {
        background:#d2d2d2 url(../images/background.png);
background-repeat: repeat;
background: #e9eef2;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #4d4d4d;
display: flex;
flex-direction: column;
min-height: 100vh;
}
Title: Re: Flatline 2.1
Post by: Dzonny on August 19, 2022, 07:46:25 AM
Can you provide a URL so we can see it, as we don't all have that specific theme installed :)
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 07:58:17 AM
err..it's okay brother. i'm playing around localhost at the moment. may start acquiring hosting web next month, if possible.  ;D . Normally i'm playing around index_red (the closest to the maroon). But i'm thinking to disable color selection, and straight re-build up maroon color thru modifying index.css (default blue)  :)

still thinking that i'm may wrongly displace the quoted code. no worries, theme author might help me pin point the exact problem.  ;)
Title: Re: Flatline 2.1
Post by: Dzonny on August 19, 2022, 08:15:11 AM
I just saw that you have two background elements in your code. You should remove first one.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 08:25:48 AM
u mean this one?

background:#d2d2d2
done remove. and image still not appear.  :'(

i tried remove this too

background: #e9eef2;
same too.  :'(
Title: Re: Flatline 2.1
Post by: Dzonny on August 19, 2022, 08:33:17 AM
Remove both of those and use:
background-image: url(../images/background.png);
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 08:50:29 AM
done remove both code, and use as ur suggestion.

body {
        background-image : url(../images/background.png);
background-repeat: repeat;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #4d4d4d;
display: flex;
flex-direction: column;
min-height: 100vh;
}

Still the same unfortunately.  :'(
Title: Re: Flatline 2.1
Post by: Dzonny on August 19, 2022, 08:56:36 AM
Are you sure that the image path is correct? Also are you sure it's not showing, maybe you just can't see it, maybe try to tweak it a little with:
background-position: center;
background-repeat: no-repeat;
background-size: cover;

Again, it's hard to help more without actual url, so just throwing some suggestions here...
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 10:51:47 AM
the path is correct.  ;)

yup. i'm too thinking some tweak might able to 'unhide' that image. let me try as per your suggestion.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 19, 2022, 09:21:00 PM
Quote from: Dzonny on August 19, 2022, 08:56:36 AMAre you sure that the image path is correct? Also are you sure it's not showing, maybe you just can't see it, maybe try to tweak it a little with:
background-position: center;
background-repeat: no-repeat;
background-size: cover;

Again, it's hard to help more without actual url, so just throwing some suggestions here...

succeed!. image successfully appeared. stumbled upon the code at the bottom section of the index.css.  :D
Title: Re: Flatline 2.1
Post by: iqbalresources on August 21, 2022, 05:10:01 PM
Hi

may i know, how can i change the color of the thread's title font in the board index? (testing stuff). I've been looking for the code's dark grey color, but still couldn't find it.  :) 

(https://postimg.cc/3kGxX4wq)
Title: Re: Flatline 2.1
Post by: TwitchisMental on August 21, 2022, 05:59:45 PM
Quote from: iqbalresources on August 21, 2022, 05:10:01 PMHi

may i know, how can i change the color of the thread's title font in the board index? (testing stuff). I've been looking for the code's dark grey color, but still couldn't find it.  :) 

(https://postimg.cc/3kGxX4wq)
It may help you in the future to use your web browsers inspection tool to find the class you are looking for.

In this case the font color is being controlled by the h1,h2,h3,h4,h5,h6 section of index.css (Line 239)

If you want to change that specific title go to line 4187

.display_title {
  font-weight: normal;
  font-size: 26px;
  margin-bottom: 0.25em;
  line-height: 1.05em;
  overflow-wrap: break-word;
}

Add this to the bottom and change it to whatever color you would like -

color: #000;
End Result -

.display_title {
  font-weight: normal;
  font-size: 26px;
  margin-bottom: 0.25em;
  line-height: 1.05em;
  overflow-wrap: break-word;
  color: #000;
}
Title: Re: Flatline 2.1
Post by: iqbalresources on August 21, 2022, 06:33:07 PM
Quote from: TwitchisMental on August 21, 2022, 05:59:45 PM
Quote from: iqbalresources on August 21, 2022, 05:10:01 PMHi

may i know, how can i change the color of the thread's title font in the board index? (testing stuff). I've been looking for the code's dark grey color, but still couldn't find it.  :) 

(https://postimg.cc/3kGxX4wq)
It may help you in the future to use your web browsers inspection tool to find the class you are looking for.

In this case the font color is being controlled by the h1,h2,h3,h4,h5,h6 section of index.css (Line 239)

If you want to change that specific title go to line 4187

.display_title {
  font-weight: normal;
  font-size: 26px;
  margin-bottom: 0.25em;
  line-height: 1.05em;
  overflow-wrap: break-word;
}

Add this to the bottom and change it to whatever color you would like -

color: #000;
End Result -

.display_title {
  font-weight: normal;
  font-size: 26px;
  margin-bottom: 0.25em;
  line-height: 1.05em;
  overflow-wrap: break-word;
  color: #000;
}


thank you!  :)
Title: Re: Flatline 2.1
Post by: iqbalresources on August 26, 2022, 11:30:32 AM
Hi

if u could possibly help me, how could i change the font color of required information?. I've been looking around index.css, but still couldn't find it. not sure which code. thank you  :)


(https://postimg.cc/qhvYhmNT)
 
Title: Re: Flatline 2.1
Post by: TwitchisMental on August 26, 2022, 11:45:51 AM
Quote from: iqbalresources on August 26, 2022, 11:30:32 AMHi

if u could possibly help me, how could i change the font color of required information?. I've been looking around index.css, but still couldn't find it. not sure which code. thank you  :)


(https://postimg.cc/qhvYhmNT)
 
open the index.css and go to line 3765

h3.titlebg, h4.titlebg, .titlebg, h3.subbg, h4.subbg, .subbg {
  background: none;
  color: rgb(85, 85, 85);
  font-family: "Tahoma", sans-serif;
  font-weight: bold;
  overflow: hidden;
  padding: 6px 12px 5px 12px;
  text-shadow: none;
}

Change the color to whatever you'd like.
Title: Re: Flatline 2.1
Post by: iqbalresources on August 26, 2022, 12:59:32 PM
Thank you!  ;)
Title: Re: Flatline 2.1
Post by: TwitchisMental on December 03, 2022, 10:05:03 PM
New Version Uploaded -

1.2.1
Update : Updated for SMF 2.1.3
Adjustment: Adjusted some link colors in posts and Admin CP.
Adjustment: Adjusted News&Date section to flow better.
Title: Re: Flatline 2.1
Post by: TwitchisMental on June 11, 2023, 08:21:43 PM
New Version Uploaded:

1.2.2
Updated for SMF 2.1.4 and the Attachment UI changes.
Adjustment: Adjusted the background colors for various moderation specific styles.
Adjustment: Added background color to the admin menu and generic menu for the blue style. Other colors already had the background color.
Adjustment: Adjusted the new post indicator colors and bolded the text for legibility.
Title: Re: Flatline 2.1
Post by: VerlaKay on July 07, 2023, 10:55:47 PM
Is there a simple way an ignoramus like me can replace the word FLATLINE with other words or an image? I know NOTHING about coding except that I can destroy a complete program by touching ANYTHING in the code. 

Thank you for any and all help.

Verla Kay
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 07, 2023, 11:14:56 PM
Quote from: VerlaKay on July 07, 2023, 10:55:47 PMIs there a simple way an ignoramus like me can replace the word FLATLINE with other words or an image? I know NOTHING about coding except that I can destroy a complete program by touching ANYTHING in the code. 

Thank you for any and all help.

Verla Kay
The easiest way to do this would be replacing the logo.png file with your own logo.png.

It can be found in Flatline>images>custom .




Title: Re: Flatline 2.1
Post by: VerlaKay on July 08, 2023, 12:35:51 AM
Thank you very much for your super speedy response. I'll see if I can find that file. The forum is hosted on SiteGround....
Title: Re: Flatline 2.1
Post by: VerlaKay on July 08, 2023, 05:56:28 PM
I found the file and uploaded my image to the correct place on the server, but it's still showing a broken question mark for the image. Is there a specific size that the image needs to be to show up on the header?
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 08, 2023, 06:50:09 PM
Quote from: VerlaKay on July 08, 2023, 05:56:28 PMI found the file and uploaded my image to the correct place on the server, but it's still showing a broken question mark for the image. Is there a specific size that the image needs to be to show up on the header?
No specific size needed.

I would first try to do a hard refresh (control key + f5) .

If it is still showing a question mark, that usually means the file is not found.  I have registered on your forum to investigate further, but it seems I will need approval first.
Title: Re: Flatline 2.1
Post by: VerlaKay on July 08, 2023, 07:39:46 PM
Oops! You registered for the wrong forum. The one with the problem is

https://www.scbwidiscussionboards.org/index.php

Be sure to put in the reason for registering that you are helping Verla Kay with the FlatLine image so the other Admins won't block, delete or ban you because you aren't associated with the Kidlit industry!
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 08, 2023, 07:52:27 PM
Okay done and done.
Title: Re: Flatline 2.1
Post by: VerlaKay on July 08, 2023, 08:02:42 PM
It's UP! Thank you, thank you, THANK YOU!
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 08, 2023, 08:19:47 PM
Quote from: VerlaKay on July 08, 2023, 08:02:42 PMIt's UP! Thank you, thank you, THANK YOU!
I have not done anything, I am still awaiting admin approval. Sounds like it may have just been a cache issue.

Either way I am happy to hear that the issue is resolved :).
Title: Re: Flatline 2.1
Post by: VerlaKay on July 08, 2023, 10:38:58 PM
Well, without your excellent information on how to find the file and which file needed to be replaced, I would not have been able to do this, so thanks are still appropriate. :-)
Title: Re: Flatline 2.1
Post by: VerlaKay on July 09, 2023, 07:47:05 PM
Some people on my forum have visual impairment and have requested a darker color for the text on the site. Is there an easy way for me to turn the text to all black, for instance. I know I would probably need to go into the code of the template and change the color to #000000, but I am TERRIFIED of fooling around in the code! All I know about codes is that it is EXTREMELY easy to break the entire site by fooling around with it.
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 09, 2023, 08:10:33 PM
Quote from: VerlaKay on July 09, 2023, 07:47:05 PMSome people on my forum have visual impairment and have requested a darker color for the text on the site. Is there an easy way for me to turn the text to all black, for instance. I know I would probably need to go into the code of the template and change the color to #000000, but I am TERRIFIED of fooling around in the code! All I know about codes is that it is EXTREMELY easy to break the entire site by fooling around with it.
The main body text found in index.css would be the one to change

open index.css

Find :

body {
background: #e9eef2;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #4d4d4d;
display: flex;
flex-direction: column;
min-height: 100vh;
}


Replace :

body {
background: #e9eef2;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #000;
display: flex;
flex-direction: column;
min-height: 100vh;
}


Title: Re: Flatline 2.1
Post by: VerlaKay on July 09, 2023, 08:19:28 PM
Thank you. Please wish me luck.... I might wait until late tonight to attempt this so if I mess things up I'll have time to put it back together before too many people notice what I did....
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 09, 2023, 08:47:02 PM
Quote from: VerlaKay on July 09, 2023, 08:19:28 PMThank you. Please wish me luck.... I might wait until late tonight to attempt this so if I mess things up I'll have time to put it back together before too many people notice what I did....
Backup backup backup :).

Make a copy of the index.css and name it something like index1.css.

So if you mess up, you can delete the bad one and rename the backup to index.css and problem solved :).
Title: Re: Flatline 2.1
Post by: Steve on July 10, 2023, 07:50:55 AM
If you find that you really, REALLY, don't want to mess with the code for fear of breaking something, any one of us could easily be persuaded to do it for you.

It would be better for you to do it so you learn and Twitch's post about backing up is key.

But like I said, we are available if you need us.
Title: Re: Flatline 2.1
Post by: VerlaKay on July 10, 2023, 09:43:49 AM
The backup is what I planned to do, but SiteGround says I've used all of my allowed manual saves and when I was logged into their site and tried to delete the existing manual saves, there was no way to do it. Their instructions said to click on the three dots to the right of the backup, then scroll down to the DELETE menu item, which was the fifth thing in the dropdown menu...only there are only four items in the menu. No delete choice. I thought maybe it was because I was on my iPad, not a computer, so I dug out my MacBook laptop and tried from it, but came up with the same problem. No delete option. I hunted "forever" to find a way to contact SiteGround and finally gave up. I'll have to try again today, when, hopefully, they will have their phones manned and their help chats open. It's very frustrating!

I'll try the css copy thing and see if SiteGround will let me do that! ETA Nope. That didn't work, either. Couldn't find any way to duplicate the .css file. I tried using the COPY menu item, and it said the file was copied, but I couldn't find a copy of it anywhere.
Title: Re: Flatline 2.1
Post by: Steve on July 11, 2023, 08:16:07 AM
Do you have and/or know how to use FTP?
Title: Re: Flatline 2.1
Post by: VerlaKay on July 11, 2023, 10:26:05 AM
No on the FTP. Finally got ahold of someone at SiteGround and discovered I don't have permission to delete the manual saves because I'm not the "owner" of the site anymore, but just a collaborator. Sarah Baker will have to delete the manual saves when she returns from her vacation on Thursday (I originally created and now run the board for her).
Title: Re: Flatline 2.1
Post by: VerlaKay on July 14, 2023, 06:46:52 PM
I did it! Got the black #000000 into the code.

THANK YOU for all your help!
Title: Re: Flatline 2.1
Post by: TwitchisMental on July 14, 2023, 07:23:30 PM
Quote from: VerlaKay on July 14, 2023, 06:46:52 PMI did it! Got the black #000000 into the code.

THANK YOU for all your help!
Good to hear :). You're welcome.
Title: Re: Flatline 2.1
Post by: iqbalresources on September 16, 2023, 03:14:10 AM
Hello

I'm in the midst trying to customize the forum, to make it align with main website themes. So i need to adjust the font and font size of the forum. May i know :

i) how do i customize the font-size of last post column? at least to make the font size similar with the font size of board description


ii) how do i customize the font size of content? just to make it a little bit bigger



Thank you
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 16, 2023, 11:02:34 AM
This is where the inspect tool in your browser comes in quite handy ;).

Quotei) how do i customize the font-size of last post column? at least to make the font size similar with the font size of board description

Find:
.lastpost {
width: 30%;
font-size: 0.9em;
padding-top: 3px;
}


Change the font-size: 0.9em; to whatever you wish.
Quoteii) how do i customize the font size of content? just to make it a little bit bigger

Find:
body {
background: #e9eef2;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #4d4d4d;
display: flex;
flex-direction: column;
min-height: 100vh;
}

Adjust the font: to whatever you would like.
Title: Re: Flatline 2.1
Post by: iqbalresources on September 16, 2023, 09:53:51 PM
Thank you!. Really appreciate the help.

and may i know, how to customize font color for board titles (in board description), last post and poster (in last column)? . I've tried make some tweak in css, but the color didn't change :

.lastpost {
width: 30%;
font-size: 1em;
font-color: #222222;
padding-top: 3px;
}
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 16, 2023, 11:02:15 PM
1.
Line 4818
.info .subject {
    font-weight: 700;
    font-size: 1.1em;
    color: #3498db;
}


2.
If you mean the link colors in the last post section those are controlled by the a:link class -

Line 4257
a:link {
 color: #3498db
}

If you want specifically the last post links to change you can throw this under the .lastpost class.

.lastpost a {
    color: whatever color you want;
    text-decoration: none;
}
Title: Re: Flatline 2.1
Post by: iqbalresources on September 17, 2023, 04:41:51 AM
Quote from: TwitchisMental on September 16, 2023, 11:02:15 PM1.
Line 4818
.info .subject {
    font-weight: 700;
    font-size: 1.1em;
    color: #3498db;
}


2.
If you mean the link colors in the last post section those are controlled by the a:link class -

Line 4257
a:link {
 color: #3498db
}

If you want specifically the last post links to change you can throw this under the .lastpost class.

.lastpost a {
    color: whatever color you want;
    text-decoration: none;
}


Thanks!  :)
Title: Re: Flatline 2.1
Post by: Steve on September 17, 2023, 07:00:00 AM
Quote from: TwitchisMental on September 16, 2023, 11:02:34 AMThis is where the inspect tool in your browser comes in quite handy
@iqbalresources - you might want to think about learning a little bit about using that tool. It saves a lot of questions.  ;D
Title: Re: Flatline 2.1
Post by: iqbalresources on September 26, 2023, 10:31:39 AM
Hello

i've been looking the css in index.css, to change color for the bars of Forum Stats and Users online in Info Center, but couldn't find it.



So i tried to look thru inspect and view source, to find any hint that can help me find the route to the css, but still no avail.

May i know? where could i find the css code?, so i could change the color for both bars

tqvm
Title: Re: Flatline 2.1
Post by: TwitchisMental on September 26, 2023, 04:36:00 PM
Line 4775

h4.subbg, .subbg {
  background: #2c3e50;
  color: #fcfcfc;
  text-shadow: 2px 2px 2px rgba(0,0,0,.2);
  font-family: "Tahoma", sans-serif;
  font-weight: bold;
  overflow: hidden;
  padding: 6px 12px 5px 12px;
}
Title: Re: Flatline 2.1
Post by: scheissman on February 01, 2024, 07:06:42 AM
Hey there, been using this theme for a while and this is the first time I am having some trouble .
I am using the blue theme and my admin and moderation page only show html on white page , when i change the color to any other, it works as it should. Do you have any idea what should I do?
TIA
Title: Re: Flatline 2.1
Post by: TwitchisMental on February 02, 2024, 12:26:50 PM
That is very strange the first thing I would do is just try replacing all of the theme files.   Does this happen with any other theme?