Spartans get ready! v1 is coming!
We are very close to our first stable release. Expect more announcements in the coming weeks. v1 was made possible by our partner Zerops.
Aspect Ratio
Displays content within a desired ratio.
import { Component } from '@angular/core';
import { HlmAspectRatioImports } from '@spartan-ng/helm/aspect-ratio';
@Component({
selector: 'spartan-aspect-ratio-preview',
imports: [HlmAspectRatioImports],
template: `
<div class="max-w-xl overflow-hidden rounded-xl drop-shadow">
<div [hlmAspectRatio]="16 / 9">
<img alt="Mountain views" src="/assets/mountains.jpg" />
</div>
</div>
`,
})
export class AspectRatioPreview {}Installation
npx nx g @spartan-ng/cli:ui aspectratio
ng g @spartan-ng/cli:ui aspectratio
Usage
import { HlmAspectRatioImports } from '@spartan-ng/helm/aspect-ratio';<div class="max-w-xl overflow-hidden rounded-xl drop-shadow">
<div [hlmAspectRatio]="ratio">
<img alt="Mountain views" src="/mountains.jpg" />
</div>
</div>Helm API
HlmAspectRatio
Selector: [hlmAspectRatio]