Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Mar 18 06:46

    MoOx on master

    Update README.md (compare)

  • Mar 15 08:38
    Mikeskay closed #467
  • Mar 14 15:44
    Mikeskay opened #467
  • Nov 28 2018 14:59
    baribadamshin commented #250
  • Nov 23 2018 13:44
    RyanZim closed #466
  • Nov 23 2018 13:44
    RyanZim commented #466
  • Nov 23 2018 10:09
    ashokkumarsand opened #466
  • Sep 28 2018 16:55
    ThatGuySam commented #441
  • Sep 28 2018 16:54
    ThatGuySam commented #441
  • Sep 04 2018 18:53
    swrobel commented #267
  • Jun 15 2018 15:48
    mamoru-kun commented #319
  • Jun 15 2018 15:48
    mamoru-kun commented #319
  • Jun 14 2018 11:51
    dutscher commented #350
  • Jun 04 2018 08:14

    MoOx on gh-pages

    publish: oops 2 generated from… (compare)

  • May 31 2018 00:10
    RyanZim commented #438
  • May 30 2018 22:27
    Mayurifag commented #438
  • May 30 2018 01:12
    kitsuyui commented #463
  • May 29 2018 12:47
    piotr-cz commented #251
  • May 29 2018 08:10
    VBagmut commented #464
  • May 29 2018 08:05
    MoOx commented #463
michaelkdh
@michaelkdh__twitter
:root {
--fontSize: 1rem;
}
I am trying to make this available globally: @custom-media --tablet (min-width: 769px);
michaelkdh
@michaelkdh__twitter
sorted out already
softshape
@softshape
Can't make it work. I've installed it on Windows (if that matters) -
npm install -g postcss postcss-cli postcss-cssnext
got 3 warnings -
npm WARN optional Skipping failed optional dependency /postcss-cli/chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents@1.1.3
npm WARN postcss-cssnext@3.0.2 requires a peer of caniuse-lite@^1.0.30000697 but none was installed.
Then type "postcss -u cssnext assets.css -o bundle.css" and see "Plugin Error: Cannot find module 'cssnext'"
Ah! Found it. The correct line is "postcss assets.css -u postcss-cssnext -o bundle.css"
AlexanderTserkovniy
@AlexanderTserkovniy
Hi guys, does cssnext has cssnano built-in?
Ryan Zimmerman
@RyanZim
No
However, both cssnext and cssnano have autoprefixer built-in IIRC
Not sure if cssnano removed that in the latest version; I forget
AlexanderTserkovniy
@AlexanderTserkovniy
Thanks
Ghost
@ghost~580ed9c0d73408ce4f309ef0
This message was deleted
MartinTichovsky
@MartinTichovsky
hello, i admin, that all thing about postcss-cssnext is very confusion for me, but i can ask, if is here any possibility to add postcss-cssnext to visual studio? I would like parse CSS4 code, but in csslint i receive only error messages. Thanks
ZB
@ianmilliken
Hi guys, has anybody had the issue where calling @apply foo only works the first time you call it? That's what I'm getting - wondering if anybody knows how to fix it? I'm running through Gulp, getting no error messages in the console, just empty styles being output.
IOIIOOIO
@IOIIOOIO

Hi there, one of the guys at work wants to change from SASS to Less... and I was thinking if we're going to make a change then why not PostCSS. He mentioned something about "symbolic links" or "reference path" or something like that which is a feature in Less that he wants.

Can anyone point me in the right direction? Is there a PostCSS plugin that could help us with that?

I believe he is referring to this feature:

https://css-tricks.com/reference-imports-in-less-are-kinda-cool/

IOIIOOIO
@IOIIOOIO
^ I wonder if a PostCSS workflow would negate the need for that type of thing anyway
IOIIOOIO
@IOIIOOIO
^ I think I've found what I'm looking for: https://github.com/dehuszar/postcss-reference
IOIIOOIO
@IOIIOOIO

Hi I would like to use CSS custom properties but we only support Chrome so I don't want to be limited to defining it in :root, and i want my variables to be live

Is there a way I can prevent the compiler from touching custom properties?

IOIIOOIO
@IOIIOOIO

^ would it have something to do with the browser scope option?

If that is the case then I would suggest that you add the option in your playground... I want to use the playground to do a Proof of Concept so it would be helpful if I could specify what browser I'm targeting for compilation

Felix Dorner
@felixdorner_twitter
Hey guys, I wonder how to improve the speed of the npm run time when processing postCSS with postcss-easy-import & cssnext? Is there a trick or does it really take so long (more than a second) to compile the output css? Normally I wouldn't bother but when using a workflow with browser-sync changes take some time to display as the css is processing so slow.
Ryan Zimmerman
@RyanZim
If you've got a deep import tree, it can take awhile
Felix Dorner
@felixdorner_twitter
@RyanZim I see. Actually there a lot of imports but the tree is max 2 level deep. Do you think it would be faster to use Gulp instead of NPM scripts?
Ryan Zimmerman
@RyanZim
@felixdorner_twitter I doubt it, your bottleneck is probably postcss-easy-import itself.
Austin Peterson
@theskillwithin
is there a way to convert existing scss into nextcss
Andrey Gubanov
@finom
Guys, how to bring back warnings caused by undefined custom props?
Ryan Zimmerman
@RyanZim
cssnext({
  features: {
    customProperties: {
      warnings: true
    }
  }
})
@finom
That should do the trick
Andrey Gubanov
@finom
@RyanZim thank you
Will
@Willadaygo
Hey guys, I'm getting an issue where I can't compile negative variables e.g. -var(--header-sm) used to compile -70px, now it's just ignoring it
any ideas?
I supposed i could use calc(-1 * var(--example) ) but that's just so verbose right?
Aljosa Mohorovic
@aljosa
in index.css i have "@import url("viewports.css")" with @custom-media definitions. i get "Missing @custom-media definition for..." when i try to use "@media (--viewport-def) {}", any idea why?
Ryan Zimmerman
@RyanZim
@import "viewports.css" is what you want
Dominic Böttger
@DominicBoettger
hello
Ryan Zimmerman
@RyanZim
:wave:
Emmanuel Sekyi
@theSekyi
hello
this is my postcss.config.js
module.exports= {
    parser: 'sugarss',
    plugins: {
        'postcss-import': {}
        ,
        'postcss-mixins': {}
        ,
        'postcss-nested': {}
        ,
        'postcss-cssnext': {
            browsers: ['last 2 versions',
            '> 5%'],
            features: {
                customProperties: {
                    variables: {
                        mainColor: #0d47a1;
                        grey: #ecf8ff;
                        white: #ffffff;
                    }
                }
            },
        }
        ,
        'autoprefixer': {}
        ,

        'postcss-simple-vars': {}
        ,

        'cssnano': {}
        ,
    }
}
my autoprefixer works fine but cssnext doesn't. my & nested files are not being transformed
i am using webpack
M.K.
@mk-pmb
Hi! Where can I read about inheritance for the var() and \@apply features from included CSS files?
Andreas Herd
@mendrik
hey is there a way to disable the ampersand for nested rules?
and have it only when appending rules to the parent
Andreas Herd
@mendrik
ok installing postcss-nested fixed it
Aaron Beall
@aaronbeall

Is there any way to nest in this way? I have this:

.foo {
  & .bar {
    & input {
      @nest .red& { color: red; }
      @nest .blue& { color: blue; }
    }
  }
}

Which turns into this:

.red.foo .bar input {
    color: red;
}
.blue.foo .bar input {
    color: blue;
}

But I want this:

.foo .red.bar input {
    color: red;
}
.foo .blue.bar input {
    color: blue;
}

Basically I want to parent the current nested selectors parent, not grandparent/root of the nesting...

Ben Chiciudean
@benydc
how do I get lastchild with nesting?
this doesn’t work:
  & :last-child {
     background: #ff0000;
  }
Acurse
@acurseJ
how can I close the postcss-calc with cssnext option ?
MoOx
@MoOx

Farewell css(next) 👋

Two short blog posts to explain why I am deprecating cssnext.

• Farewell CSS https://moox.io/blog/farewell-css/

• Deprecating cssnext https://moox.io/blog/deprecating-cssnext/