uulgie

Utilities css for padding margin and border radius

Usage no npm install needed!

<script type="module">
  import uulgie from 'https://cdn.skypack.dev/uulgie';
</script>

README

Quick start

<link rel="stylesheet" href="path/css/uulgie.min.css">
<div class="p2">
  css = padding: 2px;
  <h1 class="px6"> css = padding: 6px 0; </h1>
  <h1 class="py6"> css = padding: 6px 0; </h1>
</div>

<div class="m10">
  css = margin: 10px;
  <h1 class="mx4"> css = margin: 4px 0; </h1>
  <h1 class="my4"> css = margin: 0 4px;  </h1>
</div>

<div class="r15">
  css = border-radius: 15px;
</div>

<div class="rc">
  css = border-radius: 50%;
</div>
Margin Padding Border Radius Example
mx5 px6 rc class="mx5 px6" class="rc"
my5 py6 --- class="my5 py5"
--- --- --- ---
m0 p0 r0 class="m0 p0 r0"
m1 p1 r1 class="m1 p1 r1"
m2 p2 r2 class="m2 p2 r2"
m3 p3 r3 class="m3 p3 r3"
m4 p4 r4 class="m4 p4 r4"
m5 p5 r5 class="m5 p5 r5"
m5 p6 r6 class="m6 p6 r6"
m7 p7 r7 class="m7 p7 r7"
m8 p8 r8 class="m8 p8 r8"
m9 p9 r9 class="m9 p9 r9"
m10 p10 r10 class="m10 p10 r10"
m11 p11 r11 class="m11 p11 r11"
m12 p12 r12 class="m12 p12 r12"
m13 p13 r13 class="m13 p13 r13"
m14 p14 r14 class="m14 p14 r14"
m15 p15 r15 class="m15 p15 r15"

Note

Class rc require width = height

Example

<div width="100" height="100" class="rc">
  text
</div>

🇲🇦 Author

License

Copyright © 2018, Mohamed Hamham. Released under the MIT License.