skills.rest
findinfinitelabs
findinfinitelabsCOMMUNITY
Explore all skills by this author →
Website𝕏@ea_innovationGitHub

css-styling-standards

Configures Mantine v8 theme and provider for multilingual, mobile-first CSS.

Updated Dec 3, 2025
Search Tags:#accessibility#frontend#css#styling#responsive#multilingual#mantine
One-click install
npx skills add https://github.com/findinfinitelabs/chuuk --skill css-styling-standards
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: css-styling-standards
Source: https://github.com/findinfinitelabs/chuuk/tree/main/.claude/skills/css-styling-standards
Command: npx skills add https://github.com/findinfinitelabs/chuuk --skill css-styling-standards

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The CSS styling standards and best practices establish scalable, accessible, and multilingual-friendly frontend CSS systems for modern web interfaces.

Core Features & Use Cases

  • Mobile-first, accessible CSS: Guidelines to ensure WCAG 2.1 AA compliance, multilingual typography, and consistent naming.
  • Mantine Integration examples: Theme configuration and provider setup for React apps using Mantine v8.
  • Use Case: A frontend engineer updates a Chuukese content page to meet accessibility and performance criteria, ensuring fonts render correctly and layout remains responsive.

Quick Start

Install Mantine in your React project, configure a theme.ts with a Chuukese-friendly font stack, wrap your app with MantineProvider, and apply the Chuukese text CSS class to content to ensure proper rendering.

Frequently Asked Questions about css-styling-standards

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up accessible CSS standards for multilingual frontend interfaces?▼

To establish accessible CSS standards for multilingual frontend interfaces, apply mobile-first guidelines ensuring WCAG 2.1 AA compliance, consistent naming, and multilingual typography for responsive, internationalized React applications.

How do I configure Mantine theme and provider for Chuukese text rendering in React?▼

Configuring Mantine for Chuukese text rendering involves installing Mantine v8, setting up a theme.ts with a Chuukese-friendly font stack, wrapping your app with MantineProvider, and applying the Chuukese text CSS class to content.

What is the best way to ensure responsive layout and WCAG 2.1 AA compliance for Chuukese content pages?▼

The best way to ensure responsive layout and WCAG 2.1 AA compliance for Chuukese content pages is applying mobile-first CSS guidelines with multilingual typography to maintain correct font rendering and layout across devices.

Does this CSS styling approach require Mantine integration for React apps?▼

Yes, this CSS styling approach applies to frontend engineering workflows in React apps with Mantine integration, utilizing theme configuration and provider setup to establish a maintainable CSS architecture for accessible UI.

Why does my Chuukese text not render correctly in my React frontend?▼

Chuukese text may not render correctly if your theme.ts lacks a Chuukese-friendly font stack or the Chuukese text CSS class is not applied to content within the MantineProvider wrapper in your React application.

Related Skills

Explore More Software Engineering Skills→
lightdashlightdash
6.0k

frontend-style-guide

Enforce Mantine v8 imports and theme tokens in Lightdash TSX components.

Official
Basic
JCETools-PetraJCETools-Petra
16

frontend

Builds accessible, responsive frontend interfaces with component architecture and quality gates.

Community
Intermediate
louisbrulenaudetlouisbrulenaudet
18

review-ui

Audit React frontend applications for WCAG 2.2 AA compliance and Tailwind CSS theme consistency.

Community
Intermediate
AhChaoAhChao
1

frontend-style-guide

Enforce Mantine v8 styling and CSS modules in React TSX components.

Community
Basic