Skip to content

Difficult to move posts now, on mobile.

Bugs
16 3 5.2k 1
  • wrote on last edited by
    #1

    I’m curious if this is just on my mobile, or if this is replicated on iphone?
    I have posted previously about difficulties doing Admin tasks on mobile, and accept that more complicated tasks may not be achieveable.
    However since upgrading to v3.x, some simpler tasks have become difficult.
    An example is moving a topic from one category to another.
    On mobile, in mobile or desktop view, a popup window obscures clicking the category to move to.
    Here is example, clicking Move seems to do nothing!
    The box asking ‘to which category’ has opened but is completely obscured behind this menu!
    Screenshot_20230624_141510_Chrome~2.jpg

  • I’m curious if this is just on my mobile, or if this is replicated on iphone?
    I have posted previously about difficulties doing Admin tasks on mobile, and accept that more complicated tasks may not be achieveable.
    However since upgrading to v3.x, some simpler tasks have become difficult.
    An example is moving a topic from one category to another.
    On mobile, in mobile or desktop view, a popup window obscures clicking the category to move to.
    Here is example, clicking Move seems to do nothing!
    The box asking ‘to which category’ has opened but is completely obscured behind this menu!
    Screenshot_20230624_141510_Chrome~2.jpg

    wrote on last edited by
    #2

    @Panda nope. You’re not imagining it. I too have seen this and it’s pretty annoying. Looking in more detail, it should be easily fixed with a simple z-index CSS value.

    I’ll have a look at this later.

  • wrote on last edited by
    #3

    Yep in my dev env, popup background is transparent

  • Yep in my dev env, popup background is transparent

    wrote on last edited by Panda
    #4

    @DownPW said in Difficult to move posts now, on mobile.:

    Yep in my dev env, popup background is transparent

    How do you achieve that? And can you click through transparent areas?

  • @DownPW said in Difficult to move posts now, on mobile.:

    Yep in my dev env, popup background is transparent

    How do you achieve that? And can you click through transparent areas?

    wrote on last edited by
    #5

    @Panda you can provided the index order places that specific element on the top.

  • @DownPW said in Difficult to move posts now, on mobile.:

    Yep in my dev env, popup background is transparent

    How do you achieve that? And can you click through transparent areas?

    wrote on last edited by DownPW
    #6

    @Panda

    Yep i select topic, topic tools, move topics and I have the transparent popup and I Can click through transparent area but I’m on an Android OS and it Can be different on IOS

  • @Panda

    Yep i select topic, topic tools, move topics and I have the transparent popup and I Can click through transparent area but I’m on an Android OS and it Can be different on IOS

    wrote on last edited by
    #7

    @DownPW ok!
    What and where do I put something to make the pop up transparent?

  • @DownPW ok!
    What and where do I put something to make the pop up transparent?

    wrote on last edited by
    #8

    @Panda why would you want it transparent ? It’s probably like this for us because we have heavily customized themes.

  • @Panda why would you want it transparent ? It’s probably like this for us because we have heavily customized themes.

    wrote on last edited by
    #9

    @phenomlab if I was understanding correctly, by making that pop-up transparent I can click through an area of it and get to the move post box that is currently hidden?

  • @phenomlab if I was understanding correctly, by making that pop-up transparent I can click through an area of it and get to the move post box that is currently hidden?

    wrote on last edited by Panda
    #10

    @Panda Also happy to do it the way you suggest, making the back box z-index higher.
    What would I type to do that?

  • @phenomlab if I was understanding correctly, by making that pop-up transparent I can click through an area of it and get to the move post box that is currently hidden?

    wrote on last edited by
    #11

    @Panda no, you wouldn’t be able to. The issue is z-index which is the stacking order of elements. The higher the value the higher the reference.

    For example, -1 means place under everything else. By default, the index figure is 1, so you’d need a much higher value to ensure it was always positioned over other elements.

  • @Panda Also happy to do it the way you suggest, making the back box z-index higher.
    What would I type to do that?

    wrote on last edited by
    #12

    @Panda said in Difficult to move posts now, on mobile.:

    What would I type to do that?

    I’ll provide some custom CSS for this once I’m in front of a pc.

  • wrote on last edited by
    #13

    Yes I understand the principal, just dont know how to make that CSS

  • wrote on last edited by DownPW
    #14

    Yep I have the same no transparency menu at first :

    8c593780-3263-48cf-9b7f-eb24e21592b6-image.png

    It’s just the popoup after select move topics who is transparent :

    12fb3015-a1a2-491a-9b78-56f641a4491f-image.png

    I have customcss code, maybe on your site this is not transparent.

    I solved the problem with this code (to be adapted to your environment) :

    /* BUGFIX: Popup topic tool transparency */
    .card {
      --bs-card-cap-bg: var(--bs-node-card-cap-bg);
      background-color: var(--bs-node-card-cap-bg);
    }
    

    RESULT :

    d4b6f923-d71b-4978-9bef-006aaac7fe03-image.png

  • wrote on last edited by DownPW
    #15

    Arf I just realized that we don’t have the same problem at all 😆
    In fact you don’t see the popup name “Move Topics” at all whereas I see it transparent

    The z-index solution suggested by Mark is indeed the correct solution I think

    Maybe this :

    .tool-modal {
        z-index: 1055;
    }
    
  • Arf I just realized that we don’t have the same problem at all 😆
    In fact you don’t see the popup name “Move Topics” at all whereas I see it transparent

    The z-index solution suggested by Mark is indeed the correct solution I think

    Maybe this :

    .tool-modal {
        z-index: 1055;
    }
    
    wrote on last edited by
    #16

    @DownPW Yes, it is. It’s set far too low meaning other elements with a higher preference will sit over the top of it.


Related Topics
  • Page control arrows for PWA

    Solved Customisation nodebb
    27
    25 Votes
    27 Posts
    15k Views
    phenomlab
    @crazycells it is, yes - I think I’ll leave it as there is no specific PWA CSS classes I know of. Well, you could use something like the below, but this means multiple CSS files for different operating systems. /** * Determine the mobile operating system. * This function returns one of 'iOS', 'Android', 'Windows Phone', or 'unknown'. * * @returns {String} */ function getMobileOperatingSystem() { var userAgent = navigator.userAgent || navigator.vendor || window.opera; // Windows Phone must come first because its UA also contains "Android" if (/windows phone/i.test(userAgent)) { return "Windows Phone"; } if (/android/i.test(userAgent)) { return "Android"; } if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) { return "iOS"; } return "unknown"; // return “Android” - one should either handle the unknown or fallback to a specific platform, let’s say Android } Once you’re in that rabbit hole, it’s impossible to get out of it.
  • NodeBB upgrade now cant post

    Solved Bugs nodebb
    5
    2 Votes
    5 Posts
    2k Views
    phenomlab
    @Panda yes, for some reason, that is the case. If you need an urgent response, it’s probably better to post here because of the time difference.
  • Chevron up before & after

    Solved Configure nodebb
    11
    1
    4 Votes
    11 Posts
    3k Views
    cagatay
    @crazycells you are right thank you.
  • NodeBB v3 and Harmony Theme

    Discussion nodebb theme
    22
    13 Votes
    22 Posts
    12k Views
    phenomlab
    Been playing with the user profile page this afternoon. Thought I’d post a video as I’m really pleased with how this came out profile-screen-capture.webm
  • Recent Cards plugin customization

    Solved Customisation nodebb
    21
    1
    13 Votes
    21 Posts
    12k Views
    phenomlab
    @pobojmoks that’s easily done by modifying the code provided here so that it targets background rather than border In essence, the below should work $(document).ready(function() { $(window).on('action:ajaxify.end', function(data) { $('.recent-card-container').each(function(i) { var dataId = $(this).attr("data-cid"); var color = $('[role="presentation"]', this).css("background-color"); console.log("data-cid " + dataId + " is " + color); $('[data-cid="' + dataId + '"] .recent-card').attr("style", "background-color: " + color); }); }); });
  • FIXED: Annoying cosmetic bug on mobile view

    Moved Bugs bugs
    13
    3 Votes
    13 Posts
    4k Views
    phenomlab
    And now, after all this time I finally discovered that the CSS I previously referenced was for something else - and used the same CSS name, so I’ve had to reinstate this block .tab-content { max-height: 0; padding: 0 2em; color: #898989; background: #eeeeee; transition: all 0.35s; margin-top: -5px; } And, add this below to make it more specific. .emoji-tabs .tab-content { height: 100%; max-height: 100%; padding: 0; margin: 0; }
  • [NODEBB] Welcome Message

    Solved Customisation css html nodebb
    20
    2
    13 Votes
    20 Posts
    9k Views
    phenomlab
    @DownPW the ‘js’ code for the banner takes the time from the client, so what it displays really depends on the regional settings for the operating system. I’ve not seen this issue myself but would like to see some examples of screenshots if possible.
  • Nodebb Hashtag plugin

    Solved General
    15
    1 Votes
    15 Posts
    6k Views
    phenomlab
    @jac Great ! I’ll close this off.