Aurora

[TwitchisMental]

Link to the theme

Aurora SMF Theme

A colorful, modern, and responsive SMF theme.

Features :
Responsive Design
Flat Style
Updated board index
Updated post area
Font Awesome icons
Colorful dark theme

License :

Font Awesome License - https://fontawesome.com/license/free

SMF Version :


Screenshots :

Board Index Desktop : 



Board Index Tablet :



Board Index Phone :



Shoutouts :
Shoutout to Antechinus for the post area trick. https://www.simplemachines.org/community/index.php?topic=578882.0

Shoutout to Mick. for the font-awesome trick.  https://www.simplemachines.org/community/index.php?topic=579226.0

Thank you to everyone who offered their input here - https://www.simplemachines.org/community/index.php?topic=579339.0

Thank you to mickjav for the theme name idea.


Release Notes :

Code Select Expand

1.0 : Original Release

Code Select Expand

1.1 :
*Fixed theme preview
*Fixed the icon display issue in the profile settings text.
*Fixed last post not showing up correctly on smaller resolutions.
*Fixed the editor colors being to hard to read.
*Fixed the events calendar not showing properly.

Code Select Expand

1.2 :
Update: Updated to work with SMF 2.1.0
Updated Board Icons To Some Recolored Bootstrap Icons
Adjustment: Adjusted some colors in the admin area and certain borders.

Code Select Expand

1.2.1 :
Adjustment: Fixed multiple color issues.
Bug Fix : Fixed certain icons not displaying.

Code Select Expand

1.2.2 :
Update : Updated for SMF 2.1.3
Adjustment: Fixed more color issues with the Admin CP borders, Quote Box, Code Box, and the Editor.

Code Select Expand

1.2.3
Updated for SMF 2.1.4 and the Attachment UI changes.
Adjustment: Adjusted the background colors for various moderation specific styles.
Adjustment: Adjusted some text colors and background colors in the ACP to follow with the rest of the theme.
Adjustment: Adjusted several border colors to match the rest of the theme.

[Mick.]

Sweet theme! Two thumbs up

[TwitchisMental]

New Version 1.1

Code Select Expand

*Fixed theme preview
*Fixed the icon display issue in the profile settings text.
*Fixed last post not showing up correctly on smaller resolutions.


[mickjav]

Very Nice Job Just installed on my Support Site Looks smooth 

[TwitchisMental]

Sweet theme! Two thumbs up

Very Nice Job Just installed on my Support Site Looks smooth 

Thank you both for the compliments.

[mickjav]

Found A Couple Of errors

The Right of the calendar gets cut off
You cannot view this attachment.

Would It be possible to make the entry box a little lighter or make the text white as it's difficult to see the text
You cannot view this attachment.

All the best mick

[Diego Andrés]

Would It be possible to make the entry box a little lighter as it's difficult to see the text

I think the text should be lighter instead since it's a dark theme 

[TwitchisMental]

Found A Couple Of errors

The Right of the calendar gets cut off
You cannot view this attachment.

Would It be possible to make the entry box a little lighter or make the text white as it's difficult to see the text
You cannot view this attachment.

All the best mick

Calendar issue : I will look into this. Haven't really messed with the calendar events much lol.

The entry box though, I could have sworn I had this as white already. I will fix this soon.

Thank you for reporting these issues.

[TwitchisMental]

Okay I have a fix for both.

To solve the Calendar issue add this to the bottom of the custom.css

Code Select Expand

/*Calendar Stuff */
.ui-widget {
    font-family: "Oswald", sans-serif;
    font-size: 1em;
}
To resolve the Editor issue go to line 1907 of the custom.css.

Find -

Code Select Expand

.sceditor-container textarea {
    line-height: normal;
    border: 0;
    outline: none;
    font-size: 14px;
    color: rgb(17, 17, 17);
    box-sizing: border-box;
    padding: 0 5px;
    margin: 0px;
    resize: none;
    background: rgba(0,0,0,.2);
    display: flex;
    flex-basis: 175px;
    flex-grow: 1;
    min-width: 100%;
    max-width: 100%;
    height: 175px;
    min-height: 1px;
    max-height: 100%;
}
Replace With -

Code Select Expand

.sceditor-container textarea {
    line-height: normal;
    border: 0;
    outline: none;
    font-size: 14px;
    color: rgb(252, 252, 252);
    box-sizing: border-box;
    padding: 0 5px;
    margin: 0px;
    resize: none;
    background: rgba(0,0,0,.2);
    display: flex;
    flex-basis: 175px;
    flex-grow: 1;
    min-width: 100%;
    max-width: 100%;
    height: 175px;
    min-height: 1px;
    max-height: 100%;
}
Thank you for reporting these issues. I will upload the updated package soon.

[mickjav]

Thanks Sorted Also noticed the colour Problem with the quick reply editor did look see if I could find it but Wasn't able too.

[mickjav]

Scrub That Forgot It needed to update seem OK Now Thanks

[TwitchisMental]

Fixed version has been uploaded. Thanks again mick for reporting these issues.

[TwitchisMental]

Version 1.2

Code Select Expand

Update: Updated to work with SMF 2.1.0
Updated Board Icons
Adjustment: Adjusted some colors in the admin area and certain borders.

You cannot view this attachment.

[mickjav]

Hi Noticed A Few more Items

You cannot view this attachment.

You cannot view this attachment. 

[TwitchisMental]

Hi Noticed A Few more Items

You cannot view this attachment.

You cannot view this attachment. 

I would suggest updating to the latest version of SMF and the Aurora theme to see if you still have those issues first .

[mickjav]

Sorry didn't know there was a new version I'll Get That.

Just sorting the data files I need before I upgrade from 2.1 RC4 TO 2.1.0 

[TwitchisMental]

Sorry didn't know there was a new version I'll Get That.

Just sorting the data files I need before I upgrade from 2.1 RC4 TO 2.1.0 

No worries it was just updated yesterday.

Pretty sure your issues will be resolved with the newest version. If not, just report what you find here :-).

If you need help updating to 2.1.0 be sure to make a support topic in the SMF 2.1 support section. .

[mickjav]

Hi I've created a New Test board. I'm sure you helped me with the Width of the forum but can't find the CSS in my code library.

I need to change the width from what it is at the moment to 100%

thanks mick

[TwitchisMental]

Hi I've created a New Test board. I'm sure you helped me with the Width of the forum but can't find the CSS in my code library.

I need to change the width from what it is at the moment to 100%

thanks mick

You would need to find #top_section(line 107 of custom.css) #header(line 95 of custom.css) and #top_section .inner_wrap, #wrapper, #header, #footer .inner_wrap (line 101 of custom.css).

change

Code Select Expand

max-width: 1200px;
to

Code Select Expand

max-width: none;

[mickjav]

Got Last sorted thanks Just one more Thing lol

Would it be possible to remove this image

You cannot view this attachment.

[TwitchisMental]

Got Last sorted thanks Just one more Thing lol

Would it be possible to remove this image

You cannot view this attachment.

Open custom.css in your favorite editor

Find and remove this -

Code Select Expand

h1.forumtitle a::before {
    font-family: "Font Awesome\ 5 Free";
    color: rgb(187,146,145);
    font-weight: 700;
    display: inline;
    margin-right: 10px;
    content: '\f109';
}

[mickjav]

Thanks Also removed this

Code Select Expand

h1.forumtitle a:hover::before {
    font-family: "Font Awesome\ 5 Free";
    color: rgba(207,194,237,0.5);
    font-weight: 700;
    display: inline;
    margin-right: 10px;
    content: '\f109';
}

[TwitchisMental]

Thanks Also removed this

Code Select Expand

h1.forumtitle a:hover::before {
    font-family: "Font Awesome\ 5 Free";
    color: rgba(207,194,237,0.5);
    font-weight: 700;
    display: inline;
    margin-right: 10px;
    content: '\f109';
}

Yep that would be needed aswell. Good callout .

[TwitchisMental]

A new version has been uploaded.

Fixed a few things for guest view in the top bar.  Mainly the login button, a border issue, and some padding.

[TwitchisMental]

Minor update released. Just some color fixes in the calendar section, admin section, and random borders. Also fixed issues with certain icons not displaying properly.

All changes are just in the custom.css .

Code Select Expand

1.2.1 :
Adjustment: Fixed multiple color issues.
Bug Fix : Fixed certain icons not displaying.

[mickjav]

Cool i'll just replace that file

Thanks

[Neoni]

Nice colours

[TwitchisMental]

Cool i'll just replace that file

Thanks

Be sure to add the other css files like calendar.css aswell.

[TwitchisMental]

New Version Uploaded -

Code Select Expand

1.2.2 :
Update : Updated for SMF 2.1.3
Adjustment: Fixed more color issues with the Admin CP borders, Quote Box, Code Box, and the Editor.

[TwitchisMental]

New Version Released:

Code Select Expand

1.2.3
Updated for SMF 2.1.4 and the Attachment UI changes.
Adjustment: Adjusted the background colors for various moderation specific styles.
Adjustment: Adjusted some text colors and background colors in the ACP to follow with the rest of the theme.
Adjustment: Adjusted several border colors to match the rest of the theme.


[mickjav]

This is not a problem with the theme, But thought I would ask your advice.

@Diego Andrés did the hard bits, lol.

I haven't asked Diego, as he did a fantastic job, and it's only this theme that has the problem.

link to page using my default theme: https://www.databasedreams.co.uk/charts/gallery/?cat=35

The problem I'm having is with my aurora theme The update uses the following CSS which I am no good at.

As you can see in the image, some of the text is not centred.

Code Select Expand

.gallery_subcat {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}
.gallery_subcat .item {
    display: flex;
    flex-direction: column;
    text-align: center;
}
.gallery_subcat .item span {
    padding: 0 !important;
    width: 100% !important;
    flex-basis: 0;
}
All the best mick

[TwitchisMental]

in custom.css

Find :

Code Select Expand

.lastpost {
    width: 30%;
    font-size: 1em;
    padding-right: 6px;
    padding-top: 0px;
    text-align: right;
    margin: 0px
}
Remove:

Code Select Expand

text-align: right;

That or you could give that section its own unique class for the gallery. like .gallery_lastpost

[mickjav]

Remove the text-align: right;

Thanks Done That, worked a treat

[TwitchisMental]

You're welcome.

[Panoulis64]

Got Last sorted thanks Just one more Thing lol

Would it be possible to remove this image

You cannot view this attachment.

Open custom.css in your favorite editor

Find and remove this -

Code Select Expand

h1.forumtitle a::before {
    font-family: "Font Awesome\ 5 Free";
    color: rgb(187,146,145);
    font-weight: 700;
    display: inline;
    margin-right: 10px;
    content: '\f109';
}

Allow me, if we want to replace the image, with one of mine, related to my forum topic, what should I do? and where?

[TwitchisMental]

You could in theory change it to a font awesome icon that matches your theme.

If you wanna remove the icon in general and just use your own image. The logo url setting should be what you need.