Add more advanced examples

shreyasminocha · May 10, 2020 · 8c54a9d · 8c54a9d
1 parent d6e0195
commit 8c54a9d
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 17 deletions.
diff --git a/chapters/advanced-examples.mdx b/chapters/advanced-examples.mdx
@@ -21,22 +21,6 @@ title: Advanced Examples
     <li>32:32</li>
 </Example>
 
-### IP Addresses
-
-<Example
-    regex={
-        /\b(?:(?:2(?:[0-4][0-9]|5[0-5])|[0-1]?[0-9]?[0-9])\.){3}(?:(?:2([0-4][0-9]|5[0-5])|[0-1]?[0-9]?[0-9]))\b/g
-    }
->
-    <li>9.9.9.9</li>
-    <li>127.0.0.1:8080</li>
-    <li>It's 192.168.1.9</li>
-    <li>255.193.09.243</li>
-    <li>123.123.123.123</li>
-    <li>123.123.123.256</li>
-    <li>0.0.x.0</li>
-</Example>
-
 ## Meta
 
 <Example regex={/<Example source="(.*?)" flags="(.*?)">/gm}>
@@ -49,6 +33,8 @@ title: Advanced Examples
 
 **Replace**: `<Example regex={/$1/$2}>`
 
+I performed this operation in commit [`d7a684f`](https://github.com/shreyasminocha/regex-for-regular-folk/commit/4591c59cc347481a48fa5cc34c09f4f75c491d77).
+
 ## Floating point numbers
 
 -   optional sign
@@ -75,6 +61,59 @@ title: Advanced Examples
 
 The positive lookahead `(?=\.\d|\d)` ensures that the regex does not match `.`.
 
+## Latitude and Longitude
+
+<Example regex={/^((-?|\+?)?\d+(\.\d+)?),\s*((-?|\+?)?\d+(\.\d+)?)$/g}>
+    <li>30.0260736, -89.9766792</li>
+    <li>45, 180</li>
+    <li>-90.000, -180.0</li>
+    <li>48.858093,2.294694</li>
+    <li>-3.14, 3.14</li>
+    <li>045, 180.0</li>
+    <li>{"0,    0"}</li>
+    <li>-90., -180.</li>
+    <li>.004, .15</li>
+</Example>
+
+See also: [Floating Point Numbers](#floating-point-numbers)
+
+## MAC Addresses
+
+<Example regex={/^[a-f0-9]{2}(:[a-f0-9]{2}){5}$/i}>
+    <li>01:02:03:04:ab:cd</li>
+    <li>9E:39:23:85:D8:C2</li>
+    <li>00:00:00:00:00:00</li>
+    <li>1N:VA:L1:DA:DD:R5</li>
+    <li>9:3:23:85:D8:C2</li>
+    <li>ac::23:85:D8:C2</li>
+</Example>
+
+## UUID
+
+<Example regex={/[\da-f]{8}-([\da-f]{4}-){3}[\da-f]{12}/i}>
+    <li>123e4567-e89b-12d3-a456-426655440000</li>
+    <li>c73bcdcc-2669-4bf6-81d3-e4ae73fb11fd</li>
+    <li>C73BCDCC-2669-4Bf6-81d3-E4AE73FB11FD</li>
+    <li>c73bcdcc-2669-4bf6-81d3-e4an73fb11fd</li>
+    <li>c73bcdcc26694bf681d3e4ae73fb11fd</li>
+</Example>
+
+## IP Addresses
+
+<Example
+    regex={
+        /\b(?:(?:2(?:[0-4][0-9]|5[0-5])|[0-1]?[0-9]?[0-9])\.){3}(?:(?:2([0-4][0-9]|5[0-5])|[0-1]?[0-9]?[0-9]))\b/g
+    }
+>
+    <li>9.9.9.9</li>
+    <li>127.0.0.1:8080</li>
+    <li>It's 192.168.1.9</li>
+    <li>255.193.09.243</li>
+    <li>123.123.123.123</li>
+    <li>123.123.123.256</li>
+    <li>0.0.x.0</li>
+</Example>
+
 ## HSL colours
 
 ### Integers from `0` to `360`

diff --git a/src/components/example/index.css b/src/components/example/index.css
@@ -57,6 +57,7 @@
 .example ul li ol li {
     font-size: large;
     letter-spacing: normal;
+    white-space: pre-wrap;
 }
 
 .example .indicator {
@@ -108,6 +109,5 @@
     color: transparent;
     position: absolute;
     left: 0;
-    white-space: pre;
     user-select: none;
 }