Skip to content

Latest commit

 

History

History
72 lines (65 loc) · 2.44 KB

README.md

File metadata and controls

72 lines (65 loc) · 2.44 KB

Rapid UI

Rapid banner

Flutter rapid ui is a library that allows you to build responsive widgets quickly like tailwindcss.

Rapid allows flutter developers to create responsive sharable widgets in record time with utility first tailwind like classes.

Check out the documentations

import 'package:flutter/material.dart';
import 'package:rapid/rapid.dart';

class DemoCard extends StatelessWidget {
  const DemoCard({super.key});

  @override
  Widget build(BuildContext context) {
    return const Center(
      child: RapidContainer(
        styles:
            "px-4 py-4 mx-8 my-8 bg-grey-900 rounded-lg shadow-sm laptop:px-0 laptop:py-0",
        child: RapidFlow(
          styles: "column items-center axis-min laptop:row desktop:row",
          children: [
            RapidContainer(
              styles:
                  "w-16 h-16 laptop:w-32 laptop:h-40 rounded-full desktop:rect bg-grey-800 laptop:rounded-md",
              child: SizedBox(),
            ),
            SizedBox(
              height: 16,
            ),
            RapidContainer(
                styles: "laptop:px-8",
                child: RapidFlow(
                  styles:
                      "column items-center axis-min laptop:items-start desktop:items-start",
                  children: [
                    RapidContainer(
                      styles: "laptop:w-96",
                      child: RapidText(
                        text:
                            "Rapid allows flutter developers to create responsive sharable widgets in record time with utility first tailwind like classes",
                        styles:
                            "text-center text-white text-md laptop:text-left laptop:leading-relaxed",
                      ),
                    ),
                    RapidContainer(
                      styles: "pt-4",
                      child: RapidText(
                        text: "Adib Mohsin",
                        styles: "text-blue",
                      ),
                    ),
                    RapidContainer(
                      styles: "pt-1",
                      child: RapidText(
                        text: "layopay",
                        styles: "text-grey-500 uppercase text-xs",
                      ),
                    )
                  ],
                )),
          ],
        ),
      ),
    );
  }
}