Compact design CSS for Plusnet Community
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Printer Friendly Page
- Plusnet Community
- :
- Forum
- :
- Feedback
- :
- Community Site Feedback
- :
- Compact design CSS for Plusnet Community
Compact design CSS for Plusnet Community
22-12-2016 10:55 AM - edited 03-07-2017 11:38 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Hello everyone,
I am a big fan of providing choice and catering for those who have different preferences to how they view the Community on their browsers. I have been working on a little side project to provide a bit of a different experience when using the forums and I would like to share with you my latest creation.
Compact design skin
Instead of waffling on about what has changed, here are some screenshots:
This will also affect a few other places like your private messages page.
You can grab the code and paste into your Stylish (Firefox) or Stylebot (Chrome) plugins here:
Stylish (Firefox): https://pastebin.com/pwYFG1a1
Stylebot (Chrome): https://pastebin.com/Ugze9qMk
Any feedback is welcome. This is the first version of this so there are bound to be some issues. Just let me know if there are any crazy bugs on the appearance.
Thanks,
Jack
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:04 AM - edited 09-01-2017 11:14 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Firefox users
Visit https://addons.mozilla.org/en-gb/firefox/addon/stylish/ and add the Stylish extension to your browser
- Look for the Stylish icon () in your browser and click it
- Navigate to 'Write new style' > 'For community.plus.net' (this will open a new tab)
- Visit this link for the CSS code: http://pastebin.com/T20D1wja
- Copy and paste the code from this page directly into the Stylish addon tab we just opened.
- Click save on Stylish.
The Community should now show the compact theme.
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:06 AM - edited 09-01-2017 11:14 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Chrome users
Visit https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha?hl=en and download and install the Chrome application for Stylebot.
- Look for the Stylebot icon () in Chrome and click it
- Navigate to 'options'. This will open a new tab.
- Click 'Styles' on the left.
- On the right side panel, click 'add new style'. This will open a modal box to edit.
- add 'community.plus.net' to the URL input on this box then visit http://pastebin.com/jV0b9GPJ to get the code to paste into the big input box.
- When finished, click 'add'.
The community will now be in a compact theme after refreshing the page.
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:11 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Please note that some things have been hidden so user stats, signatures and a few other bits have been completely hidden to make more room for the important stuff.
As a side note, you can combine this with my high contrast theme as another theme in your browser plugin.
Feel free to let me know if you would like to see anything else made more compact on this theme.
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:16 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Just noticed the Cancel/Post at the bottom of this message is scrunched up. Purely your code as shutters doesn't do it.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:35 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
No problem, that's the quick reply buttons. I have updated the code.
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 11:50 AM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
If it helped click the thumb
If it fixed it click 'This fixed my problem'
Re: Compact design CSS for Plusnet Community
22-12-2016 12:09 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Re: Compact design CSS for Plusnet Community
22-12-2016 4:10 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
First time of using styles and am liking so far (I think).
One thing I noticed when deciding to turn on the Quick Reply option was the way the Thanks option was being displayed:
Forum Moderator and Customer
Courage is resistance to fear, mastery of fear, not absence of fear - Mark Twain
He who feared he would not succeed sat still
Re: Compact design CSS for Plusnet Community
22-12-2016 4:13 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Good work Jack, really like this style!
Re: Compact design CSS for Plusnet Community
22-12-2016 4:25 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
I have fixed the 'thanks' option under preferences. Pastebin links have been updated.
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
22-12-2016 4:29 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Excellent, thanks @jaread83
Is it me or do pages with this new style seem to load quicker?
Forum Moderator and Customer
Courage is resistance to fear, mastery of fear, not absence of fear - Mark Twain
He who feared he would not succeed sat still
Re: Compact design CSS for Plusnet Community
22-12-2016 4:32 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
Frontend Web Developer | www.plus.net
If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.
Re: Compact design CSS for Plusnet Community
23-12-2016 12:08 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
installed - thanks Jack
Re: Compact design CSS for Plusnet Community
23-12-2016 12:16 PM
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Highlight
- Report to Moderator
One thing I have noticed is there a significant delay when using Unread Topic link to a thread that the thread opens but then hesitates until moving to the first unread post
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Printer Friendly Page
- Plusnet Community
- :
- Forum
- :
- Feedback
- :
- Community Site Feedback
- :
- Compact design CSS for Plusnet Community