feat: readme catalog and gallery (#201)

Author: SolMendiola

README.md

@@ -16,9 +16,6 @@ The router has two subgraphs, the `UnauthenticatedRouter` used for unauthenticat
 
 The [app router][app_router] is provided by [auto_route][auto_route], and contains the previous sections with some nested screens.
 
-The [theme folder][theme] contains the theme definitions, for example colors, styles and dimensions. 
-Another important plugin related to the UI is [flutter_screenutil][flutter_screenutil], used for adapting screen and font size.
-
 ### Core section
 
 The models are defined in the [models folder][models]. If you need to use different models for database or networking, you can create them in `db` and `service` folders respectively.
@@ -114,7 +111,6 @@ In order to setup pre-push hook you need to go to the root of the project and ru
 [app_router]: https://github.com/xmartlabs/flutter-template/blob/main/lib/ui/app_router.dart
 [bloc]: https://bloclibrary.dev
 [auto_route]: https://pub.dev/packages/auto_route
-[theme]: https://github.com/xmartlabs/flutter-template/tree/main/lib/ui/theme
 [flutter_screenutil]: https://pub.dev/packages/flutter_screenutil
 [models]: https://github.com/xmartlabs/flutter-template/tree/main/lib/core/model
 [repository_folder]: https://github.com/xmartlabs/flutter-template/tree/main/lib/core/repository

catalog/README.md

@@ -1,39 +1,56 @@
-<!--
-This README describes the package. If you publish this package to pub.dev,
-this README's contents appear on the landing page for your package.
+# Catalog' Flutter template
 
-For information about how to write a good package README, see the guide for
-[writing package pages](https://dart.dev/guides/libraries/writing-package-pages).
-
-For general information about developing packages, see the Dart guide for
-[creating packages](https://dart.dev/guides/libraries/create-library-packages)
-and the Flutter guide for
-[developing packages and plugins](https://flutter.dev/developing-packages).
--->
-
-TODO: Put a short description of the package here that helps potential users
-know whether this package might be useful for them.
+Catalog is a Flutter package that provides a base implementation for UX/UI components based on the [design template of Xmartlabs][figma].
+It aims to simplify and expedite the development process for Flutter projects, ensuring a consistent and visually appealing user interface.
 
 ## Features
 
-TODO: List what your package can do. Maybe include images, gifs, or videos.
+- Ready-to-use main UI components inspired by Xmartlabs design principles.
+- Customizable components to fit your project's specific requirements.
 
 ## Getting started
 
-TODO: List prerequisites and provide or point to information on how to
-start using the package.
+### Installation
 
-## Usage
+Integrate the package in your project, adding the following line to your `pubspec.yaml` file:
 
-TODO: Include short and useful examples for package users. Add longer examples
-to `/example` folder.
-
-```dart
-const like = 'sample';
+```yaml
+dependencies flutter:
+    catalog:
+        path: ../
 ```
 
-## Additional information
+## Arch Overview
+
+The catalog project is organized into a singular folder named 'Theme.' 
+Within the [theme folder][theme], various files contribute to the overall theme definition:
+
+- App Theme:
+This file outlines the app's styles, encompassing elements such as the app bar, dialogs, radio buttons, and other components.
+
+- App Buttons:
+Styles for the default buttons of the app are defined within this file.
+
+- App Color Scheme:
+Default color schemes for the app are established in this file.
+
+- Custom Colors:
+As a Theme Extension, this file incorporates custom colors specific to the app.
+
+- App Dimensions:
+Default dimensions for various elements within the app are specified in this file.
+
+- App Text Styles:
+Default text styles across the app are defined in this file.
+
+- Custom Text Styles:
+As another Theme Extension, this file articulates the custom text styles unique to the app.
+
+This organized structure within the 'Theme' folder ensures a systematic approach to managing and defining the visual aspects of the app.
+
+### Contributing
+We welcome contributions! If you find a bug or have a feature request, please open an [issue].
 
-TODO: Tell users more about the package: where to find more information, how to
-contribute to the package, how to file issues, what response they can expect
-from the package authors, and more.
+[issue]: https://github.com/xmartlabs/flutter-template/issues
+[theme]: https://github.com/xmartlabs/flutter-template/tree/main/lib/ui/theme
+[figma]: https://www.figma.com/file/OWDUY4WaDjyfiOE6Z8mfsC/XL---Tourmaline?node-id=0%3A1&mode=dev

catalog/gallery/README.md

@@ -0,0 +1,20 @@
+# Gallery App
+
+Gallery is a Flutter app designed to showcase and share the design system of our project.
+This app serves as a visual reference for developers and provides a streamlined process for the design team to approve the correct implementation of components.
+
+## Features
+
+- **Design System Showcase:** View and explore the design system components used in the app.
+- **Interactive Examples:** Interact with live examples of components to see them in action.
+- **Easy Sharing:** Share specific components or screens with the design team for review.
+
+
+## Design System Documentation
+For comprehensive documentation on our design system, including guidelines, principles, and usage instructions, please refer to [Design System].
+
+### Contributing
+We welcome contributions! If you find a bug or have a feature request, please open an [issue].
+
+[issue]: https://github.com/xmartlabs/flutter-template/issues
+[Design System]: https://www.figma.com/file/OWDUY4WaDjyfiOE6Z8mfsC/XL---Tourmaline?node-id=0%3A1&mode=dev