@phenomlab said in Layout Issues/Transparency:
Does it work properly now?
Yes, it does 🙂
Announcements in relation to the community
Hi All,
We’ve recently implemented clustering for NodeBB which, owing to the nature of the configuration, and the need to use redis to validate session data, you may not be able to login.
To work around this issue, simply clear your browser cache and then attempt the login again. If you don’t really want to clear your entire cache, it’s possible just to clear one site:
Go to https://sudonix.com Press F12 to load the browser tools Press and hold the refresh button in your browser8b220e94-24a8-4385-aa23-74ffd40a3f10-image.png
Choose “Empty cache and hard reload” Disable F12 developer tools Login againThis works for any Webkit (Chome) backed browser. Other browsers may differ slightly.
Thanks
Hi all,
I’ve been working on a self-coded replacement for iFramely, and I now have a workable solution that
Is able to bypass CORS restrictions Gets data as the client, so zero server load Gets as close to iFramely hosted in terms of look and feel Uses a cors-proxy with cache, so any data held in cache is used before the browser makes any requests Super fast Uses 100% proprietary code written by Phenomlab Most importantly, it’s completely FREE.It’s not perfect, and has some bugs (you’ll no doubt see these pop up from time to time) - but it’s working at around 97%, and active on this forum (yes, it’s running in PROD 🙂 )
Here’s the CORS proxy running with node-cache
465b6344-7772-4750-bdb4-f66a134e1c19-image.png
Here’s what the unfurled links look like
d4bf4eb9-cdf2-429c-90e7-9d0adc932d4a-image.png
It’ll inherit the CSS of your site (potentially - you might have to make some minor changes).
You can see it in action by just visiting posts that have an external URL in them. A good example is this link
https://sudonix.org/topic/138/ai-a-new-dawn-or-the-demise-of-humanity
I know most members here want this, so decided to write my own 🙂 It’s not quite “ready” yet, but will be soon.
Any takers?
If you’re a Bowie fan, then the title of this post might mean something to you 🙂 If not, sorry - obviously wasted… 😄
The main point of this post is to advise you of some changes that are happening within the platform. Over time, Sudonix has evolved (in a good way of course) and has attracted readers and new members alike across the world. Whilst the below stats are not in the millions, it does show modest growth which is always assuring given the nature of what is on offer here.
81a964b6-3cc9-488c-a50d-dae603f48078-image.png
ccd41322-444d-48be-bbd8-c967fd5063d1-image.png
Based on the increasing number of new users, I wanted to improve the overall look of Sudonix and make it more appealing to the eye. Some of you may have already noticed the changes, or, as in the case of @Madchatthew, been hit with some odd-looking effects that mean you have to choose another theme, and then re-select the one you were using before. Thankfully, most of this work has now been completed, but these changes do have an impact on your daily usage as below
Support for multiple themes is going to be reduced - to the point where there will only be three. Light (Luminate), Dim (Dusk), and Dark (Tenebrous). The real reason for this is that, as @crazycells keeps telling me, “less is more” and I’m becoming a fan of that paradigm. Having a lot of themes also means a lot of maintenance, which is something I’m looking to avoid. If you use Dark Mode on your device, you’ll get issued with Tenebrous. If you use Light Mode (native), then you’ll get issued with Luminate. I am going to be removing the dropdown swatch and replacing this with a simple 3-way toggle (or something like that).
Font sizes have been reduced. The point here is that on a mobile device, these are a bit too large for my liking, so they have been scaled back on desktops to 98%, and 95% on mobile devices. The dominant font (Poppins) will remain as it’s a firm favourite and works well on all devices.
The look and feel experience has also changed. I’ve adapted something of a “Material” view which is on by default (currently, it cannot be disabled, but I will include this ability if desired as I helped write something similar for @DownPW some time ago). This uses outline instead of border which is much easier to work with (under the guise of CSS) as it does not increase the element size, but simply adds a “wrapper” around it. Other “soft” changes have made their way into this release, and are subtle in nature, but will certainly improve the overall experience.
There are a ton of other changes, but some of these are either under-the-hood, or subtle enough that they go unnoticed - one such example is a change to OGProxy (only CSS) that alters the rendering order making it faster, and aligning to what other sites are doing in terms of how the card is presented. There are numerous colour changes too, which typically attract new naming conventions which won’t be available under your session unless you change themes or clear your browser cache.
I’m hoping most of this will simply pass most users by - but, do let me know if that is not the case.
Those of you who regularly visit the NodeBB forums have problably noticed this
https://community.nodebb.org/topic/18279/native-push-notifications-support-for-nodebb
And as a result, this new commit
https://github.com/NodeBB/NodeBB/commit/aa060d31d130cd54d18cd8dc2f25ba7de58f4fea
@julian now has the native push notifications working, and as a result, Sudonix now has them also - see screenshot of how to enable this feature here
33abbae1-28b3-4f05-b462-e19eccc8aaf9-image.png
As you can see, you need to enable the notification before it will work. There is a test button located underneath the slider switch (although not present in this screenshot) and this will enable you to test to make sure it is working.
Quoting Julian
I’m particularly excited about this new development because it opens the door for richer integration between NodeBB and the push notifications themselves.
With (probably) every iteration prior, when you clicked on the notification, it likely opened a new window. With direct access to the Push API and service worker, we can now accurately detect whether the site is already open (in another tab), and open it there.
In the future, we’ll also be able to add in things like icons, pictures, and custom actions, right from the notification itself.
One particular nice-to-have is the ability to update notifications. Being able to merge notifications (like they already do in NodeBB) or potentially rescind notifications would be a nice step forward in usability as well.
This works very well in my testing - however, if you use NordVPN, it does not work at all unless you disable the VPN. I have an open ticket with them presently to see if there is in fact any workaround.
I have taken the decision to now disable nodebb-plugin-ntfy as with the 4.0 train, this plugin is considered legacy.
Hi all,
Some of you may have already noticed that you can now register and login with LinkedIn on Sudonix. The same applies for Google, but X (formerly Twitter) has been removed - mostly because they want to charge for all sorts these days, and do not have great support (or documentation) for something like OpenID.
23e1b817-9a16-4094-8026-eb7f7c7c6944-image.png
These two new connection types have been fully tested, so not expecting any issues, but if you do encounter any, let me know.
Hi all,
I’ve recently implemented a self-hosted ntfy instance - it’s URL is https://notify.sudonix.org. If you are already an ntfy user, please unsubscribe from any existing Sudonix links you have, and re-subscribe using the unique link in your profile, under “Push Notifications”
NOTE: You will probably need to click “Regenerate topic name” and use that value. In some cases, I’ve found that not recycling this means that the alerts aren’t received although YMMV (Your Mileage May Vary).
d6197831-937e-4f50-97a9-ec02ccdf04b0-image.png
Copy “Private Push Link” and then paste that into your NTFY client - note, you’ll also see that there is a “Subscribe” button which you can use if you’d prefer.
If you’re not using `ntfy, you’re missing out. This small app will alert you when something happens on this site, for example, a response to a thread you’re participating in, a mention, upvote, etc, etc.
A full explanation can be found here
https://ntfy.sh/
Seeing as fancybox is such a great and efficient library, I’ve decided to implement it here. Being super lightweight, there’s absolutely zero impact to the overall speed of the Sudonix platform, I’ve included it here. In fact, it’s a fork of the same extension I wrote for the Flarum project which is still very much in use 🙂
I’ve streamlined the code and the required functions. Images only are shown, and the function will ignore avatars and emojis etc as displaying these as part of an image carousel is pointless in my view.
Enjoy.
I’ve been looking at reducing the number of themes that I actively support, and as a result, I’ll be skinning these down over the coming days. However, I don’t want to simply “switch off” any themes - you can continue to use what you have selected, and it’ll remain - it just won’t receive any updates going forward.
What I am looking to do is to keep 3 themes per category of “Light”, “Dim” and “Dark”, so we are going from 15 themes (well, 14, as “Default” is in fact “Flatly”) to 9.
I’m looking to find out what the most popular themes are so the remainder can be hidden - they won’t be removed, so if you are using one of the themes slated for removal, everything will still work, but you should change it at some point for a “supported” one (a bit more about this later).
The likely candidates to remain at this point are
Light
Daylight
Flatly
Summertime
Dim
Darkly
Greybird
Nord
Dark
Blackout
Midnight
Tenebrous
The others are likely to be deprecated.
I’m currently evaluating the services offered by Webdock
https://webdock.io
In order to create a real “apples for apples” test, I have recovered this site onto the test server I’m running. The onboarding with Webdock is extremely impressive - a new server build takes around 20 seconds to provision 🙂
As for the evaluation of Webdock, I’m loving it so far. Very friendly UI, and pretty decent speeds. It costs more than Hetzner at €20 per month (around £16), but compare the capabilities of these two. instances and it’s easy to spot several key differences
Hetzner2af38d3b-4ab3-4eac-99cc-ef6f081fc930-image.png
Webdock7cf089d0-db17-46e7-98e1-438206c37668-image.png
Here’s the Geekbench test for that same processor
https://browser.geekbench.com/v4/cpu/16085326
However, the grass isn’t always greener on the other side, and it’s going to take a lot for me to move away from Hetzner. This particular exercise was really to test my DR and BCP plan as below
I can recover the entire site without issue ✔ I can recover the database without issue ✔The evaluation continues…
For those who may be interested, Webdock has presence in Europe (Helskini) and Canada (Montreal) - see below
f0e392d7-6cdf-4fb0-96c0-41d64aa1b369-image.png
One distinct advantage Webdock has over Hetzner is the ability to freeze servers, and place them in cold storage. You can do this for up to three servers without having to pay for them
6df24be7-2bd1-42c0-85d1-858702d57e46-image.png
As evidenced here
36f023e6-9c70-47be-9471-d1e53f075b4b-image.png
Less really is more - @crazycells , I have to agree 🙂
See the post below for more detail around the decision
https://sudonix.org/topic/517/theme-retirement/2
I’ve spent a LOT of time completely redesigning the theme interface so that it matches modern standards, and colours. Based on this, there are several changes under the bonnet which you won’t be able to see or access unless you clear your cache.
I will make every effort to automate as much as possible on this platform, but of course, I have zero control over your browser cache, so you will need to that manually.
What’s changed?Did you dump Bootstrap?I’ve made the entire forum “Material Design” themed. Whilst I’m not necessarily a Google fan, I do very much like the way the UI is put together, and it’s a familiar concept that just about everyone with a mobile phone and internet connection has encountered at some point (probably every day actually)
How many themes are there now?Ha - no. Bootstrap is a major component of this platform, and it would look pretty odd without it. In a similar vein, jQuery is also very much still present, and required for the custom functions I’ve written to run.
What do they look like?There are now 3 - down from 15. These are now light, dim, and dark. Not very imaginative, but simple solutions are always best.
LightBelow are examples
3833fcd7-eae3-4c98-b66d-96938838bd53-image.png
Dim2b376f95-85a5-4c2a-b074-89fc3d99cc65-image.png
Dark0d82760e-2688-4db5-97cc-5605829d7c7c-image.png
Can I still use “x” theme?Any new features?You can, but these are not directly compatible with the new theming system, and therefore, you will get very undesirable results unless you clear your cache and choose one of the new selections. I also will not be back porting these themes to make them work - they are now considered legacy
Kind of. I added components as I went, meaning that there are some obvious changes, and some you’ll never notice. The new themes make use of accents such as the below, and future updates (coming soon) will provide enhancements in this same area
03d5d75e-8bdb-4f3e-84a2-9df0640402a8-image.png
Did you design the themes yourself?Can you share the resources you used for inspiration?Yes - and no. MD is a very mature standard, and therefore, there are a good number of colours natively available. However, not all that glitters is gold, so some modifications were necessary to enhance readability etc.
Material DesignOf course 🙂 See below
https://mdbootstrap.com/
Material Designhttps://mdbootstrap.com/live/_doc/all-colors.html
GUI Challengeshttps://gui-challenges.web.app/color-schemes/dist/
GUI Challenges - Git Demoshttps://github.com/argyleink/gui-challenges
There are more - you literally just need to search for them. These are not direct “copies”, but merely for me take inspiration and create something special / sexy / unique (delete as applicable).
Hope you like these new themes. Over the coming weeks (as was always the long term plan), I will be using the Material theme Accents to define category colours so they make sense, and do not look “garish” against the new themes.
Enjoy.
Hi All,
I’m thrilled to announce that I have decided to start migrating all of the code that is considered stable / production into a new sub category of “let’s build it” called Code Repository
https://sudonix.org/category/29/code-respository
There’s nothing to see here presently, although this will eventually become a one-stop library for all code I write (a good example here being OGProxy) - in effect, one place you can go to save you from having to trawl though thousands of posts (and yes, we do have thousands). In most cases, the category is going to be read only as a way of keeping it clean and distraction free. Of course, updates etc will be applied in the usual fashion, but any support requests, queries, or just discussion about the code should be raised in the usual places.
I am also going to create a private GIT repository for all of this code to sit in. Based on this, you will find either gists or direct links to git code. I’ve chose this route for OGProxy as a trial to see if it will work, and it’s so much easier because there’s less clutter, and it’s simpler to navigate.
I will also be moving the themes (swatch) CSS here, too, so you’ll also be able to take full advantage of that also.
Enjoy.
Hi All,
Just a quick update from me concerning some upcoming changes on Sudonix.
This platform has been running for over 1.5 years, and during this time, has helped hundreds of people overcome issues with technology, or gain access to insightful information to enable them to make informed decisions around their own technology requirements.
As this platform matures, so does the level of content it provides, and several recent newly created accounts are on the back of information provided to others, so the content is truly invaluable. That said, we need to be mindful of the mission that this platform originally set out to achieve, and I’m happy to share that we’re very much on the right track. As you already know, Sudonix is a completely free platform designed for literally anyone to gain access to a highly experienced, top tier technical consultancy without fear of belittlement, reprimand or retribution.
There’s no such thing as a stupid question - only one where the original author needs help, and therefore, no questions remain unanswered. In fact, the vast majority are very quickly resolved either by the founder of this site, or other members, who through their own experiences, are able to step in and provide assistance where required.
So why the changes?Well, let’s be 100% transparent on what those changes are. For clarity, this platform will never charge you for anything - there are no “plans”, “subscriptions” or anything along those lines (and you have my assurance that these will never materialise either) - it set out to be, and will always remain, free of charge. As the platform has started to gain traction, it is time we made some small changes to better reflect the service on offer. These are outlined below
Why is this changing?Soon, the domain suffix will change from .com to .org (so, from sudonix.com to sudonix.org). This is completely transparent to all users and you won’t have to change anything. Everything will still work as it did before
Will sudonix become a “paid” serviceThe .com TLD suffix is traditionally tied to “for profit” organisation, which Sudonix is not. Adopting the .org domain TLD conveys the message that this really is not-for-profit and therefore, should open up the playing field to others who may have expressed some level of trepidation in terms of creating an account and asking for help for fear that they may be slapped with some form of levy, or get a ton of junk email in return.
Back “in the day”, there was a clear demarcation between .com and .org domains, but that has since fallen by the wayside where even profit making organisations can use .org and still charge for services. Admittedly, this does sound counter intuitive given our perspective, but it is a route we intend to take as a means of extending the service to those who previously may have kept their distance for the reasons above. The domain of .org is also applied typically to communities (which is what this is), and therefore, another reason to make this change.
No. There are no plans for this to ever be implemented as it goes directly against the ethic of the pro-bono / free services we set out to provide.
One other change we are making is the implementation of a new logo. I know the existing one we have looks “kinda cool”, but it is in fact a Font Awesome icon - see below
https://fontawesome.com/icons/chart-tree-map?f=classic&s=solid
Based on this, “kinda cool” also inherently means lack of originality, and more importantly, ownership. I’ve taken the steps of engaging with a professional designer for a new logo. We have one which I have chosen which clearly depicts what is on offer, and that should be arriving on the site in the coming days. This is all at my cost, and will not be passed down to any users. I’ve chosen to have some form of branding as a means of recognition, which will be also be present through the platform.
I’ll share the logo once it is ready. I think you’ll like it.
I’m sharing these changes with everyone here as I’m also keen to garner thoughts, recommendations etc. All feedback - good or bad - is important, as this helps to improve on what is already a great product and service.
Thanks
I thought it was about time that Sudonix had a services page - not to tell you if things are running or not, but to highlight some of the more common services on offer. It’s a Boostrap based design (of course), and employs the same hover techniques as the tags page.
5dfdf312-aa95-40d6-b7f3-459f3c7dbd12-image.png
Check it out here
Hi All,
As you know, Sudonix has been subjected to recent re-branding from the design perspective. This is now mostly complete, and now the focus is the final part, which is as below (from this post)
Soon, the domain suffix will change from .com to .org (so, from sudonix.com to sudonix.org). This is completely transparent to all users and you won’t have to change anything. Everything will still work as it did before
Q: Why is this changing?Q: Will Sudonix become a “paid” serviceA: The .com TLD suffix is traditionally tied to “for profit” organisation, which Sudonix is not. Adopting the .org domain TLD conveys the message that this really is not-for-profit and therefore, should open up the playing field to others who may have expressed some level of trepidation in terms of creating an account and asking for help for fear that they may be slapped with some form of levy, or get a ton of junk email in return.
Back “in the day”, there was a clear demarcation between .com and .org domains, but that has since fallen by the wayside where even profit making organisations can use .org and still charge for services. Admittedly, this does sound counter intuitive given our perspective, but it is a route we intend to take as a means of extending the service to those who previously may have kept their distance for the reasons above. The domain of .org is also applied typically to communities (which is what this is), and therefore, another reason to make this change.
Q: When will this happen?A: No. There are no plans for this to ever be implemented as it goes directly against the ethic of the pro-bono / free services we set out to provide.
Q: What will happen to the .com suffix?A: The domain migration is planned for this weekend - with the vast majority being completed tomorrow from around 4pm BST. Post the migration, existing links will still work - but they will redirect to sudonix.org automatically.
Q: Will any data be lost?A: Nothing. It will continue to exist, but will redirect to sudonix.org
A: No. The running services on sudonix.com will be stopped, meaning the platform will be inaccessible for the duration of the move. Once the platform has been moved, services will be started on sudonix.org with a redirect placed on sudonix.com (as above). This means that you do not need to do anything on your side, but you should ideally change any bookmarks you have.
Any other questions, let me know and I’ll be happy to answer them 🙂
Hi All,
I thought that seeing as I’ve been quiet for a while that I’d start a new thread that will detail the journey Sudonix is taking to reach BS5, v3 of NodeBB, and the adoption of the Harmony theme. I’ve been playing with the “Nord” theme, and am pleased to report that the CSS needed since the move from standard CSS to LESS / SCSS has been remarkably reduced. Presently, I’m at 324 lines - a huge difference to the 4,479 (yes, that’s right…) currently in use here.
And no doubt you’re curious as to what v3.beta1 of NodeBB looks like, combined with Harmony, and the theme I’m working on?
Here’s what the standard iteration looks like via https://community.nodebb.org
8afb6691-68ef-4c34-8de8-088808181b75-image.png
And here’s what the Nord theme on https://sudonix.dev looks like
WARNING: Extreme sexiness ahead 🙂6f377bf7-f1c8-4908-a18c-cdbf473d2d3e-image.png
cfbb2f07-1549-41fe-a937-3ccffdead9c4-image.png
3c2cc439-bfbb-49f7-82b5-488740c93d5b-image.png
The Swatch script is also functional
fd3020e9-ec4f-4df8-9d79-9ca8262fe005-image.png
Interestingly, this differs heavily from v2 (mostly because the jump from BS3 to BS5 is significant). Currently, it looks like this in v2
// ------------------------------------------ // Swatch Applet // ------------------------------------------ $(document).ready(function() { function generateRandomString(length) { var text = ""; var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; for (var i = 0; i < length; i++) { text += possible.charAt(Math.floor(Math.random() * possible.length)); } return text; } var string = generateRandomString(10); $("#random_string").text(string); var whichTheme = localStorage.getItem("theme"); var activeTheme = localStorage.getItem("activeTheme"); // If no theme is detected (for example, a new visitor), then set this to default if (!whichTheme) { // dark-mode media query matched or not let matched = window.matchMedia('(prefers-color-scheme: dark)').matches; //var override = getUrlParameter('override'); if (matched) { // Offer the mifnight theme by default whichTheme = "midnight"; activeTheme = "/assets/customcss/midnight.css?version=" + string; //$("link[rel=stylesheet]").attr('href' , thishref + "?version=" + string + ""); } else { // Leave the default theme intact whichTheme = "default"; activeTheme = "/assets/customcss/daylight.css?version=" + string; } // See if override has been enabled if (whichTheme === 'default') { // Sudonix is overriding operating system settings and will force dark scheme activeTheme = "/assets/customcss/daylight.css?version=" + string; } if (whichTheme === 'daylight') { // $('[component="post"]').addClass("background"); $('li.self-post .content:not(.isSolved [component="post/content"]').addClass("response"); } else { // Nothing to do :) } } /*$(".forum-logo").attr("src","/assets/uploads/system/sl_" + whichTheme + ".webp?version=" + string + ""); */ var panel = $('<li id="switcher" class="dropdown"> \ <a title="" data-original-title="Swatch" class="navigation-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> \ <i id="ticon" class="fa fa-light fa-swatchbook" data-content="" aria-hidden="true"></i> \ <span class="visible-xs-inline">Swatch</span> \ <i class="fa fa-caret-down" aria-hidden="true"></i> \ </a> \ <ul id="theme" class="dropdown-menu"> \ <li><a id="default" href="#" rel="/assets/customcss/daylight.css">Default</a></li> \ <li><a id="anthracite" href="#" rel="/assets/customcss/anthracite.css">Anthracite</a></li> \ <li><a id="darkly" href="#" rel="/assets/customcss/darkly.css">Darkly</a></li> \ <li><a id="daylight" href="#" rel="/assets/customcss/daylight.css">Daylight</a></li> \ <li><a id="facetube" href="#" rel="/assets/customcss/facetube.css">FaceTube</a></li> \ <li><a id="greybird" href="#" rel="/assets/customcss/greybird.css">Greybird</a></li> \ <li><a id="midnight" href="#" rel="/assets/customcss/midnight.css">Midnight</a></li> \ <li><a id="nord" href="#" rel="/assets/customcss/nord.css">Nord</a></li> \ <li><a id="slate" href="#" rel="/assets/customcss/slate.css">Slate</a></li> \ <li><a id="superhero" href="#" rel="/assets/customcss/superhero.css">Superhero</a></li> \ <li><a id="tempest" href="#" rel="/assets/customcss/tempest.css">Tempest</a></li> \ <li><a id="twitter" href="#" rel="/assets/customcss/twitter.css">Twitter</a></li> \ </ul> \ </li> \ </div> \ '); if (whichTheme) { $.get(activeTheme, function(css) { $('<style type="text/css"></style>') .html(css) .appendTo("head"); }); } else {} $('#main-nav').append(panel); if (utils.findBootstrapEnvironment() === 'xs') { $('#main-nav').append(panel); } $(document).ready(function() { $("body").on("click change", "#theme li a", function() { var thishref = $(this).attr('rel') + '?version=' + string; $.get(thishref, function(css) { $('<style type="text/css"></style>') .html(css) .appendTo("head"); }); console.log("Applying swatch " + thishref); //location.reload(); var selected = $(this).attr("id"); var theTheme = $(this).attr("rel"); if (selected === 'default') { localStorage.setItem("theme", selected); localStorage.setItem("activeTheme", "/assets/customcss/daylight.css?version=" + string); //location.reload(); } else { localStorage.setItem("theme", selected); localStorage.setItem("activeTheme", theTheme); } return false; }); }); });Now in v3, it looks VERY different
var mobiledropdown = $('<li class="nav-item dropend" title="Swatch"> \ <a class="nav-link nav-btn navigation-link px-3 py-2 dropdown-toggle" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#theme" onclick="event.stopPropagation();"> \ <span class="d-inline-flex justify-content-between align-items-center w-100"> \ <span class="text-nowrap truncate-open"> \ <i class="fa fa-fw fa-painbrush" data-content="" aria-hidden="true"></i> <span class="nav-text visible-open px-2 fw-semibold">More</span> </span> <span component="navigation/count" class="visible-open badge rounded-1 bg-primary hidden"></span> </span> </a> <div class="ps-3"> <ul id="theme" class="collapse list-unstyled ps-3"> \ <li><a id="default" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/daylight.css">Default</a></li> \ <li><a id="anthracite" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/anthracite.css">Anthracite</a></li> \ <li><a id="darkly" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/darkly.css">Darkly</a></li> \ <li><a id="daylight" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/daylight.css">Daylight</a></li> \ <li><a id="facetube" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/facetube.css">FaceTube</a></li> \ <li><a id="greybird" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/greybird.css">Greybird</a></li> \ <li><a id="midnight" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/midnight.css">Midnight</a></li> \ <li><a id="nord" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/nord.css">Nord</a></li> \ <li><a id="slate" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/slate.css">Slate</a></li> \ <li><a id="superhero" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/superhero.css">Superhero</a></li> \ <li><a id="tempest" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/tempest.css">Tempest</a></li> \ <li><a id="twitter" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/twitter.css">Twitter</a></li> \ </ul> </div> </li> '); var desktopnavbar = $('<li id="switcher" class="nav-item mx-2 dropend" title="Swatch"> \ <a class="nav-link nav-btn navigation-link d-flex gap-2 justify-content-between align-items-center dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> \ <span class="d-flex gap-2 align-items-center text-nowrap truncate-open"> \ <span class="position-relative"> \ <i class="fa fa-fw fa-paintbrush" data-content="" aria-hidden="true"></i> \ <span component="navigation/count" class="visible-closed position-absolute top-0 start-100 translate-middle badge rounded-1 bg-primary hidden"></span> \ </span> \ <span class="nav-text small visible-open fw-semibold text-truncate">Swatch</span> \ </span> \ <span component="navigation/count" class="visible-open badge rounded-1 bg-primary hidden"></span> \ </a> \ <ul id="theme" class="dropdown-menu overflow-auto" data-popper-placement="right-end"> \ <li><a id="default" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/daylight.css">Default</a></li> \ <li><a id="anthracite" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/anthracite.css">Anthracite</a></li> \ <li><a id="darkly" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/darkly.css">Darkly</a></li> \ <li><a id="daylight" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/daylight.css">Daylight</a></li> \ <li><a id="facetube" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/facetube.css">FaceTube</a></li> \ <li><a id="greybird" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/greybird.css">Greybird</a></li> \ <li><a id="midnight" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/midnight.css">Midnight</a></li> \ <li><a id="nord" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/nord.css">Nord</a></li> \ <li><a id="slate" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/slate.css">Slate</a></li> \ <li><a id="superhero" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/superhero.css">Superhero</a></li> \ <li><a id="tempest" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/tempest.css">Tempest</a></li> \ <li><a id="twitter" class="dropdown-item rounded-1" href="#" rel="/assets/customcss/twitter.css">Twitter</a></li> \ </ul> \ </li> \ </div> \ ');I’ve yet to decide how many of the v2 swatches will make their way into v3 on Sudonix -likely candidates will be
Anthracite Darkly Facetube Midnight Nord Slate Superhero Tempest TwitterAlso, the “conversational / messenger view” is destined to be scrapped. It looked good at the time, and I know a number of you adopted it for your own forums, but it’s not really “today’s standard” - and, a LOT of effort to code for very little cosmetic return.
Stay tuned for more updates 🙂
For a long time (well, it certainly feels like forever as I’m writing code as and when I have time in between my day job), I’ve been working on a theming engine (something similar but not quite the same as the code provided for @DownPW) that will be in the soon to be released theme set for Sudonix.
The most pertinent of these themes (and likely the primary if you choose dark mode, or have it set as default in your OS) is Midnight. This particular theme makes extensive use of CSS modifications, and also changes the layout somewhat - moving away from the “traditional” NodeBB stock Persona theme.
Without further ado, the Midnight theme looks like this
9eec8af9-7046-4549-968d-eb58e1813d27-image.png
Changing the actual theme itself to one of the defined is shown below
595e4197-f155-485f-a173-b655bc08face-image.png
You’ll notice that I’ve hooked into the main-nav area for this, as it’s better suited here in my view
The look and feel is consistent across the entire platform
0c4b0ee4-480f-4e58-b2ee-72f5759829f2-image.png
Even the profile page hasn’t escaped 🙂
bf52bd06-f0d0-4167-8714-dc7e3f5a1f74-image.png
Hope you like the new logo… 🙂
611c7565-bccf-44c9-b725-c91765632b41-image.png
We’re also doing “more with less” - in the sense that this new CSS file uses variables to simplify it.
Ideally, I’d like views / input etc. in terms of colours, layouts, etc…
I’ve spent some time refactoring the ranking system, as it didn’t really make that much sense - admittedly, it looked good when it first went in, but it never actually reflected reality.
Based on this, I’ve changed the names of the ranks (there are no actual quantity adjustments in terms of the reputations users have acquired) so they look like the below
Newbie (0) Rookie (10) Apprentice (20) Explorer (30) Contributor (50) Enthusiast (100) Collaborator (150) Regular (200) Proficient (300) Experienced (500) Veteran (750) Grand Master (1000) Guru (2000) Yoda (5000)This new layout makes the system reflect reality in the sense that is now based on your experience with the platform itself rather than any specific skill set.
Enjoy 🙂
Found an issue here? Let us know!