Add logical properties support for float and clear (#12480)

Author: datlechin

src/corePlugins.js

@@ -684,6 +684,8 @@ export let corePlugins = {
 
   float: ({ addUtilities }) => {
     addUtilities({
+      '.float-start': { float: 'inline-start' },
+      '.float-end': { float: 'inline-end' },
       '.float-right': { float: 'right' },
       '.float-left': { float: 'left' },
       '.float-none': { float: 'none' },
@@ -692,6 +694,8 @@ export let corePlugins = {
 
   clear: ({ addUtilities }) => {
     addUtilities({
+      '.clear-start': { clear: 'inline-start' },
+      '.clear-end': { clear: 'inline-end' },
       '.clear-left': { clear: 'left' },
       '.clear-right': { clear: 'right' },
       '.clear-both': { clear: 'both' },

tests/plugins/__snapshots__/clear.test.js.snap

@@ -2,6 +2,14 @@
 
 exports[`should test the 'clear' plugin 1`] = `
 "
+.clear-start {
+  clear: inline-start;
+}
+
+.clear-end {
+  clear: inline-end;
+}
+
 .clear-left {
   clear: left;
 }

tests/plugins/__snapshots__/float.test.js.snap

@@ -2,6 +2,14 @@
 
 exports[`should test the 'float' plugin 1`] = `
 "
+.float-start {
+  float: inline-start;
+}
+
+.float-end {
+  float: inline-end;
+}
+
 .float-right {
   float: right;
 }