testio-tailwind 0.5.1 → 0.6.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "testio-tailwind",
-	"version": "0.5.1",
+	"version": "0.6.1",
 	"description": "Tailwind based design system for Test IO",
 	"scripts": {
 		"clean": "del dist",

package/src/assets/stylesheets/components/cards.css

@@ -45,11 +45,15 @@
   @apply relative flex flex-col bg-card rounded;
 }
 
+.card-title {
+  @apply block overflow-ellipsis text-heading-5 leading-5;
+}
+
 .card.card-sm {
   @apply w-full sm:w-card-sm;
 
   .card-title {
-    @apply block overflow-ellipsis text-heading-5 text-center;
+    @apply block overflow-ellipsis text-heading-5 leading-5 text-center;
   }
 }
 
@@ -62,7 +66,7 @@
 }
 
 .card-header {
-  @apply relative px-md pt-md;
+  @apply relative px-md py-md;
 }
 
 .card-header .popover_info_icon {
@@ -93,6 +97,10 @@
   flex: 1 1 1;
 }
 
+.card-header ~ .card-body {
+  @apply pt-0;
+}
+
 .card.highlight {
   @apply text-white bg-info border-0;
 
@@ -146,4 +154,61 @@
 .card .card-info-popover {
   @apply absolute right-xxs top-xxs;
   z-index: 1;
+}
+
+/*/// Card badges ///*/
+
+.card .card-badge {
+  @apply absolute top-0 right-0 overflow-hidden;
+  width: 65px;
+  height: 65px;
+}
+
+.card .card-badge::before {
+  @apply absolute block bg-gray-darker;
+  content: "";
+  transform: rotate(45deg);
+  width: 100px;
+  height: 25px;
+  right: -25px;
+  top: 10px;
+}
+
+.card .card-badge::after {
+  @apply absolute inline-block w-icon-xs h-icon-xs bg-white;
+  content: "";
+  right: 14px;
+  top: 17px;
+  mask-image: url("/assets/images/exclamation-circle-filled.svg");
+  mask-repeat: no-repeat;
+}
+
+.card .card-badge.success {
+  &::before {
+    @apply bg-success;
+  }
+  &::after {
+    mask-image: url("/assets/images/check-thick.svg");
+    right: 16px;
+  }
+}
+
+.card .card-badge.danger,
+.card .card-badge.high-priority {
+  &::before {
+    @apply bg-danger;
+  }
+  &::after {
+    mask-image: url("/assets/images/exclamation-circle-filled.svg");
+  }
+}
+
+.card .card-badge.info, 
+.card .card-badge.opportunity {
+  &::before {
+    @apply bg-info;
+  }
+  &::after {
+    mask-image: url("/assets/images/exclamation-circle-filled.svg");
+  }
 }

package/src/assets/stylesheets/components/customer/customer_productcards.css

@@ -16,7 +16,7 @@
 }
 
 .product-card .card-header {
-  @apply flex flex-row pl-0 pt-0 bg-card border-0;
+  @apply flex flex-row pl-0 py-0 bg-card border-0;
 }
 
 .product-card .card-icon {

package/src/assets/stylesheets/components/fonts/testio.svg

@@ -1026,4 +1026,10 @@
 <glyph unicode="&#xece8;" glyph-name="creditcard" horiz-adv-x="717" d="M716.8 76.8c0 0 0 307.2 0 307.2 0 56.525-45.875 102.4-102.4 102.4h-512c-56.525 0-102.4-45.875-102.4-102.4v-307.2c0-56.525 45.875-102.4 102.4-102.4h512c56.525 0 102.4 45.875 102.4 102.4zM665.6 179.2h-563.2v-102.4h563.2c0-28.262-22.938-51.2-51.2-51.2 0 0-512 0-512 0-28.263 0-51.2 22.938-51.2 51.2 0 0 0 307.2 0 307.2 0 28.262 22.938 51.2 51.2 51.2h512c28.263 0 51.2-22.938 51.2-51.2v-204.8zM179.2 230.4h-76.8v51.2h76.8v-51.2zM563.2 230.4h-76.8v51.2h76.8v-51.2zM435.2 230.4h-204.8v51.2h204.8v-51.2zM435.2 332.8h-332.8v51.2h332.8v-51.2z" />
 <glyph unicode="&#xece9;" glyph-name="creditcard-lg" horiz-adv-x="717" d="M716.8 166.4h-614.4v-102.4h614.4c0-28.262 0 102.4 0 102.4zM179.2 217.6h-76.8v51.2h76.8v-51.2zM563.2 217.6h-76.8v51.2h76.8v-51.2zM435.2 217.6h-204.8v51.2h204.8v-51.2zM435.2 320h-332.8v51.2h332.8v-51.2zM716.8 371.2c0 56.512-45.888 102.4-102.4 102.4h-512c-56.512 0-102.4-45.888-102.4-102.4v-307.2c0-56.512 45.888-102.4 102.4-102.4h512c56.512 0 102.4 45.888 102.4 102.4v307.2zM691.2 371.2v-307.2c0-42.381-34.419-76.8-76.8-76.8h-512c-42.381 0-76.8 34.419-76.8 76.8v307.2c0 42.381 34.419 76.8 76.8 76.8 0 0 512 0 512 0 42.381 0 76.8-34.419 76.8-76.8z" />
 <glyph unicode="&#xecea;" glyph-name="creditcard-xl" horiz-adv-x="717" d="M716.8 149.334h-631.466v-102.4h631.466c0-28.254 0 102.4 0 102.4zM162.133 234.666h-76.8v51.2h76.8v-51.2zM546.134 234.666h-76.8v51.2h76.8v-51.2zM418.134 234.666h-204.8v51.2h204.8v-51.2zM418.134 337.067h-332.8v51.2h332.8v-51.2zM716.8 405.334c0 37.675-30.592 68.267-68.266 68.267h-580.266c-37.675 0-68.266-30.592-68.266-68.267v-375.466c0-37.675 30.592-68.267 68.266-68.267h580.266c37.674 0 68.266 30.592 68.266 68.267v375.466zM699.734 405.334v-375.466c0-28.254-22.946-51.2-51.2-51.2h-580.266c-28.254 0-51.2 22.946-51.2 51.2v375.466c0 28.263 22.946 51.2 51.2 51.2 0 0 580.266 0 580.266 0 28.254 0 51.2-22.938 51.2-51.2z" />
+<glyph unicode="&#xeceb;" glyph-name="frozen" d="M256 485.299c14.131 0 25.6-11.469 25.6-25.6v-40.602l33.101 33.101c9.984 10.010 26.214 10.010 36.199 0 10.010-9.984 10.010-26.214 0-36.198l-69.299-69.299v-55.603l84.608 84.608c9.984 10.010 26.214 10.010 36.199 0 10.010-9.984 10.010-26.215 0-36.199l-84.608-84.608h55.603l69.299 69.299c9.984 10.010 26.214 10.010 36.199 0 10.010-9.984 10.010-26.214 0-36.198l-33.101-33.101h40.601c14.131 0 25.6-11.469 25.6-25.6s-11.469-25.6-25.6-25.6h-40.601l33.101-33.101c10.010-9.984 10.010-26.214 0-36.199-9.984-10.010-26.214-10.010-36.199 0l-69.299 69.299h-55.603l84.608-84.582c10.010-9.984 10.010-26.214 0-36.224-9.984-10.010-26.214-10.010-36.199 0l-84.608 84.608v-55.603l69.299-69.299c10.010-9.984 10.010-26.214 0-36.199-9.984-10.010-26.214-10.010-36.199 0l-33.101 33.101v-40.601c0-14.131-11.469-25.6-25.6-25.6s-25.6 11.469-25.6 25.6v40.601l-33.101-33.101c-9.984-10.010-26.214-10.010-36.198 0-10.010 9.984-10.010 26.214 0 36.199l69.299 69.299v55.603l-84.608-84.608c-9.984-10.010-26.215-10.010-36.198 0-10.010 10.010-10.010 26.24 0 36.224l84.608 84.582h-55.603l-69.299-69.299c-9.984-10.010-26.215-10.010-36.199 0-10.009 9.984-10.009 26.214 0 36.199l33.101 33.101h-40.602c-14.131 0-25.6 11.469-25.6 25.6s11.469 25.6 25.6 25.6h40.602l-33.101 33.101c-10.009 9.984-10.009 26.214 0 36.199 9.984 10.010 26.215 10.010 36.198 0l69.299-69.299h55.603l-84.608 84.608c-10.010 9.984-10.010 26.214 0 36.198 9.984 10.010 26.215 10.010 36.198 0l84.608-84.608v55.603l-69.299 69.299c-10.010 9.984-10.010 26.214 0 36.199 9.984 10.009 26.215 10.009 36.198 0l33.101-33.101v40.602c0 14.131 11.469 25.6 25.6 25.6z" />
+<glyph unicode="&#xecec;" glyph-name="map-marker" horiz-adv-x="410" d="M204.8-24.499c0 0 204.8 234.394 204.8 316.749 0 107.162-91.776 194.151-204.8 194.151s-204.8-86.989-204.8-194.151c0-82.355 204.8-316.749 204.8-316.749zM204.8 358.4c42.394 0 76.8-34.406 76.8-76.8s-34.406-76.8-76.8-76.8c-42.394 0-76.8 34.407-76.8 76.8s34.406 76.8 76.8 76.8z" />
+<glyph unicode="&#xeced;" glyph-name="corporation-lg" horiz-adv-x="410" d="M192 473.050h115.366l-38.567-26.88 38.567-24.32h-89.767v-51.2h38.4v-51.2h25.6v-358.4h-38.4v38.4h-76.8v-38.4h-38.4v358.4h25.6v51.2h38.4v102.4zM0 229.85l115.2 38.4v-307.2h-38.4v38.4h-38.4v-38.4h-38.4v268.8zM294.4 268.25l115.2-38.4v-268.8h-38.4v38.4h-38.4v-38.4h-38.4v307.2zM217.6 76.25h-25.6v-38.4h25.6v38.4zM38.067 76.25h-12.467v-38.4h12.467v38.4zM332.8 76.25h-12.467v-38.4h12.467v38.4zM63.667 76.25h-12.467v-38.4h12.467v38.4zM358.4 76.25h-12.467v-38.4h12.467v38.4zM89.267 76.25h-12.467v-38.4h12.467v38.4zM384 76.25h-12.467v-38.4h12.467v38.4zM256 76.25h-25.6v-38.4h25.6v38.4zM179.2 76.25h-25.6v-38.4h25.6v38.4zM38.067 140.199h-12.467v-38.4h12.467v38.4zM332.8 140.199h-12.467v-38.4h12.467v38.4zM63.667 140.199h-12.467v-38.4h12.467v38.4zM358.4 140.199h-12.467v-38.4h12.467v38.4zM89.267 140.199h-12.467v-38.4h12.467v38.4zM384 140.199h-12.467v-38.4h12.467v38.4zM217.6 140.25h-25.6v-38.4h25.6v38.4zM256 140.25h-25.6v-38.4h25.6v38.4zM179.2 140.25h-25.6v-38.4h25.6v38.4zM38.067 204.16h-12.467v-38.4h12.467v38.4zM332.8 204.16h-12.467v-38.4h12.467v38.4zM63.667 204.16h-12.467v-38.4h12.467v38.4zM358.4 204.16h-12.467v-38.4h12.467v38.4zM89.267 204.16h-12.467v-38.4h12.467v38.4zM384 204.16h-12.467v-38.4h12.467v38.4zM217.6 204.25h-25.6v-38.4h25.6v38.4zM256 204.25h-25.6v-38.4h25.6v38.4zM179.2 204.25h-25.6v-38.4h25.6v38.4zM217.6 268.25h-25.6v-38.4h25.6v38.4zM256 268.25h-25.6v-38.4h25.6v38.4zM179.2 268.25h-25.6v-38.4h25.6v38.4zM230.4 345.049h-51.559v-25.6h51.559v25.6z" />
+<glyph unicode="&#xecee;" glyph-name="map-marker-outline-lg" horiz-adv-x="410" d="M205.235-38.4c0 0 205.248 234.905 205.248 317.44 0 107.379-91.968 194.56-205.248 194.56-113.267 0-205.235-87.181-205.235-194.56 0-82.534 205.235-317.44 205.235-317.44zM205.235 1.063c-31.782 37.863-95.949 116.787-139.149 186.496-22.695 36.646-40.486 69.747-40.486 91.481 0 93.645 80.858 168.96 179.635 168.96s179.648-75.315 179.648-168.96c0-21.735-17.792-54.835-40.499-91.481-43.2-69.709-107.367-148.634-139.149-186.496zM204.8 320c28.262 0 51.2-22.938 51.2-51.2s-22.938-51.2-51.2-51.2c-28.262 0-51.2 22.937-51.2 51.2s22.938 51.2 51.2 51.2z" />
+<glyph unicode="&#xecef;" glyph-name="creditcard-user-lg" horiz-adv-x="717" d="M716.8 115.2h-614.4v-51.2h614.4c0-28.262 0 51.2 0 51.2zM384 256h-76.8v38.4h76.8v-38.4zM640 256h-204.8v38.4h204.8v-38.4zM640 332.8h-332.8v38.4h332.8v-38.4zM435.2 179.2h-128v38.4h128v-38.4zM640 179.2h-153.6v38.4h153.6v-38.4zM716.8 371.2c0 56.512-45.888 102.4-102.4 102.4h-512c-56.512 0-102.4-45.888-102.4-102.4v-307.2c0-56.512 45.888-102.4 102.4-102.4h512c56.512 0 102.4 45.888 102.4 102.4v307.2zM691.2 371.2v-307.2c0-42.381-34.419-76.8-76.8-76.8h-512c-42.381 0-76.8 34.419-76.8 76.8v307.2c0 42.381 34.419 76.8 76.8 76.8 0 0 512 0 512 0 42.381 0 76.8-34.419 76.8-76.8zM142.72 247.526c-8.064-3.187-15.501-7.987-21.76-14.183-12.032-12.032-18.688-28.416-18.688-45.44v-21.504c0-3.456 1.28-6.656 3.712-9.088 2.432-2.304 5.632-3.712 9.088-3.712 3.328 0 6.656 1.408 8.96 3.712 2.432 2.432 3.84 5.632 3.84 9.088v21.504c0 10.24 3.968 20.096 11.264 27.264 7.168 7.168 17.024 11.264 27.136 11.264 10.24 0 20.096-4.096 27.264-11.264s11.264-17.024 11.264-27.264v-21.504c0-3.456 1.408-6.656 3.712-9.088 2.432-2.304 5.632-3.712 9.088-3.712s6.656 1.408 9.088 3.712c2.304 2.432 3.712 5.632 3.712 9.088v21.504c0 17.024-6.784 33.408-18.816 45.44-6.259 6.195-13.657 10.995-21.721 14.183 8.064 3.174 15.463 7.975 21.721 14.234 12.032 12.032 18.816 28.416 18.816 45.312 0 17.024-6.784 33.28-18.816 45.312s-28.288 18.816-45.312 18.816c-16.896 0-33.28-6.784-45.312-18.816s-18.688-28.288-18.688-45.312c0-16.896 6.656-33.28 18.688-45.312 6.259-6.259 13.696-11.059 21.76-14.234zM127.872 307.072c0 10.24 3.968 20.096 11.264 27.264 7.168 7.168 17.024 11.264 27.136 11.264 10.24 0 20.096-4.096 27.264-11.264s11.264-17.024 11.264-27.264c0-10.112-4.096-19.968-11.264-27.136-7.168-7.296-17.024-11.264-27.264-11.264-10.112 0-19.968 3.968-27.136 11.264-7.296 7.168-11.264 17.024-11.264 27.136z" />
+<glyph unicode="&#xecf0;" glyph-name="review-passed-lg" horiz-adv-x="400" d="M224.78 448.625h37.463v-12.488h137.366v-324.683h-24.976v299.707h-112.39v-24.975h-124.878v24.975h-112.39v-412.097h224.406v-25.475h-249.381v462.548h137.366v12.488h37.464c0 13.799 11.177 24.975 24.976 24.975s24.976-11.176 24.976-24.975zM324.683 311.259h-249.756v24.976h249.756v-24.976zM74.927 336.234h249.756v-24.976h-249.756v24.976zM74.927 286.283h249.756v-24.976h-249.756v24.976zM74.927 223.844h249.756v-24.975h-249.756v24.976zM74.927 173.893h87.414v-24.976h-87.415v24.976zM74.927 123.942h87.414v-24.976h-87.415v24.976zM270.736 45.144l34.216-35.466 73.428 77.424c2.248 2.373 5.495 3.747 8.741 3.747 3.372 0 6.493-1.249 8.866-3.622 2.373-2.248 3.747-5.495 3.747-8.741 0-3.372-1.249-6.493-3.622-8.866l-91.161-95.531-52.074 53.572c-2.248 2.373-3.496 5.62-3.496 8.866 0 3.372 1.374 6.493 3.746 8.866 2.373 2.248 5.495 3.497 8.866 3.497 3.247 0 6.369-1.373 8.741-3.747z" />
 </font></defs></svg>