classname move to extend object

presets.js

@@ -226,6 +226,15 @@ module.exports = {
             'spacing': 'margin, padding',
             'visible': 'visible, opacity',
             'backgroundSize': 'background-size'
+          },
+
+          backgroundSize: {
+            '0-2': '0 2px',
+            'full-2': '100% 2px'
+          },
+  
+          backgroundPosition: {
+            '0-full': ' 0 100%'
           }
         },
 
@@ -233,15 +242,6 @@ module.exports = {
         container: {
             center: true,
         },
-
-        backgroundSize: {
-          '0-2': '0 2px',
-          'full-2': '100% 2px'
-        },
-
-        backgroundPosition: {
-          '0-full': ' 0 100%'
-        }
     },
 
     variants: {

public/css/app.css

@@ -28906,6 +28906,15 @@ input[type="date"]::-webkit-inner-spin-button,
   -webkit-box-decoration-break: clone;
           box-decoration-break: clone;
 }
+.bg-auto{
+  background-size: auto;
+}
+.bg-cover{
+  background-size: cover;
+}
+.bg-contain{
+  background-size: contain;
+}
 .bg-0-2{
   background-size: 0 2px;
 }
@@ -28934,6 +28943,33 @@ input[type="date"]::-webkit-inner-spin-button,
   -webkit-background-clip: text;
           background-clip: text;
 }
+.bg-bottom{
+  background-position: bottom;
+}
+.bg-center{
+  background-position: center;
+}
+.bg-left{
+  background-position: left;
+}
+.bg-left-bottom{
+  background-position: left bottom;
+}
+.bg-left-top{
+  background-position: left top;
+}
+.bg-right{
+  background-position: right;
+}
+.bg-right-bottom{
+  background-position: right bottom;
+}
+.bg-right-top{
+  background-position: right top;
+}
+.bg-top{
+  background-position: top;
+}
 .bg-0-full{
   background-position:  0 100%;
 }