by

Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Aug 07 20:26

    ai on ose

    Fix postcss.Classes type (compare)

  • Aug 07 19:05

    ai on ose

    Use class names in visitor hooks (compare)

  • Aug 07 18:48
    ai closed #1343
  • Aug 07 18:48
    ai commented #1343
  • Aug 07 18:47

    ai on ose

    Pass postcss & Result to second… (compare)

  • Aug 07 18:46
    ai labeled #1377
  • Aug 07 18:46
    ai unlabeled #1377
  • Aug 07 18:46
    ai labeled #1387
  • Aug 07 18:46
    ai labeled #1386
  • Aug 07 18:46
    ai labeled #1385
  • Aug 07 18:46
    ai labeled #1384
  • Aug 07 18:46
    ai labeled #1383
  • Aug 07 18:11

    ai on ose

    Update dependencies (compare)

  • Aug 06 23:00

    ai on ose

    Change plugin API (compare)

  • Aug 06 18:01
    mrakcw commented on abfaa71
  • Aug 05 23:27

    ai on ose

    Clean up config Export TransformCallback (compare)

  • Aug 05 23:08
    ai opened #1387
  • Aug 05 23:08
    ai milestoned #1387
  • Aug 05 12:48
    cotwitch commented #1375
  • Aug 05 12:46
    cotwitch commented #1375
Andrey Sitnik
@ai
root.walkDecls(decl => {
  if (decl.prop.startsWith('--')) {
    variables.push(decl)
  }
})
this code collect custom properties from the file
you can use any postcss runner (like postcss-cli) to run it accorss multiple files
Zgjim Gjonbalaj
@zgjimgjonbalaj
Hey all, quick question any chance we can change the mixin name for postcss-custom-media from '@media' to say '@bp'? I am concerned that using original will have a conflict with original approach by prev devs who used actual media queries in CSS files '@media all and (min-width: xxx) {}'
Andrey Sitnik
@ai
@zgjimgjonbalaj I am not sure that we have an option for this
Zgjim Gjonbalaj
@zgjimgjonbalaj
@ai Thanks for your response, I guess may have to remove entirely. Was looking for a quick clean elegant approach any other options you can recommend and/or would this conflict you think with typed out queries?
I do not see any issues or errors popping up currently but figured it may cause problems though considering the original queries are not typed out as a function '@media(--bp)'
Andrey Sitnik
@ai
@zgjimgjonbalaj as I know CSSWG are not sure about custom media
I recoomend to use non-standard mixins by postcss-mixin or non-standard postcss-simple-vars
unfortunately, CSSWG are very bad in creating syntax sugar drafts, so it is hard to create a good CSS syntax arround future specs
Zgjim Gjonbalaj
@zgjimgjonbalaj
I thought postcss-media-queries output to standard CSS media queries? May have misunderstood there. I did attempt to use a mixin but may revisit back again. Thanks for your help!
Andrey Sitnik
@ai
@zgjimgjonbalaj yeap, it is converted to standard CSS media queries
CSS Custom Media was created according to CSS draft from CSSWG, where was suggested official new syntax to CSS
so it is not some custom sytax sugar, but how CSSWG saw the future of CSS
but at the end, CSSWG changed mind about CSS Custom Media and now nobody is sure that this draft will be part of CSS
Zgjim Gjonbalaj
@zgjimgjonbalaj
Ah i see, back to the drawing board! I have not been following their recommendations/suggestions and appreciate the information. I think i'm going to go that route of just creating a custom mixin with @mixin-content and follow that.
JimMorrison723
@JimMorrison723
Hello!
I want to create a stylelint plugin/rule for my project that uses scss files, and i need postcss for that. Is this the right place to ask questions about that? (reading back a little - it might be..)
I want to get an imported file parse - i mean if any declarations has mixins in it, i want it to be there (so basically -> read file -> make css -> and use that information in the file i am currently linting).
I use fs to read the file, but i am lost the "make css" part, that i can use.
Can anyone help me here? Kinda lost in the docs :/
πŸ™ Julien Kirch πŸ™
@archiloque_twitter
Hello, there is a long-standing bug in Safari that require adding line-height: 0vw; to the pages body for responsive fonts size, see for example seaneking/postcss-responsive-type#15 or twbs/rfs#14 . When I try to use it with cssnano the vwis stripped, which makes sense for all other cases but this one. Is there a workaround for this case and/or should I open a ticket for this ? (I checked the project's tickets and doc and found nothing mentioning it, sorry if it's documented somewhere)
Andrey Sitnik
@ai
@archiloque_twitter cssnano is a modular minimizer. You can find plugin, which minimize units and disable it
πŸ™ Julien Kirch πŸ™
@archiloque_twitter
@ai Disabling the convertValues plugin worked, we should be fine with the few things that are unoptimized because of this, thanks !
πŸ™ Julien Kirch πŸ™
@archiloque_twitter
And should I open an issue about this to ask for an exception for this case to the plugin ?
Andrey Sitnik
@ai
@archiloque_twitter yeap, you can try to open an issue
πŸ™ Julien Kirch πŸ™
@archiloque_twitter
Thanks
Marcello
@marcebdev
So I've set up postcss-preset-env running with the default stage 2 its working properly for chrome and firefox transpiling down but Safari is still not working... is there something else I need to be doing?
Andrey Sitnik
@ai
@marcebdev what CSS feature do not work in Safari?
Marcello
@marcebdev
@ai I'm trying to use the gap property which atm only really works on safari... I've setup postcss-preset-env so it's working on chrome correctly now (before it wasn't) but still remain broken on Safari
The default browser list is supposed to support all browsers from what I can see so not sure
Andrey Sitnik
@ai
show your code
do you use it with flexbox or with grid?
Marcello
@marcebdev
I'm using it with flexbox, I know it only has default support on newer Firefox versions from caniuse but the whole point of postcss-env-preset is supposed to be able to do this, no?
.frame {
  display: flex;
  column-gap: 30px;
}
as I mentioned it wasn't working on Chrome before either, hence why I added preset-env but even with the plugin Safari is not playing nice
Andrey Sitnik
@ai
I afraid that it is a limit of gap polyfill
it works well to polyfill gap for grid
@jonathantneal am I right? should we show a warning on gap and display: flex if we have a browser without gap support for flexbox?
Marcello
@marcebdev
Ah ok, appreciate the insight... I guess for now I will work on making margins work. At least I know I'm not going crazy trying to figure out what is wrong
@ai A warning would be awesome imo luckily I double-checked on safari or I wouldn't have known
Gabo
@GaboPlums_twitter
Hello... I'm a new developer
Andrey Sitnik
@ai
hi :)
Gabo
@GaboPlums_twitter
I wanna learn more about css
At this moment I'm working with tailwind framework
Is very easy and usefull
Andrey Sitnik
@ai
I agree
Gabo
@GaboPlums_twitter
@ai How long have you been working with tailwind?
Andrey Sitnik
@ai
I do not use Tailwind CSS
But I heard the same feelings from the collegues which I trust
Gabo
@GaboPlums_twitter
It sounds great ... you are frontend or full stack?
Andrey Sitnik
@ai
I was a fullstack (Ruby), but not a frontend
But I can do Node.js :) Just do not have a project to be a fullstack
Gabo
@GaboPlums_twitter
Are Ruby and Node.js similar?
Andrey Sitnik
@ai
nope :) very different