CmydStyles
This library was generated with Angular CLI version 12.2.0.
Overview
CmydStyles
Docs
Scss
- @import 'cmyd-styles/styles-scss/margin.scss' //imports margin files to the system;
- @import 'cmyd-styles/styles-scss/padding.scss' //imports padding files to the system;
- @import 'cmyd-styles/styles-scss/width.scss' //imports width files to the system;
css
- @import 'cmyd-styles/styles-css/margin.css' //imports margin files to the system;
- @import 'cmyd-styles/styles-css/padding.css' //imports padding files to the system;
- @import 'cmyd-styles/styles-css/width.css' //imports width files to the system;
CmydStyles
This pacakge provides classes for
-
margin = m-1
-
margin-left = ml-1
-
margin-right = mr-1
-
margin=bottom = mb-1
-
margin-top = mt-1
-
margin(%) = mp-1
-
margin(%)-left = mlp-1
-
margin(%)-right = mrp-1
-
margin(%)=bottom = mbp-1
-
margin(%)-top = mtp-1
-
padding = p-1
-
padding-left = pl-1
-
padding-right = pr-1
-
padding-bottom = pb-1
-
padding-top = pt-1
-
width in pixel= w-1
-
width in percentage = wp-1
Range of pixels are as 1 - 100, You can use ml-50 which will translate to margin-left: 50px; Incase of width the range of pixel it 0-999px and 0-100%
Exampels
<!-- margin: 45%; -->
<button class="mp-45">Button</button>
<!-- margin-left: 35%; -->
<button class="mlp-35">Button</button>
<!-- margin-left: 20px; -->
<button class="ml-20">Button</button>
<!-- margin-right: 35px; -->
<button class="mr-35">Button</button>
<!-- margin: 20px; -->
<button class="m-20">Button</button>
<!-- padding: 20px; -->
<button class="p-20">Button</button>
<!-- padidng-bottom: 20px; -->
<button class="pb-10">Button</button>
<!-- width: 20px; -->
<button class="w-10">Button</button>
<!-- width: 50%; -->
<button class="wp-50">Button</button>
Version
0.0.8
Fixedpadding-right
not working
0.0.7
Fixed margin with pixels not working
0.0.6
Added margins in percentage. better project sturcture
0.0.5
Fixedmargin-right
values not working
0.0.4
Breaking Changes
cmyd-mb.scss or cmyd-mb.css does not exist, instead a spearte file for margin.scss, padding.scss and width.scss is now available
0.0.3
Readme file formatting
0.0.2
Readme file added
0.0.1
Initial commit
That's it,
Further help
If you found a bug or know a better way of doing it please do reach me out at hamza13sw185@gmail.com
.