Yumma CSS 0.1.0
Nothing beats a good update, so let’s talk about this today. This one’s not as abundant, but there are some pretty handy improvements — Yumma CSS 0.1.0!
You may also want to take a look at some of the release notes but, anyway, these are the most noticeable shifts:
- Box Model: Additions and improvements for Height, Margin, Padding, and Width utility classes.
This is an incremental update that may contain bug fixes. Minor releases follow semantic versioning conventions. In other words, this should be an easy update for you.
Box Model
Previous versions of Yumma CSS had some inconsistencies with the Height, Margin, Padding, and Width utilities. Version 0.1.0 addresses these inconsistencies and also fixes unexpected results and makes the range linear, starting from 0-100.
The scale ranges from 0 to 100, with a base value of 0.25rem
.
Class | Property |
---|---|
h-0 | height: 0rem; |
h-1 | height: 0.25rem; |
h-2 | height: 0.5rem; |
h-3 | height: 0.75rem; |
h-4 | height: 1rem; |
h-5 | height: 1.25rem; |
h-6 | height: 1.5rem; |
h-7 | height: 1.75rem; |
h-8 | height: 2rem; |
h-9 | height: 2.25rem; |
h-10 | height: 2.5rem; |
h-11 | height: 2.75rem; |
h-12 | height: 3rem; |
h-13 | height: 3.25rem; |
h-14 | height: 3.5rem; |
h-15 | height: 3.75rem; |
h-16 | height: 4rem; |
h-17 | height: 4.25rem; |
h-18 | height: 4.5rem; |
h-19 | height: 4.75rem; |
h-20 | height: 5rem; |
h-21 | height: 5.25rem; |
h-22 | height: 5.5rem; |
h-23 | height: 5.75rem; |
h-24 | height: 6rem; |
h-25 | height: 6.25rem; |
h-26 | height: 6.5rem; |
h-27 | height: 6.75rem; |
h-28 | height: 7rem; |
h-29 | height: 7.25rem; |
h-30 | height: 7.5rem; |
h-31 | height: 7.75rem; |
h-32 | height: 8rem; |
h-33 | height: 8.25rem; |
h-34 | height: 8.5rem; |
h-35 | height: 8.75rem; |
h-36 | height: 9rem; |
h-37 | height: 9.25rem; |
h-38 | height: 9.5rem; |
h-39 | height: 9.75rem; |
h-40 | height: 10rem; |
h-41 | height: 10.25rem; |
h-42 | height: 10.5rem; |
h-43 | height: 10.75rem; |
h-44 | height: 11rem; |
h-45 | height: 11.25rem; |
h-46 | height: 11.5rem; |
h-47 | height: 11.75rem; |
h-48 | height: 12rem; |
h-49 | height: 12.25rem; |
h-50 | height: 12.5rem; |
h-51 | height: 12.75rem; |
h-52 | height: 13rem; |
h-53 | height: 13.25rem; |
h-54 | height: 13.5rem; |
h-55 | height: 13.75rem; |
h-56 | height: 14rem; |
h-57 | height: 14.25rem; |
h-58 | height: 14.5rem; |
h-59 | height: 14.75rem; |
h-60 | height: 15rem; |
h-61 | height: 15.25rem; |
h-62 | height: 15.5rem; |
h-63 | height: 15.75rem; |
h-64 | height: 16rem; |
h-65 | height: 16.25rem; |
h-66 | height: 16.5rem; |
h-67 | height: 16.75rem; |
h-68 | height: 17rem; |
h-69 | height: 17.25rem; |
h-70 | height: 17.5rem; |
h-71 | height: 17.75rem; |
h-72 | height: 18rem; |
h-73 | height: 18.25rem; |
h-74 | height: 18.5rem; |
h-75 | height: 18.75rem; |
h-76 | height: 19rem; |
h-77 | height: 19.25rem; |
h-78 | height: 19.5rem; |
h-79 | height: 19.75rem; |
h-80 | height: 20rem; |
h-81 | height: 20.25rem; |
h-82 | height: 20.5rem; |
h-83 | height: 20.75rem; |
h-84 | height: 21rem; |
h-85 | height: 21.25rem; |
h-86 | height: 21.5rem; |
h-87 | height: 21.75rem; |
h-88 | height: 22rem; |
h-89 | height: 22.25rem; |
h-90 | height: 22.5rem; |
h-91 | height: 22.75rem; |
h-92 | height: 23rem; |
h-93 | height: 23.25rem; |
h-94 | height: 23.5rem; |
h-95 | height: 23.75rem; |
h-96 | height: 24rem; |
h-97 | height: 24.25rem; |
h-98 | height: 24.5rem; |
h-99 | height: 24.75rem; |
h-100 | height: 25rem; |
The scale ranges from 0 to 100, with a base value of 0.25rem
.
Class | Property |
---|---|
p-0 | padding: 0rem; |
p-1 | padding: 0.25rem; |
p-2 | padding: 0.5rem; |
p-3 | padding: 0.75rem; |
p-4 | padding: 1rem; |
p-5 | padding: 1.25rem; |
p-6 | padding: 1.5rem; |
p-7 | padding: 1.75rem; |
p-8 | padding: 2rem; |
p-9 | padding: 2.25rem; |
p-10 | padding: 2.5rem; |
p-11 | padding: 2.75rem; |
p-12 | padding: 3rem; |
p-13 | padding: 3.25rem; |
p-14 | padding: 3.5rem; |
p-15 | padding: 3.75rem; |
p-16 | padding: 4rem; |
p-17 | padding: 4.25rem; |
p-18 | padding: 4.5rem; |
p-19 | padding: 4.75rem; |
p-20 | padding: 5rem; |
p-21 | padding: 5.25rem; |
p-22 | padding: 5.5rem; |
p-23 | padding: 5.75rem; |
p-24 | padding: 6rem; |
p-25 | padding: 6.25rem; |
p-26 | padding: 6.5rem; |
p-27 | padding: 6.75rem; |
p-28 | padding: 7rem; |
p-29 | padding: 7.25rem; |
p-30 | padding: 7.5rem; |
p-31 | padding: 7.75rem; |
p-32 | padding: 8rem; |
p-33 | padding: 8.25rem; |
p-34 | padding: 8.5rem; |
p-35 | padding: 8.75rem; |
p-36 | padding: 9rem; |
p-37 | padding: 9.25rem; |
p-38 | padding: 9.5rem; |
p-39 | padding: 9.75rem; |
p-40 | padding: 10rem; |
p-41 | padding: 10.25rem; |
p-42 | padding: 10.5rem; |
p-43 | padding: 10.75rem; |
p-44 | padding: 11rem; |
p-45 | padding: 11.25rem; |
p-46 | padding: 11.5rem; |
p-47 | padding: 11.75rem; |
p-48 | padding: 12rem; |
p-49 | padding: 12.25rem; |
p-50 | padding: 12.5rem; |
p-51 | padding: 12.75rem; |
p-52 | padding: 13rem; |
p-53 | padding: 13.25rem; |
p-54 | padding: 13.5rem; |
p-55 | padding: 13.75rem; |
p-56 | padding: 14rem; |
p-57 | padding: 14.25rem; |
p-58 | padding: 14.5rem; |
p-59 | padding: 14.75rem; |
p-60 | padding: 15rem; |
p-61 | padding: 15.25rem; |
p-62 | padding: 15.5rem; |
p-63 | padding: 15.75rem; |
p-64 | padding: 16rem; |
p-65 | padding: 16.25rem; |
p-66 | padding: 16.5rem; |
p-67 | padding: 16.75rem; |
p-68 | padding: 17rem; |
p-69 | padding: 17.25rem; |
p-70 | padding: 17.5rem; |
p-71 | padding: 17.75rem; |
p-72 | padding: 18rem; |
p-73 | padding: 18.25rem; |
p-74 | padding: 18.5rem; |
p-75 | padding: 18.75rem; |
p-76 | padding: 19rem; |
p-77 | padding: 19.25rem; |
p-78 | padding: 19.5rem; |
p-79 | padding: 19.75rem; |
p-80 | padding: 20rem; |
p-81 | padding: 20.25rem; |
p-82 | padding: 20.5rem; |
p-83 | padding: 20.75rem; |
p-84 | padding: 21rem; |
p-85 | padding: 21.25rem; |
p-86 | padding: 21.5rem; |
p-87 | padding: 21.75rem; |
p-88 | padding: 22rem; |
p-89 | padding: 22.25rem; |
p-90 | padding: 22.5rem; |
p-91 | padding: 22.75rem; |
p-92 | padding: 23rem; |
p-93 | padding: 23.25rem; |
p-94 | padding: 23.5rem; |
p-95 | padding: 23.75rem; |
p-96 | padding: 24rem; |
p-97 | padding: 24.25rem; |
p-98 | padding: 24.5rem; |
p-99 | padding: 24.75rem; |
p-100 | padding: 25rem; |
The scale ranges from 0 to 100, with a base value of 0.25rem
.
Class | Property |
---|---|
m-0 | margin: 0rem; |
m-1 | margin: 0.25rem; |
m-2 | margin: 0.5rem; |
m-3 | margin: 0.75rem; |
m-4 | margin: 1rem; |
m-5 | margin: 1.25rem; |
m-6 | margin: 1.5rem; |
m-7 | margin: 1.75rem; |
m-8 | margin: 2rem; |
m-9 | margin: 2.25rem; |
m-10 | margin: 2.5rem; |
m-11 | margin: 2.75rem; |
m-12 | margin: 3rem; |
m-13 | margin: 3.25rem; |
m-14 | margin: 3.5rem; |
m-15 | margin: 3.75rem; |
m-16 | margin: 4rem; |
m-17 | margin: 4.25rem; |
m-18 | margin: 4.5rem; |
m-19 | margin: 4.75rem; |
m-20 | margin: 5rem; |
m-21 | margin: 5.25rem; |
m-22 | margin: 5.5rem; |
m-23 | margin: 5.75rem; |
m-24 | margin: 6rem; |
m-25 | margin: 6.25rem; |
m-26 | margin: 6.5rem; |
m-27 | margin: 6.75rem; |
m-28 | margin: 7rem; |
m-29 | margin: 7.25rem; |
m-30 | margin: 7.5rem; |
m-31 | margin: 7.75rem; |
m-32 | margin: 8rem; |
m-33 | margin: 8.25rem; |
m-34 | margin: 8.5rem; |
m-35 | margin: 8.75rem; |
m-36 | margin: 9rem; |
m-37 | margin: 9.25rem; |
m-38 | margin: 9.5rem; |
m-39 | margin: 9.75rem; |
m-40 | margin: 10rem; |
m-41 | margin: 10.25rem; |
m-42 | margin: 10.5rem; |
m-43 | margin: 10.75rem; |
m-44 | margin: 11rem; |
m-45 | margin: 11.25rem; |
m-46 | margin: 11.5rem; |
m-47 | margin: 11.75rem; |
m-48 | margin: 12rem; |
m-49 | margin: 12.25rem; |
m-50 | margin: 12.5rem; |
m-51 | margin: 12.75rem; |
m-52 | margin: 13rem; |
m-53 | margin: 13.25rem; |
m-54 | margin: 13.5rem; |
m-55 | margin: 13.75rem; |
m-56 | margin: 14rem; |
m-57 | margin: 14.25rem; |
m-58 | margin: 14.5rem; |
m-59 | margin: 14.75rem; |
m-60 | margin: 15rem; |
m-61 | margin: 15.25rem; |
m-62 | margin: 15.5rem; |
m-63 | margin: 15.75rem; |
m-64 | margin: 16rem; |
m-65 | margin: 16.25rem; |
m-66 | margin: 16.5rem; |
m-67 | margin: 16.75rem; |
m-68 | margin: 17rem; |
m-69 | margin: 17.25rem; |
m-70 | margin: 17.5rem; |
m-71 | margin: 17.75rem; |
m-72 | margin: 18rem; |
m-73 | margin: 18.25rem; |
m-74 | margin: 18.5rem; |
m-75 | margin: 18.75rem; |
m-76 | margin: 19rem; |
m-77 | margin: 19.25rem; |
m-78 | margin: 19.5rem; |
m-79 | margin: 19.75rem; |
m-80 | margin: 20rem; |
m-81 | margin: 20.25rem; |
m-82 | margin: 20.5rem; |
m-83 | margin: 20.75rem; |
m-84 | margin: 21rem; |
m-85 | margin: 21.25rem; |
m-86 | margin: 21.5rem; |
m-87 | margin: 21.75rem; |
m-88 | margin: 22rem; |
m-89 | margin: 22.25rem; |
m-90 | margin: 22.5rem; |
m-91 | margin: 22.75rem; |
m-92 | margin: 23rem; |
m-93 | margin: 23.25rem; |
m-94 | margin: 23.5rem; |
m-95 | margin: 23.75rem; |
m-96 | margin: 24rem; |
m-97 | margin: 24.25rem; |
m-98 | margin: 24.5rem; |
m-99 | margin: 24.75rem; |
m-100 | margin: 25rem; |
The scale ranges from 0 to 100, with a base value of 0.25rem
.
Class | Property |
---|---|
w-0 | width: 0rem; |
w-1 | width: 0.25rem; |
w-2 | width: 0.5rem; |
w-3 | width: 0.75rem; |
w-4 | width: 1rem; |
w-5 | width: 1.25rem; |
w-6 | width: 1.5rem; |
w-7 | width: 1.75rem; |
w-8 | width: 2rem; |
w-9 | width: 2.25rem; |
w-10 | width: 2.5rem; |
w-11 | width: 2.75rem; |
w-12 | width: 3rem; |
w-13 | width: 3.25rem; |
w-14 | width: 3.5rem; |
w-15 | width: 3.75rem; |
w-16 | width: 4rem; |
w-17 | width: 4.25rem; |
w-18 | width: 4.5rem; |
w-19 | width: 4.75rem; |
w-20 | width: 5rem; |
w-21 | width: 5.25rem; |
w-22 | width: 5.5rem; |
w-23 | width: 5.75rem; |
w-24 | width: 6rem; |
w-25 | width: 6.25rem; |
w-26 | width: 6.5rem; |
w-27 | width: 6.75rem; |
w-28 | width: 7rem; |
w-29 | width: 7.25rem; |
w-30 | width: 7.5rem; |
w-31 | width: 7.75rem; |
w-32 | width: 8rem; |
w-33 | width: 8.25rem; |
w-34 | width: 8.5rem; |
w-35 | width: 8.75rem; |
w-36 | width: 9rem; |
w-37 | width: 9.25rem; |
w-38 | width: 9.5rem; |
w-39 | width: 9.75rem; |
w-40 | width: 10rem; |
w-41 | width: 10.25rem; |
w-42 | width: 10.5rem; |
w-43 | width: 10.75rem; |
w-44 | width: 11rem; |
w-45 | width: 11.25rem; |
w-46 | width: 11.5rem; |
w-47 | width: 11.75rem; |
w-48 | width: 12rem; |
w-49 | width: 12.25rem; |
w-50 | width: 12.5rem; |
w-51 | width: 12.75rem; |
w-52 | width: 13rem; |
w-53 | width: 13.25rem; |
w-54 | width: 13.5rem; |
w-55 | width: 13.75rem; |
w-56 | width: 14rem; |
w-57 | width: 14.25rem; |
w-58 | width: 14.5rem; |
w-59 | width: 14.75rem; |
w-60 | width: 15rem; |
w-61 | width: 15.25rem; |
w-62 | width: 15.5rem; |
w-63 | width: 15.75rem; |
w-64 | width: 16rem; |
w-65 | width: 16.25rem; |
w-66 | width: 16.5rem; |
w-67 | width: 16.75rem; |
w-68 | width: 17rem; |
w-69 | width: 17.25rem; |
w-70 | width: 17.5rem; |
w-71 | width: 17.75rem; |
w-72 | width: 18rem; |
w-73 | width: 18.25rem; |
w-74 | width: 18.5rem; |
w-75 | width: 18.75rem; |
w-76 | width: 19rem; |
w-77 | width: 19.25rem; |
w-78 | width: 19.5rem; |
w-79 | width: 19.75rem; |
w-80 | width: 20rem; |
w-81 | width: 20.25rem; |
w-82 | width: 20.5rem; |
w-83 | width: 20.75rem; |
w-84 | width: 21rem; |
w-85 | width: 21.25rem; |
w-86 | width: 21.5rem; |
w-87 | width: 21.75rem; |
w-88 | width: 22rem; |
w-89 | width: 22.25rem; |
w-90 | width: 22.5rem; |
w-91 | width: 22.75rem; |
w-92 | width: 23rem; |
w-93 | width: 23.25rem; |
w-94 | width: 23.5rem; |
w-95 | width: 23.75rem; |
w-96 | width: 24rem; |
w-97 | width: 24.25rem; |
w-98 | width: 24.5rem; |
w-99 | width: 24.75rem; |
w-100 | width: 25rem; |
Upgrade
You can upgrade your projects by getting the latest version of yummacss
from npm:
Community
Join the Yumma CSS community! Share your experiences and help Yumma CSS grow and be the best it can be.