PurgeTSS is a package that helps Titanium developers create visually appealing mobile apps more easily, with features including highly customizable utility classes, icon fonts support, a basic Animation module, a simple grid system, and a shades command for creating custom colors.
License: MIT License
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
Please create the fontawesome.js on custom build
Hello,
I'm continuing with test and I have a problem to applicate custom .tss in tabgroup:
index.xml
<Alloy>
<TabGroup>
<Tab module="tikit.ui" class="active-tint-violet-900 active-title-violet-900" title="Tabs" icon="far fa-bath text-3xl" activeIcon="fas fa-bath text-3xl">
<Require src="elements"/>
</Tab>
<Tab module="tikit.ui" class="active-tint-violet-900 active-title-violet-900" title="Tabs" icon="mio mi-security_update_good text-3xl" activeIcon="mit mi-security_update_good text-3xl">
<Require src="complex"/>
</Tab>
</TabGroup>
</Alloy>elements.xml
<Alloy>
<Window class="container">
<ScrollView class="vertical">
<Alert module="tikit.ui" classes="top" variant="pop" color="primary" title="Primary Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="secondary" title="Secondary Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="success" title="Success Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="danger" title="Danger Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="warning" title="Warning Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="info" title="Info Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="dark" title="Dark Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
<Alert module="tikit.ui" classes="top" variant="pop" color="light" title="Light Alert with custom Icon" text="Lorem ipsum dolor sit..." icon="mi mi-pending_actions text-3xl" />
</ScrollView>
</Window>
</Alloy>elements.tss
".top": {
top: 20
}In this case it seems "top" class doesn't works, but if I put "top" configuration inside "index.tss" it works. If I'm not doing something wrong it seems to me that the behavior is different from normal.
I have styles defined in my file _app.tss for the Window tag, but when I do some build in Purge it generates its own class for the tag and my style doesn't work.
Is there a way to exclude that it generates the style when doing the build?
When trying to use purgetss on my project on Windows 10 for the first time I faced build error ..
After some debugging I found the issue is that is-installed-globally package is not working as expected because it has a wrong npm globall path from global-dirs package
So isInstalledGlobally check is not working and lead to select wrong alloy.jmk path
If you can skip isInstalledGlobally check or make a workaround if it doesn't work that would be great
Node 16.16.0
Ti SDk 11.0.0
Ti CLI 6.1.1
Watch is enabled and purgeTSS is configured on new Alloy project.
If I add for example:
<Avatar module="tikit.ui" classes="bg-yellow-900 text-yellow-50" variant="chip" size="base" name="Mr. John Doe" image="https://randomuser.me/api/portraits/men/86.jpg" />I see avatar light green, to see correct color I need to stop live and rebuild project.
Do you know how to avoid or fix this?
Sebastians-MacBook-Pro:Systemhaus sebastianklaus$ purgetss u
purgetss u
::purgeTSS:: Updating purgeTSS to the latest version...
::purgeTSS:: stderr: npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN @tailwindcss/[email protected] requires a peer of tailwindcss@^1.8.3 but none is installed. You must install peer dependencies yourself.
npm WARN @tailwindcss/[email protected] requires a peer of tailwindcss@^1.0 but none is installed. You must install peer dependencies yourself.
npm WARN @tailwindcss/[email protected] requires a peer of tailwindcss@^1.5.0 but none is installed. You must install peer dependencies yourself.
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.