Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Dec 02 03:39
    dependabot[bot] labeled #116
  • Dec 02 03:39
    dependabot[bot] opened #116
  • Dec 02 03:39

    dependabot[bot] on npm_and_yarn

    Bump decode-uri-component from … (compare)

  • Sep 08 22:45
    jvanderen1 edited #377
  • Sep 08 22:45
    jvanderen1 opened #377
  • Aug 02 01:03

    basarat on master

    chore: built files (compare)

  • Aug 01 23:10
    basarat commented #371
  • Aug 01 22:56

    basarat on v2.4.0

    (compare)

  • Aug 01 22:56

    basarat on master

    2.4.0 (compare)

  • Aug 01 22:56

    basarat on master

    docs: plan release (compare)

  • Aug 01 22:54
    basarat commented #371
  • Aug 01 22:53

    basarat on master

    Adding support for the "prefers… (compare)

  • Aug 01 22:53
    basarat closed #371
  • Aug 01 22:53
    basarat reopened #371
  • Aug 01 12:24
    jeffreylanters commented #371
  • Apr 28 10:40
    dependabot[bot] labeled #115
  • Apr 28 10:40
    dependabot[bot] opened #115
  • Apr 28 10:40

    dependabot[bot] on npm_and_yarn

    Bump async from 2.6.2 to 2.6.4 … (compare)

  • Feb 19 07:07
    basarat commented #376
  • Feb 19 07:07

    basarat on master

    2.3.0 (compare)

Mark van den Brink
@markvandenbrink
I will create issues for the shorthand functions.
Too bad we cannot raise a compile time error when the background-color is set on a background which is not the last one. Thought about firing a runtime error, but I think we should keep the functions pure.
Mark van den Brink
@markvandenbrink
Let's add a note to the function comment to let the user know/understand the background-color of the last background is used.
Christopher Wallis
@notoriousb1t
:+1:
Christopher Wallis
@notoriousb1t
import * as typestyle from 'typestyle';

const ts = typestyle.typestyle();
might be a little weird
Basarat Ali Syed
@basarat
^ this is regarding typestyle/typestyle#94. I agree its weird
Something like sub sounds worthy ... but its makes it feel like its connected to default (which it isn't)
createFoo feels like the right approach. FreeStyle has create https://github.com/blakeembrey/free-style#usage and fella has createRenderer http://fela.js.org/
Christopher Wallis
@notoriousb1t
the only issue I have with create() is that it is a little generic when importing directly. It would look okay with * imports
Basarat Ali Syed
@basarat
createInstance createNew createSub
createNewContainer
createContainer?
Basically its createNewFreeStyle :)
Christopher Wallis
@notoriousb1t
yep
Basarat Ali Syed
@basarat
but would be nice to replace the name FreeStyle with something that makes sense for us
createNewStylesContainer?
Christopher Wallis
@notoriousb1t
createTypeStyle :wink:
Basarat Ali Syed
@basarat
I like it :)
it is what it is :D
Christopher Wallis
@notoriousb1t
I guess so
Basarat Ali Syed
@basarat
With this I don't feel like moving media,classes etc to it anymore :heart:
Christopher Wallis
@notoriousb1t
:thumbsup:
Basarat Ali Syed
@basarat
okay if I merge and deploy as a minor update for brad to try?
Christopher Wallis
@notoriousb1t
looks good to me
Hanster
@hanct
Currently, i am using react.js , and need to import an existing css file. Can TypeStyle be used to refer to an existing css file?
Christopher Wallis
@notoriousb1t
You can add raw css to TypeStyle by calling cssRaw('body{font-size:14pt;}')
@hanct, I recommend using webpack raw loader over embedding it directly as a string
Basarat Ali Syed
@basarat
Hanster
@hanct
@notoriousb1t @basarat . Ok! Thanks for the replies. I will take a look at your suggessted options. But that said, it would be great if TypeStyle can be enhanced to allow the option to simply point to an external css file or an array of external css files...instead of having to copy the contents from these external css files and paste into the javascript file.
Christopher Wallis
@notoriousb1t
@basarat I finished getting an initial online css to typestyle converter onto typestyle.io
It isn’t linked anywhere on the site, but my initial tests (converting bootstrap and skeleton) look okay
It could also do with some prettying up if anyone feels up to it (just using textareas not code editors)
Bnaya Peretz
@Bnaya
Hey all :) Looks like a very useful lib and i'm considering it over css modules
Dose anyone has any warnings before i start with it?
And a question: How dose the final css is injected to the document?
Bnaya Peretz
@Bnaya
Is there any sourcemaps-like mechanism or anything that planned?
Christopher Wallis
@notoriousb1t
I would say that the biggest things to remember is to not depend on the styles being loaded in order, and that creating styles with the same properties and values will result in the same generated class-name
these are great for reducing css, but require a slightly more disciplined view of CSS
@Bnaya, if you don’t set a style target, a style tag will be injected into the head of the document and TypeStyle will replace the contents of the style block as you change styles
If you set a style target, it will output it to that element (<style>)
Christopher Wallis
@notoriousb1t
As far as source maps-like mechanisms go, I don’t think we have discussed that. I am not 100% on how that would work. You can, however, use $debugName to add a prefix to the generated class name for debugging purposes http://typestyle.io/#/advanced/-debugname-
Filip Hájek
@hajek.raven_gitlab

Hello,

I'm using typescript with parcel bundler and getting this error:
/node_modules/typestyle/node_modules/free-style/dist.es2015/index.js: Octal escape sequences are not allowed in template strings

I researched this topic and arrived to conclusion that I need either free-style v 3.2.x or somehow disable strict mode for this one package.
Any Ideas when this PR could be merged?

mukuluec
@mukuluec
Hi everyone,
Does typestyle support some sort of update() function on stylesheet. I have a js object representing the css, and this object is part of redux store of my app. App allows editing of this object. I would like to just pass the updated object to the update({}) function and have it update the CSSOM optimally (maybe diffing to find out what was added, deleted, and modified). Sadly, I hardly find any library supporting that, or maybe I am just not aware. Would be glad to hear from you on how to achieve this data-driven stylesheets usecase. Thanks!