Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 09:54
    Martin Griffiths
    1

    Nested content broken in Backoffice CSS in 7.12

    Ohhhh and I was so looking forward to this mammoth update!

    The CSS seems to be broken for nested content. See screenshot

    enter image description here

    https://github.com/umbraco/Umbraco-CMS/blob/c85185bdb0e8a50609fa82bd0f83c4f7af8ae1df/src/Umbraco.Web.UI.Client/src/less/components/umb-nested-content.less

  • Dave Woestenborghs 3213 posts 10799 karma points MVP 4x admin c-trib
    Aug 14, 2018 @ 10:20
    Dave Woestenborghs
    0

    Hi Martin,

    I assume you did an upgrade.

    Have you tried clearing your ClientDependency cache ?

    Last time I ran 7.12 from source Nested Content looked fine.

    Dave

  • Dmitriy 135 posts 510 karma points
    Aug 14, 2018 @ 12:09
    Dmitriy
    0

    How to clear CD cache?

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 10:24
    Martin Griffiths
    0

    The client dependency generates a new code on upgrade and invalidates the cache....I noticed this recently when I had the file open (very handy!)

    But yes I cleared the cache as well.

    I've checked (and attached) the CSS source and looks like someone's made the floating buttons absolute (they weren't in 7.11.1). Which has now broken the control.

    M.

  • Dave Woestenborghs 3213 posts 10799 karma points MVP 4x admin c-trib
    Aug 14, 2018 @ 10:42
    Dave Woestenborghs
    0

    Which browser are you using ?

    Dave

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 10:45
    Martin Griffiths
    0

    Chrome 68

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 11:04
    Sebastiaan Janssen
    0

    Just to confirm, I see that it looks a bit weird now, still works but it's not ideal :)

    Working on it!

    enter image description here

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 11:07
    Martin Griffiths
    0

    i've gone into the compiled CSS in my build and I ripped out position: absolute; left, top and the padding for .nested-content__icons

    Seems to mostly go back to normal after that.

    M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 11:42
    Sebastiaan Janssen
    0

    Weirdly, on a fresh install it all works well, I'll look into the install where it looks weird and compare them.

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 11:47
    Martin Griffiths
    0

    hmm that's odd, the absolute positioning cannot be disputed in the source code which wasn't there in 7.11. So i'm not sure in what scenario that would work on a fresh build vs an existing one.

    Good luck finding the problem.

    Many thanks M.

  • Dmitriy 135 posts 510 karma points
    Aug 14, 2018 @ 12:03
    Dmitriy
    0

    Same problem. But I updated with nuget from version where nested content was not a part of core. May be it is important.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 12:02
    Sebastiaan Janssen
    0

    Not disputing, just saying it looks normal on a fresh install! Note the dev tools..

    enter image description here

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 12:08
    Martin Griffiths
    0

    Ahh Sebastiaan, I think Dmitriy may have uncovered the answer.

    In my build i'm using the latest non-core AND core versions of nested content, due to the length of this project.

    So the CSS must've busted the non-core version!

    M.

  • Dmitriy 135 posts 510 karma points
    Aug 14, 2018 @ 12:18
    Dmitriy
    0

    I have tried to update the same old site to 7.11.1 and problem don't appears. Looks like issue exactly in 7.11

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 12:54
    Sebastiaan Janssen
    0

    Aha, that's a good find. If I recall correctly you can switch from the package version of NC to the core version of NC without problems. I don't think we changed the stored data format at all.

    Of course make sure to create a database backup first as I am not 100% sure the data format is the same, but I remember that being the goal for building NC into core, to be able to switch easily.

  • Dave Woestenborghs 3213 posts 10799 karma points MVP 4x admin c-trib
    Aug 14, 2018 @ 12:58
    Dave Woestenborghs
    0

    Hi Sebastiaan, Martin,

    I recently removed the legacy Nested Content from a project. The only thing needed was changing the datatype. If i recall correctly you don't even need to reset the datatype configuration.

    Dave

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 12:58
    Martin Griffiths
    0

    Hi Sebastiaan.

    I'm pretty sure I tried and lost the data trying to switch but I will validate that for sure shortly.

    I'll also check to see what it looks like visually, by swapping.

    Back soon!

    M

  • Lee Kelleher 3878 posts 14604 karma points MVP 9x admin c-trib
    Aug 14, 2018 @ 13:18
    Lee Kelleher
    2

    For swapping NC from (old) package version to the Umbraco core version, please see my answer on this thread... https://our.umbraco.com/forum/using-umbraco-and-getting-started/90229-migrating-nested-content-to-77#comment-284837

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 13:23
    Martin Griffiths
    0

    Hi Lee

    Many thanks for the clarification, I was pretty sure data gets blatted...I'll use that SQL to replace my existing datatypes. :-)

    Cheers Martin

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 13:24
    Martin Griffiths
    0

    I've just checked my doc/datatypes and this CSS problem is definitely breaking the core version of nested content!

    Bah!

    M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 13:27
    Sebastiaan Janssen
    0

    Did you revert the changes you made earlier though? It should only affect the package version of NC, right?

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 14:06
    Martin Griffiths
    0

    Hi Sebastiaan

    Yes I reverted.

    Sadly the result on a non-core nested content is even worse!

    enter image description here

    problems here appear to be in (i've commented culprits out)...

    in umbraco.css

    .nested-content__heading i {
        color: #999;
        /* position: absolute; */
        left: 0;
    }
    

    in nestedcontent.css

    .nested-content__heading i {
        /* vertical-align: text-top; */
        color: #999;
        margin-right: 10px;
    }
    

    extra: the second entry was merely just to get the thing working again.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 14:33
    Sebastiaan Janssen
    0

    Yes, we're aware that we caused problems on the non-core ones, working on it.

    But.. the core NC instance looks fine, right? And you tried switching all your non-core ones to the the core one? That was what I gathered from your updates that you were going to try that.

    Anyway, we're working on a solution soon to make both happy again side-by-side , I'll keep you posted!

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 14:36
    Martin Griffiths
    0

    Hi Sebastiaan

    No, both core and non-core versions of NC look like my screen grabs posted after 7.12 upgrade. So both are broken without me manually tweaking the CSS.

    As Lee has described how to move to core without losing data (SQL) i'll convert the old ones over now.

    M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 14:39
    Sebastiaan Janssen
    0

    Alright, try to make 100% sure that the css is the one you got with 7.12.0 - no cheating and making manual tweaks. 😉😉

    Then make sure to bump ClientDependency.config.

    You may need to do a hard cache refresh in your browser.

    After that the Core version of NC should look just fine, I can reproduce that on a clean install. However, I am very unfamiliar with NC, so I don't know where the orange things are coming from, happy to test if I know how to make them appear! 🙂

  • Dave Woestenborghs 3213 posts 10799 karma points MVP 4x admin c-trib
    Aug 14, 2018 @ 14:46
    Dave Woestenborghs
    1

    Also make sure the css from the legacy NC package is not loaded. It uses the same class names.

    Dave

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 14:54
    Martin Griffiths
    2

    Ok so I did the following to my 7.12 build...

    1. Ran Lee's SQL to force change datatypes from "Our.Umbraco.NestedContent" to "Umbraco.NestedContent"
    2. Re-copied Umbraco folders (Umbraco and Umbraco_Client) from my nuget package to the project folder.
    3. Uninstalled nuget package "Our.Umbraco.NestedContent" & removed App_Plugins/NestContent
    4. Increased CD version number.
    5. Rerun project and force cleared cache.
    6. Rebuilt ModelsBuilder Models
    7. Exported a uSync dump.

    ALL IS GOOD!

    So I think it's fairly safe to say the CSS changes were clashing with the non-core version in my build. Subsequently removing (thanks to Lee's tidbit) the plug-in has now solved the problem!

    So maybe a few tweaks to try and allow the two to co-exist in the same project would be sensible.

    Cheers M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 15:02
    Sebastiaan Janssen
    1

    Ah that makes sense when both are loaded they would start clashing, good find!

    Yup, we're probably going to rename the css classes for the core version so they won't clash any more.

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 15:00
    Martin Griffiths
    0

    Oh crud!

    I've found another bug! albeit minor!

    Drag change the order of a collapsed NC and it stays confined vertically to the containing block.

    Do the same for an expanded one and it suddenly jumps out of the container to the left as your drag up and down!

    The behaviour is a bit weird as it seems to happen sometimes to collapsed ones too after bug exhibits itself.

    M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 14, 2018 @ 15:02
    Sebastiaan Janssen
    1

    I saw that earlier too, we'll have a look!

  • Martin Griffiths 781 posts 1178 karma points c-trib
    Aug 14, 2018 @ 15:07
    Martin Griffiths
    0

    One extra thing...

    After you've dropped an item during a sort, I think it should remain collapsed or if you've dragged an expanded that should remain expanded.

    If you drag a collapsed item sometimes it expands....quite annoying if you're doing multiple sorts.

    M.

  • Sebastiaan Janssen 4847 posts 14373 karma points MVP admin hq
    Aug 15, 2018 @ 13:32
    Sebastiaan Janssen
    102

    Alright, for anyone else running into this problem, this will be fixed in 7.12.1 which is due out early next week. We've updated the styles that the core NC uses so that they don't conflict with the "legacy" NC version if it is also installed.

    For now you can drop these updated files in your ~/Umbraco folder:

    After updating the files, make sure you update the version in your ~/Config/ClientDependency.config file (just make it 1 higher or lower) and refresh the site.

    Before:

    enter image description here

    After:

    enter image description here

    @martin: I've confirmed that the sorting issue has been there for longer, also in the legacy version. We're looking into fixing that as well, but no promises for 7.12.1 :)

Please Sign in or register to post replies

Write your reply to:

Draft