testio-tailwind 3.17.0 → 3.18.0

package/package.json

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

package/src/assets/stylesheets/app.css

@@ -1,7 +1,4 @@
 
-@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap');
-
 @import "tailwindcss";
 @import './tailwind_config.css';
 @import './tailwind_theme_dark.css';
@@ -21,6 +18,7 @@
 @import './plugin_themes/pagy.css' layer(components);
 
 /*//// Components ////*/
+@import './components/fonts.css' layer(components);
 @import './components/actionbar.css' layer(components);
 @import './components/alerts.css' layer(components);
 @import './components/badges.css' layer(components);

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

@@ -0,0 +1,120 @@
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 200;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-ExtraLight.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-ExtraLight.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 200;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-ExtraLightIt.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-ExtraLightIt.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 300;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-Light.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-Light.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 300;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-LightIt.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-LightIt.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 400;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-Regular.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-Regular.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 400;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-It.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-It.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 600;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-Semibold.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-Semibold.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 600;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-SemiboldIt.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-SemiboldIt.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 700;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-Bold.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-Bold.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 700;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-BoldIt.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-BoldIt.otf.woff') format('woff');
+}
+
+@font-face{
+    font-family: 'Source Sans 3';
+    font-weight: 900;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-Black.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-Black.otf.woff') format('woff');
+}
+
+@font-face {
+    font-family: 'Source Sans 3';
+    font-weight: 900;
+    font-style: italic;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceSans3-BlackIt.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceSans3-BlackIt.otf.woff') format('woff');
+}
+
+
+/*/// Source Code Pro ///*/
+
+@font-face {
+    font-family: 'Source Code Pro';
+    font-weight: 400;
+    font-style: normal;
+    font-stretch: normal;
+    src: url('/assets/fonts/SourceCodePro-Regular.otf.woff2') format('woff2'),
+         url('/assets/fonts/SourceCodePro-Regular.otf.woff') format('woff');
+}

package/src/pages/agenticqa/splitview_items.haml

@@ -35,7 +35,8 @@ title: Splitview items
       .splitview-item-icon.icon.icon-blocked.blocked
       .splitview-item-text Check title with a lot of lorem ipsum
     .splitview-item.unread
-      .splitview-item-icon.icon.icon-sync.pending
+      .splitview-item-icon
+        .icon.icon-sync.pending.w-icon.animate-spin
       .splitview-item-text Check title with a lot of lorem ipsum
   %details.splitview-group
     %summary.splitview-item
@@ -60,4 +61,31 @@ title: Splitview items
         .splitview-item-icon.icon.icon-check-circle-filled.success
         .splitview-item-text Main Product Image
     %btn.btn.splitview-btn Show 99 dismissed checks
+  %details.splitview-group
+    %summary.splitview-item
+      .splitview-item-icon.icon.icon-circle-empty.text-chart-empty
+      .splitview-item-text
+        .splitview-item-title https://url.com
+    .splitview-group-status.status-stepper
+      .status-step.completed
+        .icon.icon-check-thick-centered
+        3 done
+      .status-step.active
+        .icon.icon-sync
+        Executing checks
+      .status-step
+        + 3 to do
+    %turbo-frame.turbo-wrapper
+      %a.splitview-item
+        .splitview-item-icon
+          .icon.icon-sync.pending.w-icon.animate-spin
+        .splitview-item-text Navigation Menu Hover
+    %turbo-frame.turbo-wrapper
+      %a.splitview-item
+        .splitview-item-icon.icon.icon-cross-circle-filled.danger
+        .splitview-item-text No Results Message
+    %turbo-frame.turbo-wrapper
+      %a.splitview-item.selected
+        .splitview-item-icon.icon.icon-check-circle-filled.success
+        .splitview-item-text Last selected child will have no rounded border on the right
   %btn.btn.splitview-btn Show 99 dismissed pages

package/src/pages/typography/fonts.haml

@@ -0,0 +1,14 @@
+---
+tags: typography
+title: Fonts
+---
+
+%p.mb-xs Here are the fonts used in the design system
+%p.font-extralight Source Sans 3 - Extra Light 200
+%p.font-light Source Sans 3 - Light 300
+%p Source Sans 3 - Regular 400
+%p.font-medium Source Sans 3 - Medium 500
+%p.font-semibold Source Sans 3 - Semibold 600
+%p.font-bold Source Sans 3 - Bold 700
+%p.font-black Source Sans 3 - Black 800
+%p.font-mono Source Code Pro - Regular 400