Stack Overflow
Stack Overflow

Questions tagged [tachyons-css]

Tachyons is a functional CSS toolkit for creating fast loading, highly readable, and 100% responsive interfaces with as little css as possible.

Tachyons

Create fast loading, highly readable, and 100% responsive interfaces with as little css as possible.

20 questions
6
votes
1 answer

How to combine multiple classNames in React?

I'm writing a small React app with Create-React-App. For simple styling tweaks I use tachyons-css. Due to frequent reappearing CSS styling issues I recently switched from classic CSS styling to CSS modules (also valid question for SCSS). Now I…
ft-be
  • 63
  • 1
  • 6
2
votes
1 answer

How to use tachyons-custom?

I am using Tachyons CSS for my web app and I need to add a width css property of width 45% for medium screen. I did npm install tachyons-custom and I don't know what to do next. I couldn't find any tutorial online about adding a new tachyons…
calvert
  • 469
  • 2
  • 13
2
votes
0 answers

problem adding css toolkit like tachyons to next.js project

for training purpose I have created a ropo-Friend web app as a csr , now for the same purposes I am tring to recreate the same project using next.js this time as a great tool for ssr projects and I really have nightmares importing css addons like…
kyrolos magdy
  • 190
  • 1
  • 2
  • 13
1
vote
1 answer

How to hide table of contents on mobile devices

I am doing my first clumsy steps to set up a blog (with Hugo, via blogdown / R) and struggle with my floating table of contents. After lengthy trial and error I have been able to set it up, however, I am unable to hide the table of contents when…
zoowalk
  • 1,570
  • 13
  • 25
1
vote
1 answer

Responsive layout using Flexbox and Tachyons

I would like to create a layout like this: I would like to use React and Flex. To do that I'm using Tachyons and it's media queries that are: ns = not small -> @media screen and (min-width: 30em) = [0, 30em] m = medium ->…
user9944766
1
vote
1 answer

tachyons.io: emphasize a single word in italics

My problem I am using the tachyons.io framework to style an HTML page. I would like to emphasize a single word in a sentence with italics fonts, without discontinuing the sentence flow by a line break. The manual The manual suggests using
Adam Matan
  • 107,447
  • 124
  • 346
  • 512
1
vote
1 answer

Tachyons - how to display none for landscape screen

I'm using http://tachyons.io/ and have a icon. I want to display that icon only on small devices but when its landscape mode to also display on small devices. Since the screen size for portrait is less than 480px but if I rotate, its more than 480px…
fscore
  • 2,347
  • 5
  • 31
  • 64
0
votes
0 answers

Confusion around the not-small breakpoint in tachyons

Using tachyons css library: I don't understand how the ns breakpoint works. According to the docs the breakpoints are defined as: Media Query Extensions: -ns = not-small [ @media screen and (min-width: 30em) ] -m = medium [ @media screen and…
ExtraInfo
  • 3
  • 2
0
votes
0 answers

how to change base width and height for tachyons?

In documentation they have default values and scale for height. Is it possible to set height 6rem somehow, but without additional css classes, just change .h4, for example, with different value? link for docs tachyons
turok87
  • 81
  • 1
  • 10
0
votes
1 answer

Is Tachyons enough for UI developement?

Do I still need to use a UI framewok like Bootstrap or MDL if I use http://package.elm-lang.org/packages/justgage/tachyons-elm/1.0.0/Tachyons? Or is Tachyons all I need for UI?
benbro00002
  • 141
  • 3
0
votes
0 answers

Blurry content on css animation on Chrome

Here are the css properties for the .grow class in Tachyons CSS. .grow { -moz-osx-font-smoothing: grayscale; backface-visibility: hidden; transform: translateZ(0); transition: transform 0.25s ease-out; } It seems to follow the best…
ludobourgoin
  • 1
  • 1
0
votes
1 answer

padding not applying to input using tachyons css

I have the following layout:
0
votes
1 answer

Better way to change background color based on element's property

I'm working on a project using Django, some JavaScript and Tachyons. I have the following in a template file: {% for alarm in alarm_list %}
Harlin
  • 637
  • 8
  • 15
0
votes
1 answer

After npm install tachyons, tachyons package not added in package.json?

npm install output: npm WARN afterxii@1.0.0 No description npm WARN afterxii@1.0.0 No repository field. + tachyons@4.11.1 updated 1 package and audited 518 packages in 5.404s found 0 vulnerabilities How can it be added in package.json
inthemaking
  • 1
  • 1
0
votes
1 answer

Need to over-ride default class using tachyons

I am using tachyons and I am not able to override default css using tachyons. I am avoiding custom css I am pasting developer tools pic, which would have code too
Sahil Kkr
  • 155
  • 2
  • 14
1
2