lessphp icon indicating copy to clipboard operation
lessphp copied to clipboard

Parse error with CSS Grid Layout and named grid lines/areas

Open Celti opened this issue 7 years ago • 3 comments

When attempting to use named grid lines and areas in a LESS stylesheet I get a parse error from lessphp. less.js works just fine.

Fatal Error: parse error: failed at `grid-template-rows:` ../../lib/tpl/dokuwiki-template-grid/css/structure.less on line 12
#dokuwiki__site {
    display: grid;
    box-sizing: border-box;
    width: 100vw;
    height: 100vh;
    grid-template-rows:
        [header] 2em
        [content] 1fr
        [footer] 2em;
    grid-template-columns:
        [left] minmax(auto, min-content)
        [center] auto
        [right] minmax(auto, min-content);
    grid-gap: 1px;
}

Celti avatar Feb 23 '18 06:02 Celti

A trick to insert (nearly) every unparsed code in LESSPHP: https://github.com/splitbrain/dokuwiki/issues/2254#issuecomment-386814503

Michaelsy avatar May 07 '18 04:05 Michaelsy

I made a patch that is working. This protects CSS grid names automatically for you and should allow for variables to be used in the statement if needed; I have not tested if variables work.

It's not elegant but it works: Pull Request #643

blizzardengle avatar Oct 23 '18 05:10 blizzardengle

~"screen CSS code from LESS parser"

Rainbow-Spike avatar Aug 12 '19 06:08 Rainbow-Spike