trafnar · HackerTrans

11 maanden geledendiscuss

I wanted to suggest a tweak to this cool project: The panning and zooming feel very sluggish. I'm not sure if there's a technical reason it needs to be that way, but if the animation duration or spring used to control that can be made faster, it will feel much nicer to navigate around.

trafnar

11 maanden geledendiscuss

I was using this recently and found some situations where I didn't like the way the lines looked. Reading through the github comments from the author, it sounds like an improved version of this library is maintained within the tldraw codebase.

trafnar

12 maanden geledendiscuss

Their app listens to your calls and transcribes things. I think this visualizer helps indicate when it is actively listening.

trafnar

vorig jaardiscuss

It's still relevant, the language hasn't changed much since I made this course.

trafnar

2 jaar geledendiscuss

Panda seems really nice. As someone who does a lot of "creative" CSS work, writing styles quickly is important to me. I find writing styles as Javascript objects kinda cumbersome. I wish there was a way to use Imba's CSS system within a React or other Javascript app. https://imba.io/docs/css/syntax

Imba allows you to write CSS anywhere in a component definition using CSS-like syntax (rather than Javascript object syntax).

The syntax for adding a quick inline style is so simple:

  <div [width:20px]>

You can even do hover states in an inline style:

  <div [color:red @hover:blue]>

And interpolation is easy too:

  <div [width:{someValue}px]>

Putting a CSS block at any level of your tag hierarchy scopes it to that tag.

  <div.foo>
    <div.bar>
      css color:red # this applies to div.bar
        em color:blue # this applies to div.bar em
      
      "hello"
      <em> "world"

CSS blocks declared in a component definition but outside of the markup, apply to the whole tag. CSS declared in a file, outside of a component definition, apply to all components defined in that file. There is also a global keyword to apply styles globally.

and there's a whole range of other useful features, a favorite of mind is the shorthand syntax for things like this:

  c:red # same as color:red
  d:vtc # same as display:flex flex-direction:column justify-content:center
  x:10px rotate:30deg # same as transform:translateX(10px), rotate(30deg)