first steps in documenting code

 import 'package:flutter/widgets.dart';
 
 extension MDQ on BuildContext {
+  /// The same of [MediaQuery.of(context).size]
   Size get mediaQuerySize => MediaQuery.of(this).size;
 
+  /// The same of [MediaQuery.of(context).size.height]
+  /// Note: updates when you rezise your screen (like on a browser or desktop window)
   double get height => mediaQuerySize.height;
 
+  /// The same of [MediaQuery.of(context).size.width]
+  /// Note: updates when you rezise your screen (like on a browser or desktop window)
   double get width => mediaQuerySize.width;
 
+  /// Gives you the power to get a portion of the height.
+  /// Useful for responsive applications.
+  ///
+  /// [dividedBy] is for when you want to have a portion of the value you would get
+  /// like for example: if you want a value that represents a third of the screen
+  /// you can set it to 3, and you will get a third of the height
+  ///
+  /// [reducedBy] is a percentage value of how much of the height you want
+  /// if you for example want 46% of the height, then you reduce it by 56%.
   double heightTransformer({double dividedBy = 1, double reducedBy = 0.0}) {
     return (mediaQuerySize.height -
             ((mediaQuerySize.height / 100) * reducedBy)) /
         dividedBy;
   }
 
+  /// Gives you the power to get a portion of the width.
+  /// Useful for responsive applications.
+  ///
+  /// [dividedBy] is for when you want to have a portion of the value you would get
+  /// like for example: if you want a value that represents a third of the screen
+  /// you can set it to 3, and you will get a third of the width
+  ///
+  /// [reducedBy] is a percentage value of how much of the width you want
+  /// if you for example want 46% of the width, then you reduce it by 56%.
   double widthTransformer({double dividedBy = 1, double reducedBy = 0.0}) {
     return (mediaQuerySize.width - ((mediaQuerySize.width / 100) * reducedBy)) /
         dividedBy;
   }
 
-  double ratio(
-      {double dividedBy = 1,
+  /// TODO: make docs about that
+  double ratio({
+    double dividedBy = 1,
     double reducedByW = 0.0,
-      double reducedByH = 0.0}) {
+    double reducedByH = 0.0,
+  }) {
     return heightTransformer(dividedBy: dividedBy, reducedBy: reducedByH) /
         widthTransformer(dividedBy: dividedBy, reducedBy: reducedByW);
   }
 
-  /// similar to MediaQuery.of(this).padding
+  /// similar to [MediaQuery.of(context).padding]
   EdgeInsets get mediaQueryPadding => MediaQuery.of(this).padding;
 
-  /// similar to MediaQuery.of(this).viewPadding
+  /// similar to [MediaQuery.of(context).viewPadding]
   EdgeInsets get mediaQueryViewPadding => MediaQuery.of(this).viewPadding;
 
-  /// similar to MediaQuery.of(this).viewInsets;
+  /// similar to [MediaQuery.of(context).viewInsets]
   EdgeInsets get mediaQueryViewInsets => MediaQuery.of(this).viewInsets;
 
-  /// similar to MediaQuery.of(this).orientation;
+  /// similar to [MediaQuery.of(context).orientation]
   Orientation get orientation => MediaQuery.of(this).orientation;
 
   /// check if device is on landscape mode
@@ -44,10 +69,10 @@ extension MDQ on BuildContext {
   /// check if device is on portrait mode
   bool get isPortrait => orientation == Orientation.portrait;
 
-  /// similar to MediaQuery.of(this).devicePixelRatio;
+  /// similar to [MediaQuery.of(this).devicePixelRatio]
   double get devicePixelRatio => MediaQuery.of(this).devicePixelRatio;
 
-  /// similar to MediaQuery.of(this).textScaleFactor;
+  /// similar to [MediaQuery.of(this).textScaleFactor]
   double get textScaleFactor => MediaQuery.of(this).textScaleFactor;
 
   /// get the shortestSide from screen