@angelscmf/front 1.0.23 → 1.0.25

package/README.md

@@ -49,8 +49,19 @@ or
 
 ## Angels' Messages
 
-* `<a-alert></a-alert>` (.a-alert, a-brick.a-alert, div.a-alert, p.a-alert, span.a-alert, ul.a-alert)
-* `<a-debug></a-debug>` (.a-debug, a-brick.a-debug, div.a-debug, p.a-debug, span.a-debug, ul.a-debug)
-* `<a-error></a-error>` .a-error, a-brick.a-error, div.a-error, p.a-error, span.a-error, ul.a-error
-* `<a-info></a-info>` (.a-info, a-brick.a-info, div.a-info, p.a-info, span.a-info, ul.a-info)
-* `<a-pass></a-pass>` (.a-pass, a-brick.a-pass, div.a-pass, p.a-pass, span.a-pass, ul.a-pass)
+* `<a-alert></a-alert>` (.a-alert, a.a-alert, a-brick.a-alert, div.a-alert, p.a-alert, span.a-alert, ul.a-alert)
+* `<a-debug></a-debug>` (.a-debug, a.a-debug, a-brick.a-debug, div.a-debug, p.a-debug, span.a-debug, ul.a-debug)
+* `<a-done></a-done>` (.a-done, a.a-done, a-brick.a-done, div.a-done, p.a-done, span.a-done, ul.a-done)
+* `<a-error></a-error>` .a-error, a.a-error, a-brick.a-error, div.a-error, p.a-error, span.a-error, ul.a-error
+* `<a-info></a-info>` (.a-info, a.a-info, a-brick.a-info, div.a-info, p.a-info, span.a-info, ul.a-info)
+* `<a-tip></a-tip>` (.a-tip, a.a-tip, a-brick.a-tip, div.a-tip, p.a-tip, span.a-tip, ul.a-tip)
+* `<a-warn></a-warn>` (.a-warn, a.a-warn, a-brick.a-warn, div.a-warn, p.a-warn, span.a-warn, ul.a-warn)
+
+
+## Angels' Tags
+
+* a-flex
+* a-grid
+* a-iflex
+* a-igrid
+

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@angelscmf/front",
-  "version": "1.0.23",
+  "version": "1.0.25",
   "description": "",
-  "license": "ISC",
+  "license": "UNLICENSED",
   "author": "",
   "scripts": {
     "a-dev-watching": "gulp angelsDevWatching",

package/sass/AngelsDesign.scss

@@ -5,11 +5,17 @@
 @forward 'AngelsClasses';
 @forward 'angelsMessages/AngelsAlert';
 @forward 'angelsMessages/AngelsDebug';
+@forward 'angelsMessages/AngelsDone';
 @forward 'angelsMessages/AngelsError';
 @forward 'angelsMessages/AngelsInfo';
-@forward 'angelsMessages/AngelsPass';
+@forward 'angelsMessages/AngelsTip';
+@forward 'angelsMessages/AngelsWarn';
 @forward 'AngelsScreenRanges';
 @forward 'angelsTags/a-block';
 @forward 'angelsTags/a-brick';
+@forward 'angelsTags/a-flex';
+@forward 'angelsTags/a-grid';
+@forward 'angelsTags/a-iflex';
+@forward 'angelsTags/a-igrid';
 @forward 'angelsTags/a-infra';
 @forward 'angelsTags/a-page';

package/sass/angelsMessages/_AngelsAlert.scss

@@ -1,8 +1,8 @@
 :root {
     --a-alert-space: var(--a-lineHeightHalf);
     --a-alert-spaceHalf: var(--a-lineHeightQuarter);
-    --a-alert-borderColor: #ff6b6b;
-    --a-alert-background: #fff5f5;
+    --a-alert-borderColor: #b71c1c;
+    --a-alert-background: #ffe6e6;
     --a-alert-color: #d90429;
 }
 
@@ -14,6 +14,7 @@ p.a-alert {
 }
 
 a-brick.a-alert,
+a.a-alert,
 span.a-alert {
     padding: 0 var(--a-alert-spaceHalf);
 }
@@ -26,8 +27,8 @@ ul.a-alert {
 
 a-alert,
 .a-alert {
-    box-shadow: inset 0 0 2px 2px var(--a-alert-borderColor);
     background: var(--a-alert-background);
+    border-left: 4px solid var(--a-alert-borderColor);
     color: var(--a-alert-color);
     border-radius: var(--a-borderRadius);
     position: relative;

package/sass/angelsMessages/_AngelsDebug.scss

@@ -1,9 +1,9 @@
 :root {
     --a-debug-space: var(--a-lineHeightHalf);
     --a-debug-spaceHalf: var(--a-lineHeightQuarter);
-    --a-debug-borderColor: #f0ad4e;
-    --a-debug-background: #fffaf0;
-    --a-debug-color: #5d3c00;
+    --a-debug-borderColor: #a29bfe;
+    --a-debug-background: #f8f7ff;
+    --a-debug-color: #443c78;
 }
 
 a-debug,
@@ -14,6 +14,7 @@ p.a-debug {
 }
 
 a-brick.a-debug,
+a.a-debug,
 span.a-debug {
     padding: 0 var(--a-debug-spaceHalf);
 }
@@ -26,8 +27,8 @@ ul.a-debug {
 
 a-debug,
 .a-debug {
-    box-shadow: inset 0 0 0px 1px var(--a-debug-borderColor);
     background: var(--a-debug-background);
+    border-left: 4px solid var(--a-debug-borderColor);
     color: var(--a-debug-color);
     border-radius: var(--a-borderRadius);
     position: relative;

package/sass/angelsMessages/_AngelsDone.scss

@@ -0,0 +1,39 @@
+:root {
+    --a-done-space: var(--a-lineHeightHalf);
+    --a-done-spaceHalf: var(--a-lineHeightQuarter);
+    --a-done-borderColor: #2ecc71;
+    --a-done-background: #f3fff7;
+    --a-done-color: #1b7944;
+}
+
+a-done,
+div.a-done,
+p.a-done {
+    display: block;
+    padding: var(--a-done-space);
+}
+
+a-brick.a-done,
+a.a-done,
+span.a-done {
+    padding: 0 var(--a-done-spaceHalf);
+}
+
+ul.a-done {
+    list-style-type: disc;
+    padding-top: var(--a-done-space);
+    padding-bottom: var(--a-done-space);
+}
+
+a-done,
+.a-done {
+    background: var(--a-done-background);
+    border-left: 4px solid var(--a-done-borderColor);
+    color: var(--a-done-color);
+    border-radius: var(--a-borderRadius);
+    position: relative;
+
+    &:empty {
+        display: none;
+    }
+}

package/sass/angelsMessages/_AngelsError.scss

@@ -2,8 +2,8 @@
     --a-error-space: var(--a-lineHeightHalf);
     --a-error-spaceHalf: var(--a-lineHeightQuarter);
     --a-error-borderColor: #f28b82;
-    --a-error-background: #fff1f0;
-    --a-error-color: #c0392b;
+    --a-error-background: #fff5f5;
+    --a-error-color: #c62828;
 }
 
 a-error,
@@ -14,6 +14,7 @@ p.a-error {
 }
 
 a-brick.a-error,
+a.a-error,
 span.a-error {
     padding: 0 var(--a-error-spaceHalf);
 }
@@ -26,8 +27,8 @@ ul.a-error {
 
 a-error,
 .a-error {
-    box-shadow: inset 0 0 0px 1px var(--a-error-borderColor);
     background: var(--a-error-background);
+    border-left: 4px solid var(--a-error-borderColor);
     color: var(--a-error-color);
     border-radius: var(--a-borderRadius);
     position: relative;

package/sass/angelsMessages/_AngelsInfo.scss

@@ -2,7 +2,7 @@
     --a-info-space: var(--a-lineHeightHalf);
     --a-info-spaceHalf: var(--a-lineHeightQuarter);
     --a-info-borderColor: #4dabf7;
-    --a-info-background: #f0f8ff;
+    --a-info-background: #f5faff;
     --a-info-color: #1c5d99;
 }
 
@@ -14,6 +14,7 @@ p.a-info {
 }
 
 a-brick.a-info,
+a.a-info,
 span.a-info {
     padding: 0 var(--a-info-spaceHalf);
 }
@@ -26,8 +27,8 @@ ul.a-info {
 
 a-info,
 .a-info {
-    box-shadow: inset 0 0 0px 1px var(--a-info-borderColor);
     background: var(--a-info-background);
+    border-left: 4px solid var(--a-info-borderColor);
     color: var(--a-info-color);
     border-radius: var(--a-borderRadius);
     position: relative;

package/sass/angelsMessages/_AngelsTip.scss

@@ -0,0 +1,39 @@
+:root {
+    --a-tip-space: var(--a-lineHeightHalf);
+    --a-tip-spaceHalf: var(--a-lineHeightQuarter);
+    --a-tip-borderColor: #d0d7de;
+    --a-tip-background: #f9fafb;
+    --a-tip-color: #6c757d;
+}
+
+a-tip,
+div.a-tip,
+p.a-tip {
+    display: block;
+    padding: var(--a-tip-space);
+}
+
+a-brick.a-tip,
+a.a-tip,
+span.a-tip {
+    padding: 0 var(--a-tip-spaceHalf);
+}
+
+ul.a-tip {
+    list-style-type: disc;
+    padding-top: var(--a-tip-space);
+    padding-bottom: var(--a-tip-space);
+}
+
+a-tip,
+.a-tip {
+    background: var(--a-tip-background);
+    border-left: 4px solid var(--a-tip-borderColor);
+    color: var(--a-tip-color);
+    border-radius: var(--a-borderRadius);
+    position: relative;
+
+    &:empty {
+        display: none;
+    }
+}

package/sass/angelsMessages/_AngelsWarn.scss

@@ -0,0 +1,39 @@
+:root {
+    --a-warn-space: var(--a-lineHeightHalf);
+    --a-warn-spaceHalf: var(--a-lineHeightQuarter);
+    --a-warn-borderColor: #ffc107;
+    --a-warn-background: #fffdf0;
+    --a-warn-color: #8a6d1f;
+}
+
+a-warn,
+div.a-warn,
+p.a-warn {
+    display: block;
+    padding: var(--a-warn-space);
+}
+
+a-brick.a-warn,
+a.a-warn,
+span.a-warn {
+    padding: 0 var(--a-warn-spaceHalf);
+}
+
+ul.a-warn {
+    list-style-type: disc;
+    padding-top: var(--a-warn-space);
+    padding-bottom: var(--a-warn-space);
+}
+
+a-warn,
+.a-warn {
+    background: var(--a-warn-background);
+    border-left: 4px solid var(--a-warn-borderColor);
+    color: var(--a-warn-color);
+    border-radius: var(--a-borderRadius);
+    position: relative;
+
+    &:empty {
+        display: none;
+    }
+}

package/sass/angelsTags/_a-flex.scss

@@ -0,0 +1,4 @@
+a-flex,
+.a-flex {
+    display: flex;
+}

package/sass/angelsTags/_a-grid.scss

@@ -0,0 +1,4 @@
+a-grid,
+.a-grid {
+    display: grid;
+}

package/sass/angelsTags/_a-iflex.scss

@@ -0,0 +1,4 @@
+a-iflex,
+.a-iflex {
+    display: inline-flex;
+}

package/sass/angelsTags/_a-igrid.scss

@@ -0,0 +1,4 @@
+a-igrid,
+.a-igrid {
+    display: inline-grid;
+}

package/sass/angelsMessages/_AngelsPass.scss

@@ -1,38 +0,0 @@
-:root {
-    --a-pass-space: var(--a-lineHeightHalf);
-    --a-pass-spaceHalf: var(--a-lineHeightQuarter);
-    --a-pass-borderColor: #38d9a9;
-    --a-pass-background: #f0fffa;
-    --a-pass-color: #0b8f6a;
-}
-
-a-pass,
-div.a-pass,
-p.a-pass {
-    display: block;
-    padding: var(--a-pass-space);
-}
-
-a-brick.a-pass,
-span.a-pass {
-    padding: 0 var(--a-pass-spaceHalf);
-}
-
-ul.a-pass {
-    list-style-type: disc;
-    padding-top: var(--a-pass-space);
-    padding-bottom: var(--a-pass-space);
-}
-
-a-pass,
-.a-pass {
-    box-shadow: inset 0 0 0px 1px var(--a-pass-borderColor);
-    background: var(--a-pass-background);
-    color: var(--a-pass-color);
-    border-radius: var(--a-borderRadius);
-    position: relative;
-
-    &:empty {
-        display: none;
-    }
-}