Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Oct 25 2020 14:47
    vesparny removed as member
  • Jan 23 2020 17:14
    kentcdodds removed as member
  • May 07 2019 12:50
    bjoernricks removed as member
  • Dec 06 2018 20:35
    TejasQ commented #419
  • Dec 06 2018 20:06
    kentcdodds commented #419
  • Dec 06 2018 20:04
    kentcdodds commented #419
  • Dec 06 2018 19:58

    kentcdodds on v5.0.0

    (compare)

  • Dec 06 2018 19:55

    kentcdodds on deprecate

    (compare)

  • Dec 06 2018 19:55
    kentcdodds closed #419
  • Dec 06 2018 19:55

    kentcdodds on master

    fix: officially deprecate the p… (compare)

  • Dec 06 2018 19:55
    kentcdodds closed #433
  • Dec 06 2018 19:54
    kentcdodds opened #433
  • Dec 06 2018 19:54

    kentcdodds on deprecate

    fix: officially deprecate the p… (compare)

  • Dec 06 2018 19:52

    kentcdodds on update-stuff

    (compare)

  • Dec 06 2018 19:51

    kentcdodds on master

    chore: update all things so it … (compare)

  • Dec 06 2018 19:51
    kentcdodds closed #432
  • Dec 06 2018 19:48
    codecov[bot] commented #432
  • Dec 06 2018 19:45
    kentcdodds synchronize #432
  • Dec 06 2018 19:45

    kentcdodds on update-stuff

    chore: update all things so it … (compare)

  • Dec 06 2018 19:40
    kentcdodds opened #432
Kent C. Dodds
@kentcdodds
@motleydev, note, you don't need the [ and ]. '& div' is a totally valid key for an object :wink: https://codesandbox.io/s/vy6660k3j3
Mattias Hällkvist
@emattias
Can you not set children prop with .withProps ?
Kent C. Dodds
@kentcdodds
Veli-Pekka Parhiala
@pekq
Having trouble finding documentation on how to achieve something like this with Glamorous
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
Paul Molluzzo
@paulmolluzzo
@pekq those should be usable as is if they're camel-cased to webkitFontSmoothing: 'antialiased' and mozOsxFontSmoothing: 'grayscale'. You can also wrap the key in quotes, but you'll get warnings in the console
Nico Chaves
@nmchaves
I'm just switching over to VS Code. Anyone have recommendations for extension(s) that'll provide syntax highlighting+autocomplete with Glamorous? (Sorry if this is in the docs and I overlooked it :sweat_smile:)
Nico Chaves
@nmchaves
oh nevermind it actually works outta the box. slick! guess those TS declarations are paying off!
Anna Pankevich
@circusofive_twitter
really loving glamorous
i'm just hitting a small snag on how to import local font families
i can't find any examples and im not sure how to go about it
Anna Pankevich
@circusofive_twitter
nvm, looks like injectGlobal will do the job
Anna Pankevich
@circusofive_twitter
is there a better way to import local fonts using glamorous?
Douglas Mason
@douglas-mason
hi, it appears https://glamorous.rocks/ is not working? Just getting a 500
didn't want to put an issue for the site in the project repo for the lib
Luke John
@luke-john
hey @douglas-mason, the site appears to be working for me right now. Was possibly an outage with next which the site is hosted with.
the glamorous.rocks site is also managed/developed on github at https://github.com/kentcdodds/glamorous-website. So if you ever have issues in the future, feel free to create an issue there.
Thanks for reporting it, hope you're having a Merry Christmas.
Douglas Mason
@douglas-mason
thanks @luke-john , yeah it's up for me now. I was looking for the website repo under the paypal org, thanks for clarifying!
Merry Christmas and Happy New Year to you as well!
Lianne Turnbull
@xiavn
Hey, I'm currently working on converting an existing component library (that is made up of lots of private packages) over to using glamorous. The docs give an example of using the glamorous() composition method to extend styles of an existing glamorous component, which up to now I've not had any problems with. However now I'm getting an error related to glamor and a cache miss occurring which is normally a sign of multiple instance of glamor running. I assume this is because I'm trying to extend the styles on a component that is located in another npm package, and am ending up with two different instances of glamor. I can get around this problem simply by setting the css prop or the styles themselves on the component, rather than using the glamorous() method; but I was wondering if anyone had any advice on a better way of handling this?
Pavel Ermolin
@Powell-v2
Hey guys, I'm trying to set up glamorous locally for the first time but an error while running "validate" script won't let me :D Somebody willing to give me a hand with this? I was only following instructions in the guide for contributors (so stuck on step 3). Here is the error message I've got:
> glamorous@0.0.0-semantically-released validate /Users/powell_v2/Downloads/glamorous
> kcd-scripts validate lint,build-and-test,test:cover

/Users/powell_v2/Downloads/glamorous/node_modules/kcd-scripts/dist/utils.js:135
  scripts = Object.entries(scripts).reduce(function (all, _ref3) {
                   ^

TypeError: Object.entries is not a function
    at getConcurrentlyArgs (/Users/powell_v2/Downloads/glamorous/node_modules/kcd-scripts/dist/utils.js:135:20)
    at Object.<anonymous> (/Users/powell_v2/Downloads/glamorous/node_modules/kcd-scripts/dist/scripts/validate.js:32:53)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.runMain (module.js:604:10)
    at run (bootstrap_node.js:383:7)
    at startup (bootstrap_node.js:149:9)
Luke John
@luke-john
have responded on github @Powell-v2, sorry I don't always see the gitter notifications. https://github.com/paypal/glamorous/issues/302#issuecomment-355269852
Pavel Ermolin
@Powell-v2
thanks! np : )
Luke John
@luke-john
@xiavn you should be able to confirm if that is the case with npm ls glamor or yarn list glamor. Unfortunately if it is the problem I don't have any suggestions other than shifting glamor to a peer dependency for the package being consumed, if that's possible.
Lianne Turnbull
@xiavn
@luke-john Yeah they both already have it as peer dependency, I assume it's just running two instances of the same version, which still causes problems for some reason.
Adrian Perez
@blackxored
Hi guys

I've a stupid question that's for sure.
I've this code:

const Box = glamorous.div(
  {
    display: 'flex',
    flex: 1,
    flexDirection: 'column',
  },
  space, 
  width, 
  fontSize
);


const App = () => (
  <Box width={1 / 2}>
    <a href="#" style={{backgroundColor: 'green', color: 'white', padding: 10}}>A link</a>
  </Box>
);

Obviously I'm doing something wrong, since the link (anchor tag) gets displayed as flex as well, and I do not want that

I've tried with '&' > { ... } as well
Adrian Perez
@blackxored
anyone?
Luke John
@luke-john
hey @blackxored I've just tried to replicate the issue and have had no luck. the code you've provided seems to behave as expected. https://codesandbox.io/s/3rzvz387m
carl hand
@carlhand11_twitter
Hey guys, newbie to glamorous. I was wondering is it possible to use glamorous in a .ts or .tsx file? It works fine when I import glamorous into a .js file but it complains about glamorous in the .ts files. The error message I get is:
cannot find module 'glamorous'
Luke John
@luke-john
Hey carl, glamorous has bundled declarations so in most cases it should work out of the box with typescript (ts/tsx) files. If you're able to create a small reproduction repo with how you've setup typescript and an example file which is triggering cannot find module 'glamorous' I'll be able to have a look further.
Adrian Perez
@blackxored
Hi, has anyone has an example of making glamorous work with styled-system? As you see above, I'm getting super weird flex behavior and I wondering if I'm doing something wrong, or maybe my understanding of it it's wrong
The link shouldn't be flexed
My apologies if a dumb questions as I've spent the last two years on RN land ;)
Kent C. Dodds
@kentcdodds
Hi @blackxored! There's actually an example on the website: https://glamorous.rocks/integrations#styled-system(https:github.comjxnblkstyled-system)
Ryan Hoffmann
@rjhoffmann

Hey folks, glamorous has found its way into my next project and everything is going great. However, I seem to have run into one issue, and I'm not sure if it's just a (totally justifiable) limitation of glamorous or something that isn't quite clear to me.

https://codesandbox.io/s/qx2qo971n6

What I'd like to be able to do is create a Block component that accepts a prop that will be applied to the style.
Let me know if I can clarify anything further here.

What I have "works", but I'm not sure if that's the best way to go about accomplishing what I need.
Kent C. Dodds
@kentcdodds
Hey @rjhoffmann, here's another arguably better way to do what you were trying to do: https://codesandbox.io/s/n0v60nk12j
Paul Molluzzo
@paulmolluzzo
Maybe I’m missing something, but I don’t think either example needs to pass in the cover or gradient as a prop since they’re in scope when defining the Block component.
Ryan Hoffmann
@rjhoffmann
@paulmolluzzo: They won't be in scope.
@kentcdodds: Thanks, that does look like a more reasonable way.
Callum Denby
@CallumDenby
Hi, I've encountered an issue using glamorous on Safari where my class names are resolving to css-nil for some reason, anyone encounter this before? The component itself is very simple with just padding?
const Link = glamorous.a({
  padding: '5px'
})
All other glamorous components render fine, just that one.
Luke John
@luke-john
Hey @CallumDenby , I've just tried to replicate the issue and don't seem to be able to. the following reproduction in safari appears to work fine for me https://codesandbox.io/s/jp15y2qkv5. if your able to set up a codesandbox reproduction or share the whole code that is leading to the issue I'd be happy to have another look.
Callum Denby
@CallumDenby
Hi @luke-john, I haven't managed to replicate the issue but I found a work around being to just style the div, it seemed to only be the glamorous.a component in use so I just wrapped it.
const Link = ({ href, children }) =>
  <Div css={{
    padding: '5px',
  }}>
    <a href={href}>
      {children}
    </a>
  </Div>
Mordy Tikotzky
@tikotzky
@kentcdodds the link to "the chat" in the codesandbox https://help.glamorous.rocks/ is pointing to https://gitter.im/kentcdodds/glamorous it should be updated to point to here (https://gitter.im/paypal/glamorous)
Mordy Tikotzky
@tikotzky
Hi all, Is it possible to extend the CssProperties allow certain properties to take additional values?
My use case is to allow color and background color css properties to accept a "Color" type as a valid value
(I should specify that this is using TypeScript)
here is a sandbox showing the issue https://codesandbox.io/s/rk8von4wo