INTRODUCTION
IntroductionCore ConceptsGETTING STARTED
InstallationQuick startWhirl Compiler SettingsCORE CONCEPTS
Using Utility ClassesStyle FunctionsPseudo-Classes and statesResponsive DesignResponsive Base ElementThemeArbitrary ValuesLAYOUT
aspect-ratiodisplayoverflowpositionvisibilityobject-fittop / right / bottom / leftFLEXBOX
flex-basisflex-directionflex-wrapflexflex-growflex-shrinkgapjustify-contentalign-contentalign-itemsalign-selfSPACING
paddingmarginSIZING
widthmin-widthmax-widthheightmin-heightmax-heightTYPOGRAPHY
font-sizefont-styleauto-sizetext-outlineletter-spacingtext-aligncolorword-spacingparagraph-spacingtext-overflowoverflow-positionwhite-spaceBACKGROUND
background-colorbackground-imagebackground-positionbackground-repeatbackground-sizeBORDER
border-radiusborder-widthborder-colorEFFECTS
text-shadowopacityFILTER
Filterblurbrightnesscontrastgrayscalehue-rotateinvertsaturatesepiaTRANSITION
transition-propertytransition-durationtransition-timing-functiondelayTRANSFORM
rotatescaletransform-origintranslateQuick Start
Some features are not available by default in the Unity USS, e.g gap, media queries, nth-query, etc., so there are workarounds that would be discussed in the Core concept section.
Setup
- Whirl Compiler Settings: Create a Compiler Settings by right-clicking on the Assets folder/any folder in the Assets, and click on Create > Kostom > Style > CompilerSettings.
Add a base path or paths that the script should look into when generating utility classes e.g,. if the Assets folder is added as a path then it would look into all folders and subfolders for c# and uxml file to compile. Create a uss file and attach it to the StyleSheet section.
Note that multiple Compiler Settings can be created for different purposes e.g., editor settings, runtime settings or even a scene specific settings. - Default theme: If you download the asset from the Unity Asset Store, the default theme is already added to the build. However, if you compile from GitHub or the default theme is not present in the Asset store build for some reason, then you can create one by navigating to Tools > WhirlUSS > Default theme.