Cres JS - Css

Introduction

Secara basic, cresenity mempunyai default css yaitu cres.css


Helper - Typography


Font Family
Class Properties
font-sans font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-serif font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
font-mono font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
White Space
Class Properties
whitespace-normal white-space: normal;
whitespace-nowrap white-space: nowrap;
whitespace-pre white-space: pre;
whitespace-pre-line white-space: pre-line;
whitespace-pre-wrap white-space: pre-wrap;

Helper - Transform


Scale
Class Properties
scale-0 transform: scale(0);
scale-x-0 transform: scaleX(0);
scale-y-0 transform: scaleY(0);
scale-50 transform: scale(.5);
scale-x-50 transform: scaleX(.5);
scale-y-50 transform: scaleY(.5);
scale-75 transform: scale(.75);
scale-x-75 transform: scaleX(.75);
Rotate
Class Properties
rotate-0 transform: rotate(0deg);
rotate-1 transform: rotate(1deg);
rotate-2 transform: rotate(2deg);
rotate-3 transform: rotate(3deg);
rotate-6 transform: rotate(6deg);
rotate-12 transform: rotate(12deg);
rotate-45 transform: rotate(45deg);
rotate-90 transform: rotate(90deg);
rotate-180 transform: rotate(180deg);
Translate
Class Properties
translate-x-0 transform: translateX(0px);
translate-y-0 transform: translateY(0px);
translate-x-px transform: translateX(1px);
translate-y-px transform: translateY(1px);
translate-x-0.5 transform: translateX(0.125rem);
translate-y-0.5 transform: translateY(0.125rem);
translate-x-1 transform: translateX(0.25rem);
translate-y-1 transform: translateY(0.25rem);
translate-x-1.5 transform: translateX(0.375rem);
translate-y-1.5 transform: translateY(0.375rem);
translate-x-2 transform: translateX(0.5rem);
translate-y-2 transform: translateY(0.5rem);
translate-x-2.5 transform: translateX(0.625rem);
translate-y-2.5 transform: translateY(0.625rem);
translate-x-3 transform: translateX(0.75rem);
translate-y-3 transform: translateY(0.75rem);
translate-x-3.5 transform: translateX(0.875rem);
translate-y-3.5 transform: translateY(0.875rem);
translate-x-4 transform: translateX(1rem);
translate-y-4 transform: translateY(1rem);
translate-x-5 transform: translateX(1.25rem);
translate-y-5 transform: translateY(1.25rem);
translate-x-6 transform: translateX(1.5rem);
translate-y-6 transform: translateY(1.5rem);
translate-x-7 transform: translateX(1.75rem);
translate-y-7 transform: translateY(1.75rem);
translate-x-8 transform: translateX(2rem);
translate-y-8 transform: translateY(2rem);
translate-x-9 transform: translateX(2.25rem);
translate-y-9 transform: translateY(2.25rem);
translate-x-10 transform: translateX(2.5rem);
translate-y-10 transform: translateY(2.5rem);
translate-x-11 transform: translateX(2.75rem);
translate-y-11 transform: translateY(2.75rem);
translate-x-12 transform: translateX(3rem);
translate-y-12 transform: translateY(3rem);
translate-x-14 transform: translateX(3.5rem);
translate-y-14 transform: translateY(3.5rem);
translate-x-16 transform: translateX(4rem);
translate-y-16 transform: translateY(4rem);
translate-x-20 transform: translateX(5rem);
translate-y-20 transform: translateY(5rem);
translate-x-24 transform: translateX(6rem);
translate-y-24 transform: translateY(6rem);
translate-x-28 transform: translateX(7rem);
translate-y-28 transform: translateY(7rem);
translate-x-32 transform: translateX(8rem);
translate-y-32 transform: translateY(8rem);
translate-x-36 transform: translateX(9rem);
translate-y-36 transform: translateY(9rem);
translate-x-40 transform: translateX(10rem);
translate-y-40 transform: translateY(10rem);
translate-x-44 transform: translateX(11rem);
translate-y-44 transform: translateY(11rem);
translate-x-48 transform: translateX(12rem);
translate-y-48 transform: translateY(12rem);
translate-x-52 transform: translateX(13rem);
translate-y-52 transform: translateY(13rem);
translate-x-56 transform: translateX(14rem);
translate-y-56 transform: translateY(14rem);
translate-x-60 transform: translateX(15rem);
translate-y-60 transform: translateY(15rem);
translate-x-64 transform: translateX(16rem);
translate-y-64 transform: translateY(16rem);
translate-x-72 transform: translateX(18rem);
translate-y-72 transform: translateY(18rem);
translate-x-80 transform: translateX(20rem);
translate-y-80 transform: translateY(20rem);
translate-x-96 transform: translateX(24rem);
translate-y-96 transform: translateY(24rem);
translate-x-1/2 transform: translateX(50%);
translate-x-1/3 transform: translateX(33.333333%);
translate-x-2/3 transform: translateX(66.666667%);
translate-x-1/4 transform: translateX(25%);
translate-x-2/4 transform: translateX(50%);
translate-x-3/4 transform: translateX(75%);
translate-x-full transform: translateX(100%);
translate-y-1/2 transform: translateY(50%);
translate-y-1/3 transform: translateY(33.333333%);
translate-y-2/3 transform: translateY(66.666667%);
translate-y-1/4 transform: translateY(25%);
translate-y-2/4 transform: translateY(50%);
translate-y-3/4 transform: translateY(75%);
translate-y-full transform: translateY(100%);
Skew
Class Properties
skew-x-0 transform: skewX(0deg);
skew-y-0 transform: skewY(0deg);
skew-x-1 transform: skewX(1deg);
skew-y-1 transform: skewY(1deg);
skew-x-2 transform: skewX(2deg);
skew-y-2 transform: skewY(2deg);
skew-x-3 transform: skewX(3deg);
skew-y-3 transform: skewY(3deg);
skew-x-6 transform: skewX(6deg);
skew-y-6 transform: skewY(6deg);
skew-x-12 transform: skewX(12deg);
skew-y-12 transform: skewY(12deg);
Transform Origin
Class Properties
origin-center transform-origin: center;
origin-top transform-origin: top;
origin-top-right transform-origin: top right;
origin-right transform-origin: right;
origin-bottom-right transform-origin: bottom right;
origin-bottom transform-origin: bottom;
origin-bottom-left transform-origin: bottom left;
origin-left transform-origin: left;
origin-top-left transform-origin: top left;