• Members 3952 posts
    May 1, 2023, 12:26 p.m.

    Below is a combination of 2 of my posts in other threads where I mentioned CSS styling.

    Below is an example of the type of layout you can create using CSS. It is especially useful for displaying images for comparison resized and positioned side by side.

    bbcodeDemo.jpg

    bbcodeDemo.jpg

    JPG, 150.7 KB, uploaded by DannoLeftForums on May 1, 2023.

  • Members 3952 posts
    May 1, 2023, 12:49 p.m.

    In addition to the previous post this is an example of wrapping text around an image using CSS styling.

    cssStylingExample.jpg

    cssStylingExample.jpg

    JPG, 221.1 KB, uploaded by DannoLeftForums on May 1, 2023.

  • May 1, 2023, 1:30 p.m.

    Thanks. I must have missed that request. Did you put in in the requests forum?

    Anyway, I'll ask the developers how easy it will be to implement. It may be part of any replacement editor (assuming we do replace it). But before I do, how many of you will actually use it?

    Alan

  • Members 38 posts
    May 1, 2023, 2:20 p.m.

    Using Dark Reader and a bit of custom CSS* I came to this:
    image.png

    A larger heading font for the first item higher in hierarchy and a slightly larger padding for the items below.
    Also added a fix for the exif data text staying black on a dark background.

    *for those that want to copy into their own Dark Reader dynamic style developer mode:

    image.png

    PNG, 105.2 KB, uploaded by Propheticus on May 1, 2023.

  • May 1, 2023, 2:23 p.m.

    I likely will use image styling, if I want to put two images side by side or resize image to smaller one.
    Then I would use text styling - old'n'good BBCode includes [color] tag, I have multiple times wanted to make some part of text different color.

    Of course new editor may include such options already.
    (It is not just editor - content renderer has to know all those possibilities and some filtering must be done.)

  • Members 535 posts
    May 1, 2023, 2:24 p.m.

    Unless the feature is built-in to the editor… I’m unlikely to resort to CSS to format my posts. If it can’t be done using straight-up Markdown, I’m not going to bother, and I'd be surprised if most people would even go that far.

  • Members 83 posts
    May 1, 2023, 2:49 p.m.

    Screenshot 2023-05-01 104737.png
    Screenshot 2023-05-01 104638.png

    Screenshot 2023-05-01 104737.png

    PNG, 24.0 KB, uploaded by Sprouty115 on May 1, 2023.

    Screenshot 2023-05-01 104638.png

    PNG, 27.3 KB, uploaded by Sprouty115 on May 1, 2023.

  • Members 509 posts
    May 1, 2023, 8:41 p.m.

    Amazing! I didn't realise Dark Reader can do these kind of tricks.

    I've tweaked your code a bit to give this:

    Screenshot from 2023-05-01 21-36-18.png

    Here's the tweaked code:

    dprevived.com

    CSS
    .list-group-item-first h4.media-heading {
    font-size: 26px;
    }
    .list-group-item:first-child {
    background-color:#333;
    }
    .list-group-item:first-child .last-poster-avatar, .list-group-item:first-child .divider, .list-group-item:first-child .category-last-thread-poster, .list-group-item:first-child .thread-title, .list-group-item:first-child .category-last-thread-date{
    display:none!important;
    }

    .list-group-item-first .category-main .media-left .material-icon {
    font-size: 18px;
    height: 18px;
    line-height: 18px;
    width: 18px;
    }
    .list-group-category .list-group-item {
    padding-left: 26px;
    }
    .list-group-category .list-group-item:first-child .category-main {
    padding-left: 8px;
    }
    article div.exifOverlay {
    color: var(--darkreader-neutral-text)
    }

    ================================

    Does the code stick or does it have to be added to the app via the dev?

    Screenshot from 2023-05-01 21-36-18.png

    PNG, 447.1 KB, uploaded by DavidMillier on May 1, 2023.

  • May 1, 2023, 9:24 p.m.

    David, that is really good.

    How does one use the code? Where does it go?

    Alan

  • Members 3952 posts
    May 2, 2023, 12:37 a.m.

    I initially posted about BBcode about a month ago in the Feedback and Help forum

    dprevived.com/t/iswill-bbcode-be-implemented-on-dprevived/187/

    Bob saw the thread but I'm sure he had much higher priorities to deal with at the time.

    I certainly will.

    Anyone with at least a basic understanding of HTML and CSS styling will be able to take to BBcode and styling like a duck to water. It's only a matter of choice if the feature is of much use to them or not.

    Perhaps start a new thread as a poll - feel free to use the demo images I posted in the poll - and see what the response/interest is like.

    If fully implementing BBcode, since it is partially implemented already on DPRevived, is quick and easy then I would just do it. If there are significant hurdles to jump over, which I would be surprised, then maybe the demand for BBcode would come into the decision to implement it or not.

  • Members 509 posts
    May 2, 2023, 7:46 a.m.

    It goes in the Dark Reader plugin dev tools. I'm a bit hazy how the code is remembered. I had a quick look at the documentation and it implied that the dev tools was just for prototyping and if you wanted to the code to stick you had to submit it to the Dark Reader dev to add to the code. But I may have misunderstood that. It still seems to be working for me. The only thing I haven't tested is if it still works once I reboot my machine.

    Even if it does, this is not a site solution. Every user would have to install Dark Reader and add the code to their installation. What is really needed is access to the CSS that controls the site within the site software.

    Is that something you have access to?

    ps

    "Credit" for this hack should go to Propheticus, not me. I just tweaked what he did (crudely).

  • May 2, 2023, 7:52 a.m.

    I don't have access to it, but I know who does.

    I'll put it in the feature request list. But it may have to be part of the redesign of the home page. We are still sorting out priorities, and the new server has been number 1.

    Alan

  • May 2, 2023, 7:58 a.m.

    Thanks Danno, I must have missed that one.

    It all depends on

    a) if BB code can be integrated with markdown
    and/or
    b) If the new editor (if we do one) supports BB Code.

    But I will add it to the feature request list.

    Alan

  • Members 3952 posts
    May 2, 2023, 8:23 a.m.

    Thank you for putting it on the list :-)

  • Members 509 posts
    May 2, 2023, 8:29 a.m.

    I've done another tweak to reduce the prominence of the "Last post/poster" link.

    New CSS

    dprevived.com

    CSS
    .list-group-item-first h4.media-heading {
    font-size: 26px;
    }
    .list-group-item:first-child {
    background-color:#333;
    }
    .list-group-item:first-child .last-poster-avatar, .list-group-item:first-child .divider, .list-group-item:first-child .category-last-thread-poster, .list-group-item:first-child .thread-title, .list-group-item:first-child .category-last-thread-date{
    display:none!important;
    }
    .last-poster-avatar img {
    height:24px; width:24px;
    }
    a.thread-title {
    font-size:10px;
    }
    .category-last-thread-poster a {
    font-size:10px;
    }
    .category-last-thread-date a {
    font-size:10px;
    }

    .list-group-item-first .category-main .media-left .material-icon {
    font-size: 18px;
    height: 18px;
    line-height: 18px;
    width: 18px;
    }
    .list-group-category .list-group-item {
    padding-left: 26px;
    }
    .list-group-category .list-group-item:first-child .category-main {
    padding-left: 8px;
    }
    article div.exifOverlay {
    color: var(--darkreader-neutral-text)
    }

    ================================

    And padding around categories and subcategories

    .subcategories-list {
    padding-bottom:15px;padding-top:10px;
    }
    .list-group-item {
    padding-top:20px;
    }

    Screenshot from 2023-05-02 09-29-05.png

    Screenshot from 2023-05-02 09-29-05.png

    PNG, 257.7 KB, uploaded by DavidMillier on May 2, 2023.

  • Members 36 posts
    May 2, 2023, 10:33 a.m.

    I find it quite easy to use actually, but it's just me.
    I like to be able to alternate between categorized or threads.

    What could be useful is to add to both a kind of filter tool on the threads tags, so as to clean up what's shown maybe.
    If one could save in his/her profile this filtering permanently, that could somehow clean up 'the mess' for the users that want to only see some brands/topics.

    Greg

  • Members 509 posts
    May 2, 2023, 10:41 a.m.

    Some people have given the other site, DPRforum, design a free pass, IMO. Their visual design looks nice and neat but there are a lot of forums and soooooo much scrolling. This site is more compact which is better. The multi-level category approach is brilliant once you have got used to it. You can view all site posts as one giant list, or you can view the posts for a top level category, or a sub category or just an individual forum. That's a great feature. The structure is quite good, too.

    The visual design needs some tweaks (people are always impressed by a good looking site, first impressions and all that). And a threaded tree-structure option that allowed you to follow sub-conversations in a wider thread would be a boon. Patience!