syntec3-0-ui-components-test 1.0.0

package/src/scss/base/commom.scss

@@ -0,0 +1,1068 @@
+.commom-padding{
+  padding: 20px;
+}
+.ma-0 {
+  margin: 0px !important;
+}
+
+.ma-1 {
+  margin: 4px !important;
+}
+
+.ma-2 {
+  margin: 8px !important;
+}
+
+.ma-3 {
+  margin: 12px !important;
+}
+
+.ma-4 {
+  margin: 16px !important;
+}
+
+.ma-5 {
+  margin: 20px !important;
+}
+
+.ma-6 {
+  margin: 24px !important;
+}
+
+.ma-7 {
+  margin: 28px !important;
+}
+
+.ma-8 {
+  margin: 32px !important;
+}
+
+.ma-9 {
+  margin: 36px !important;
+}
+
+.ma-10 {
+  margin: 40px !important;
+}
+
+.ma-11 {
+  margin: 44px !important;
+}
+
+.ma-12 {
+  margin: 48px !important;
+}
+
+.ma-13 {
+  margin: 52px !important;
+}
+
+.ma-14 {
+  margin: 56px !important;
+}
+
+.ma-15 {
+  margin: 60px !important;
+}
+
+.ma-16 {
+  margin: 64px !important;
+}
+
+.ma-auto {
+  margin: auto !important;
+}
+
+.mx-0 {
+  margin-right: 0px !important;
+  margin-left: 0px !important;
+}
+
+.mx-1 {
+  margin-right: 4px !important;
+  margin-left: 4px !important;
+}
+
+.mx-2 {
+  margin-right: 8px !important;
+  margin-left: 8px !important;
+}
+
+.mx-3 {
+  margin-right: 12px !important;
+  margin-left: 12px !important;
+}
+
+.mx-4 {
+  margin-right: 16px !important;
+  margin-left: 16px !important;
+}
+
+.mx-5 {
+  margin-right: 20px !important;
+  margin-left: 20px !important;
+}
+
+.mx-6 {
+  margin-right: 24px !important;
+  margin-left: 24px !important;
+}
+
+.mx-7 {
+  margin-right: 28px !important;
+  margin-left: 28px !important;
+}
+
+.mx-8 {
+  margin-right: 32px !important;
+  margin-left: 32px !important;
+}
+
+.mx-9 {
+  margin-right: 36px !important;
+  margin-left: 36px !important;
+}
+
+.mx-10 {
+  margin-right: 40px !important;
+  margin-left: 40px !important;
+}
+
+.mx-11 {
+  margin-right: 44px !important;
+  margin-left: 44px !important;
+}
+
+.mx-12 {
+  margin-right: 48px !important;
+  margin-left: 48px !important;
+}
+
+.mx-13 {
+  margin-right: 52px !important;
+  margin-left: 52px !important;
+}
+
+.mx-14 {
+  margin-right: 56px !important;
+  margin-left: 56px !important;
+}
+
+.mx-15 {
+  margin-right: 60px !important;
+  margin-left: 60px !important;
+}
+
+.mx-16 {
+  margin-right: 64px !important;
+  margin-left: 64px !important;
+}
+
+.mx-auto {
+  margin-right: auto !important;
+  margin-left: auto !important;
+}
+
+.my-0 {
+  margin-top: 0px !important;
+  margin-bottom: 0px !important;
+}
+
+.my-1 {
+  margin-top: 4px !important;
+  margin-bottom: 4px !important;
+}
+
+.my-2 {
+  margin-top: 8px !important;
+  margin-bottom: 8px !important;
+}
+
+.my-3 {
+  margin-top: 12px !important;
+  margin-bottom: 12px !important;
+}
+
+.my-4 {
+  margin-top: 16px !important;
+  margin-bottom: 16px !important;
+}
+
+.my-5 {
+  margin-top: 20px !important;
+  margin-bottom: 20px !important;
+}
+
+.my-6 {
+  margin-top: 24px !important;
+  margin-bottom: 24px !important;
+}
+
+.my-7 {
+  margin-top: 28px !important;
+  margin-bottom: 28px !important;
+}
+
+.my-8 {
+  margin-top: 32px !important;
+  margin-bottom: 32px !important;
+}
+
+.my-9 {
+  margin-top: 36px !important;
+  margin-bottom: 36px !important;
+}
+
+.my-10 {
+  margin-top: 40px !important;
+  margin-bottom: 40px !important;
+}
+
+.my-11 {
+  margin-top: 44px !important;
+  margin-bottom: 44px !important;
+}
+
+.my-12 {
+  margin-top: 48px !important;
+  margin-bottom: 48px !important;
+}
+
+.my-13 {
+  margin-top: 52px !important;
+  margin-bottom: 52px !important;
+}
+
+.my-14 {
+  margin-top: 56px !important;
+  margin-bottom: 56px !important;
+}
+
+.my-15 {
+  margin-top: 60px !important;
+  margin-bottom: 60px !important;
+}
+
+.my-16 {
+  margin-top: 64px !important;
+  margin-bottom: 64px !important;
+}
+
+.my-auto {
+  margin-top: auto !important;
+  margin-bottom: auto !important;
+}
+
+.mt-0 {
+  margin-top: 0px !important;
+}
+
+.mt-1 {
+  margin-top: 4px !important;
+}
+
+.mt-2 {
+  margin-top: 8px !important;
+}
+
+.mt-3 {
+  margin-top: 12px !important;
+}
+
+.mt-4 {
+  margin-top: 16px !important;
+}
+
+.mt-5 {
+  margin-top: 20px !important;
+}
+
+.mt-6 {
+  margin-top: 24px !important;
+}
+
+.mt-7 {
+  margin-top: 28px !important;
+}
+
+.mt-8 {
+  margin-top: 32px !important;
+}
+
+.mt-9 {
+  margin-top: 36px !important;
+}
+
+.mt-10 {
+  margin-top: 40px !important;
+}
+
+.mt-11 {
+  margin-top: 44px !important;
+}
+
+.mt-12 {
+  margin-top: 48px !important;
+}
+
+.mt-13 {
+  margin-top: 52px !important;
+}
+
+.mt-14 {
+  margin-top: 56px !important;
+}
+
+.mt-15 {
+  margin-top: 60px !important;
+}
+
+.mt-16 {
+  margin-top: 64px !important;
+}
+
+.mt-auto {
+  margin-top: auto !important;
+}
+
+.mr-0 {
+  margin-right: 0px !important;
+}
+
+.mr-1 {
+  margin-right: 4px !important;
+}
+
+.mr-2 {
+  margin-right: 8px !important;
+}
+
+.mr-3 {
+  margin-right: 12px !important;
+}
+
+.mr-4 {
+  margin-right: 16px !important;
+}
+
+.mr-5 {
+  margin-right: 20px !important;
+}
+
+.mr-6 {
+  margin-right: 24px !important;
+}
+
+.mr-7 {
+  margin-right: 28px !important;
+}
+
+.mr-8 {
+  margin-right: 32px !important;
+}
+
+.mr-9 {
+  margin-right: 36px !important;
+}
+
+.mr-10 {
+  margin-right: 40px !important;
+}
+
+.mr-11 {
+  margin-right: 44px !important;
+}
+
+.mr-12 {
+  margin-right: 48px !important;
+}
+
+.mr-13 {
+  margin-right: 52px !important;
+}
+
+.mr-14 {
+  margin-right: 56px !important;
+}
+
+.mr-15 {
+  margin-right: 60px !important;
+}
+
+.mr-16 {
+  margin-right: 64px !important;
+}
+
+.mr-auto {
+  margin-right: auto !important;
+}
+
+.mb-0 {
+  margin-bottom: 0px !important;
+}
+
+.mb-1 {
+  margin-bottom: 4px !important;
+}
+
+.mb-2 {
+  margin-bottom: 8px !important;
+}
+
+.mb-3 {
+  margin-bottom: 12px !important;
+}
+
+.mb-4 {
+  margin-bottom: 16px !important;
+}
+
+.mb-5 {
+  margin-bottom: 20px !important;
+}
+
+.mb-6 {
+  margin-bottom: 24px !important;
+}
+
+.mb-7 {
+  margin-bottom: 28px !important;
+}
+
+.mb-8 {
+  margin-bottom: 32px !important;
+}
+
+.mb-9 {
+  margin-bottom: 36px !important;
+}
+
+.mb-10 {
+  margin-bottom: 40px !important;
+}
+
+.mb-11 {
+  margin-bottom: 44px !important;
+}
+
+.mb-12 {
+  margin-bottom: 48px !important;
+}
+
+.mb-13 {
+  margin-bottom: 52px !important;
+}
+
+.mb-14 {
+  margin-bottom: 56px !important;
+}
+
+.mb-15 {
+  margin-bottom: 60px !important;
+}
+
+.mb-16 {
+  margin-bottom: 64px !important;
+}
+
+.mb-auto {
+  margin-bottom: auto !important;
+}
+
+.ml-0 {
+  margin-left: 0px !important;
+}
+
+.ml-1 {
+  margin-left: 4px !important;
+}
+
+.ml-2 {
+  margin-left: 8px !important;
+}
+
+.ml-3 {
+  margin-left: 12px !important;
+}
+
+.ml-4 {
+  margin-left: 16px !important;
+}
+
+.ml-5 {
+  margin-left: 20px !important;
+}
+
+.ml-6 {
+  margin-left: 24px !important;
+}
+
+.ml-7 {
+  margin-left: 28px !important;
+}
+
+.ml-8 {
+  margin-left: 32px !important;
+}
+
+.ml-9 {
+  margin-left: 36px !important;
+}
+
+.ml-10 {
+  margin-left: 40px !important;
+}
+
+.ml-11 {
+  margin-left: 44px !important;
+}
+
+.ml-12 {
+  margin-left: 48px !important;
+}
+
+.ml-13 {
+  margin-left: 52px !important;
+}
+
+.ml-14 {
+  margin-left: 56px !important;
+}
+
+.ml-15 {
+  margin-left: 60px !important;
+}
+
+.ml-16 {
+  margin-left: 64px !important;
+}
+
+.ml-auto {
+  margin-left: auto !important;
+}
+.mt-n1 {
+  margin-top: -4px !important;
+}
+
+.mt-n2 {
+  margin-top: -8px !important;
+}
+
+.mt-n3 {
+  margin-top: -12px !important;
+}
+
+.mt-n4 {
+  margin-top: -16px !important;
+}
+
+.mt-n5 {
+  margin-top: -20px !important;
+}
+
+.mt-n6 {
+  margin-top: -24px !important;
+}
+
+.mt-n7 {
+  margin-top: -28px !important;
+}
+
+.mt-n8 {
+  margin-top: -32px !important;
+}
+
+.mt-n9 {
+  margin-top: -36px !important;
+}
+
+.mt-n10 {
+  margin-top: -40px !important;
+}
+
+.mt-n11 {
+  margin-top: -44px !important;
+}
+
+.mt-n12 {
+  margin-top: -48px !important;
+}
+
+.mt-n13 {
+  margin-top: -52px !important;
+}
+
+.mt-n14 {
+  margin-top: -56px !important;
+}
+
+.mt-n15 {
+  margin-top: -60px !important;
+}
+
+.mt-n16 {
+  margin-top: -64px !important;
+}
+
+.mr-n1 {
+  margin-right: -4px !important;
+}
+
+.mr-n2 {
+  margin-right: -8px !important;
+}
+
+.mr-n3 {
+  margin-right: -12px !important;
+}
+
+.mr-n4 {
+  margin-right: -16px !important;
+}
+
+.mr-n5 {
+  margin-right: -20px !important;
+}
+
+.mr-n6 {
+  margin-right: -24px !important;
+}
+
+.mr-n7 {
+  margin-right: -28px !important;
+}
+
+.mr-n8 {
+  margin-right: -32px !important;
+}
+
+.mr-n9 {
+  margin-right: -36px !important;
+}
+
+.mr-n10 {
+  margin-right: -40px !important;
+}
+
+.mr-n11 {
+  margin-right: -44px !important;
+}
+
+.mr-n12 {
+  margin-right: -48px !important;
+}
+
+.mr-n13 {
+  margin-right: -52px !important;
+}
+
+.mr-n14 {
+  margin-right: -56px !important;
+}
+
+.mr-n15 {
+  margin-right: -60px !important;
+}
+
+.mr-n16 {
+  margin-right: -64px !important;
+}
+
+.mb-n1 {
+  margin-bottom: -4px !important;
+}
+
+.mb-n2 {
+  margin-bottom: -8px !important;
+}
+
+.mb-n3 {
+  margin-bottom: -12px !important;
+}
+
+.mb-n4 {
+  margin-bottom: -16px !important;
+}
+
+.mb-n5 {
+  margin-bottom: -20px !important;
+}
+
+.mb-n6 {
+  margin-bottom: -24px !important;
+}
+
+.mb-n7 {
+  margin-bottom: -28px !important;
+}
+
+.mb-n8 {
+  margin-bottom: -32px !important;
+}
+
+.mb-n9 {
+  margin-bottom: -36px !important;
+}
+
+.mb-n10 {
+  margin-bottom: -40px !important;
+}
+
+.mb-n11 {
+  margin-bottom: -44px !important;
+}
+
+.mb-n12 {
+  margin-bottom: -48px !important;
+}
+
+.mb-n13 {
+  margin-bottom: -52px !important;
+}
+
+.mb-n14 {
+  margin-bottom: -56px !important;
+}
+
+.mb-n15 {
+  margin-bottom: -60px !important;
+}
+
+.mb-n16 {
+  margin-bottom: -64px !important;
+}
+
+.ml-n1 {
+  margin-left: -4px !important;
+}
+
+.ml-n2 {
+  margin-left: -8px !important;
+}
+
+.ml-n3 {
+  margin-left: -12px !important;
+}
+
+.ml-n4 {
+  margin-left: -16px !important;
+}
+
+.ml-n5 {
+  margin-left: -20px !important;
+}
+
+.ml-n6 {
+  margin-left: -24px !important;
+}
+
+.ml-n7 {
+  margin-left: -28px !important;
+}
+
+.ml-n8 {
+  margin-left: -32px !important;
+}
+
+.ml-n9 {
+  margin-left: -36px !important;
+}
+
+.ml-n10 {
+  margin-left: -40px !important;
+}
+
+.ml-n11 {
+  margin-left: -44px !important;
+}
+
+.ml-n12 {
+  margin-left: -48px !important;
+}
+
+.ml-n13 {
+  margin-left: -52px !important;
+}
+
+.ml-n14 {
+  margin-left: -56px !important;
+}
+
+.ml-n15 {
+  margin-left: -60px !important;
+}
+
+.ml-n16 {
+  margin-left: -64px !important;
+}
+.pt-0 {
+  padding-top: 0px !important;
+}
+
+.pt-1 {
+  padding-top: 4px !important;
+}
+
+.pt-2 {
+  padding-top: 8px !important;
+}
+
+.pt-3 {
+  padding-top: 12px !important;
+}
+
+.pt-4 {
+  padding-top: 16px !important;
+}
+
+.pt-5 {
+  padding-top: 20px !important;
+}
+
+.pt-6 {
+  padding-top: 24px !important;
+}
+
+.pt-7 {
+  padding-top: 28px !important;
+}
+
+.pt-8 {
+  padding-top: 32px !important;
+}
+
+.pt-9 {
+  padding-top: 36px !important;
+}
+
+.pt-10 {
+  padding-top: 40px !important;
+}
+
+.pt-11 {
+  padding-top: 44px !important;
+}
+
+.pt-12 {
+  padding-top: 48px !important;
+}
+
+.pt-13 {
+  padding-top: 52px !important;
+}
+
+.pt-14 {
+  padding-top: 56px !important;
+}
+
+.pt-15 {
+  padding-top: 60px !important;
+}
+
+.pt-16 {
+  padding-top: 64px !important;
+}
+
+.pr-0 {
+  padding-right: 0px !important;
+}
+
+.pr-1 {
+  padding-right: 4px !important;
+}
+
+.pr-2 {
+  padding-right: 8px !important;
+}
+
+.pr-3 {
+  padding-right: 12px !important;
+}
+
+.pr-4 {
+  padding-right: 16px !important;
+}
+
+.pr-5 {
+  padding-right: 20px !important;
+}
+
+.pr-6 {
+  padding-right: 24px !important;
+}
+
+.pr-7 {
+  padding-right: 28px !important;
+}
+
+.pr-8 {
+  padding-right: 32px !important;
+}
+
+.pr-9 {
+  padding-right: 36px !important;
+}
+
+.pr-10 {
+  padding-right: 40px !important;
+}
+
+.pr-11 {
+  padding-right: 44px !important;
+}
+
+.pr-12 {
+  padding-right: 48px !important;
+}
+
+.pr-13 {
+  padding-right: 52px !important;
+}
+
+.pr-14 {
+  padding-right: 56px !important;
+}
+
+.pr-15 {
+  padding-right: 60px !important;
+}
+
+.pr-16 {
+  padding-right: 64px !important;
+}
+
+.pb-0 {
+  padding-bottom: 0px !important;
+}
+
+.pb-1 {
+  padding-bottom: 4px !important;
+}
+
+.pb-2 {
+  padding-bottom: 8px !important;
+}
+
+.pb-3 {
+  padding-bottom: 12px !important;
+}
+
+.pb-4 {
+  padding-bottom: 16px !important;
+}
+
+.pb-5 {
+  padding-bottom: 20px !important;
+}
+
+.pb-6 {
+  padding-bottom: 24px !important;
+}
+
+.pb-7 {
+  padding-bottom: 28px !important;
+}
+
+.pb-8 {
+  padding-bottom: 32px !important;
+}
+
+.pb-9 {
+  padding-bottom: 36px !important;
+}
+
+.pb-10 {
+  padding-bottom: 40px !important;
+}
+
+.pb-11 {
+  padding-bottom: 44px !important;
+}
+
+.pb-12 {
+  padding-bottom: 48px !important;
+}
+
+.pb-13 {
+  padding-bottom: 52px !important;
+}
+
+.pb-14 {
+  padding-bottom: 56px !important;
+}
+
+.pb-15 {
+  padding-bottom: 60px !important;
+}
+
+.pb-16 {
+  padding-bottom: 64px !important;
+}
+
+.pl-0 {
+  padding-left: 0px !important;
+}
+
+.pl-1 {
+  padding-left: 4px !important;
+}
+
+.pl-2 {
+  padding-left: 8px !important;
+}
+
+.pl-3 {
+  padding-left: 12px !important;
+}
+
+.pl-4 {
+  padding-left: 16px !important;
+}
+
+.pl-5 {
+  padding-left: 20px !important;
+}
+
+.pl-6 {
+  padding-left: 24px !important;
+}
+
+.pl-7 {
+  padding-left: 28px !important;
+}
+
+.pl-8 {
+  padding-left: 32px !important;
+}
+
+.pl-9 {
+  padding-left: 36px !important;
+}
+
+.pl-10 {
+  padding-left: 40px !important;
+}
+
+.pl-11 {
+  padding-left: 44px !important;
+}
+
+.pl-12 {
+  padding-left: 48px !important;
+}
+
+.pl-13 {
+  padding-left: 52px !important;
+}
+
+.pl-14 {
+  padding-left: 56px !important;
+}
+
+.pl-15 {
+  padding-left: 60px !important;
+}
+
+.pl-16 {
+  padding-left: 64px !important;
+}