testio-tailwind 0.2.0 → 0.2.2

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

@@ -1,174 +1,174 @@
-
-.form-group.trix-editor {
-  @apply gap-grid-gutter grid-rows-auto;
-  grid-template-rows: auto;
-  @screen md {
-    grid-template-areas: "label trix-toolbar"
-                         "label trix-editor";
-   }
-}
-
-.trix-content {
-  @apply -mt-grid-gutter;
-  @screen md {
-    grid-area: trix-editor;
-   }
-}
-
-.trix-editor .form-control {
-  @apply h-auto min-h-xxl border-t-0 rounded-t-none;
-}
-
-trix-toolbar {
-  @apply border border-bordercolor rounded-t;
-  @screen md {
-    grid-area: trix-toolbar;
-   }
-}
-
-trix-toolbar .trix-button-group {
-  @apply relative border-0 mb-0;
-}
-
-trix-toolbar .trix-button-row {
-  @apply relative flex flex-row w-full p-xxs overflow-x-scroll;
-}
-
-.trix-button-row::-webkit-scrollbar {
-  display: none;
-  -ms-overflow-style: none;  /* IE and Edge */
-  scrollbar-width: none;  /* Firefox */
-}
-
-.trix-button-group.trix-button-group--history-tools {
-  @apply absolute right-0 pr-xs bg-white;
-}
-
-trix-toolbar .trix-button {
-  @apply inline-flex justify-center items-center flex-shrink-0 w-btn-sm h-btn-sm min-w-btn-sm border-0 rounded bg-transparent;
-  font-size: 0; /* Fix for safari bug, we don't need to show any text in those buttons */
-  &:hover, &:focus {
-    @apply text-white bg-link-hover;
-  }
-  &::before {
-    @apply relative block h-icon-sm w-icon-sm bg-gray-darker;
-    background-image: none;
-    mask-repeat: no-repeat;
-  }
-}
-
-trix-toolbar .trix-button--icon::before {
-  content: "";
-  opacity: 1;
-}
-
-trix-toolbar .trix-button:hover {
-  &::before {
-    @apply opacity-100 bg-white;
-  }
-}
-
-trix-toolbar .trix-button.trix-active {
-  @apply bg-info;
-  &::before {
-    @apply bg-white;
-  }
-}
-
-trix-toolbar .trix-button:not(:first-child) {
-  @apply border-l-0;
-}
-
-.trix-button--icon-bold::before {
-  mask-image: url("/assets/images/format-bold.svg");
-}
-
-.trix-button--icon-italic::before {
-  mask-image: url("/assets/images/format-mark.svg");
-}
-.trix-button--icon-strike::before {
-  mask-image: url("/assets/images/format-strikethrough.svg");
-}
-.trix-button--icon-link::before {
-  mask-image: url("/assets/images/format-link.svg");
-}
-.trix-button--icon-heading-1::before {
-  mask-image: url("/assets/images/format-heading.svg");
-}
-.trix-button--icon-quote::before {
-  mask-image: url("/assets/images/format-quote.svg");
-}
-.trix-button--icon-code::before {
-  mask-image: url("/assets/images/format-code.svg");
-}
-.trix-button--icon-bullet-list::before {
-  mask-image: url("/assets/images/format-list-bulleted.svg");
-}
-.trix-button--icon-number-list::before {
-  mask-image: url("/assets/images/format-list-numbered.svg");
-}
-.trix-button--icon-decrease-nesting-level::before {
-  mask-image: url("/assets/images/format-indent-decrease.svg");
-}
-.trix-button--icon-increase-nesting-level::before {
-  mask-image: url("/assets/images/format-indent-increase.svg");
-}
-trix-toolbar .trix-button--icon-attach::before {
-  @apply top-0 bottom-0;
-  mask-image: url("/assets/images/attachment.svg");
-}
-.trix-button--icon-undo::before {
-  mask-image: url("/assets/images/undo.svg");
-}
-.trix-button--icon-redo::before {
-  mask-image: url("/assets/images/redo.svg");
-}
-
-
-/*//// Add link/URL popover ////*/
-
-trix-toolbar .trix-dialog {
-  @apply px-xs py-xxs bg-gray-lightest border border-bordercolor border-t-0;
-}
-
-trix-toolbar .trix-button--dialog {
-  @apply w-auto h-btn-sm px-xs bg-primary text-white text-label;
-}
-
-trix-toolbar .trix-dialog__link-fields {
-  @apply flex flex-row items-center;
-}
-
-trix-toolbar .trix-dialog .trix-button-group {
-  @apply ml-xs;
-}
-
-trix-toolbar .trix-input--dialog {
-  @apply w-full h-btn-sm px-xs border border-bordercolor rounded;
-}
-
-
-/*//// Attachments ////*/
-
-trix-editor .attachment-gallery .attachment,
-trix-editor .attachment {
-  @apply block w-full mb-xs;
-}
-
-trix-editor [data-trix-attachment] figcaption textarea {
-  @apply w-full h-btn-sm p-xs border border-bordercolor rounded;
-}
-
-trix-editor .attachment__caption {
-  @apply mt-xxs;
-}
-
-trix-editor .attachment__progress {
-  @apply appearance-none block overflow-hidden w-full h-progress-bar-thin-height my-xxs rounded-none;
-  &::-webkit-progress-bar {
-    @apply h-progress-bar-thin-height bg-gray-light;
-  }
-  &::-webkit-progress-value {
-    @apply h-progress-bar-thin-height bg-info;
-  }
-}
+
+.form-group.trix-editor {
+  @apply gap-grid-gutter grid-rows-auto;
+  grid-template-rows: auto;
+  @screen md {
+    grid-template-areas: "label trix-toolbar"
+                         "label trix-editor";
+   }
+}
+
+.trix-content {
+  @apply -mt-grid-gutter;
+  @screen md {
+    grid-area: trix-editor;
+   }
+}
+
+.trix-editor .form-control {
+  @apply h-auto min-h-xxl border-t-0 rounded-t-none;
+}
+
+trix-toolbar {
+  @apply border border-bordercolor rounded-t;
+  @screen md {
+    grid-area: trix-toolbar;
+   }
+}
+
+trix-toolbar .trix-button-group {
+  @apply relative border-0 mb-0;
+}
+
+trix-toolbar .trix-button-row {
+  @apply relative flex flex-row w-full p-xxs overflow-x-scroll;
+}
+
+.trix-button-row::-webkit-scrollbar {
+  display: none;
+  -ms-overflow-style: none;  /* IE and Edge */
+  scrollbar-width: none;  /* Firefox */
+}
+
+.trix-button-group.trix-button-group--history-tools {
+  @apply absolute right-0 pr-xs bg-white;
+}
+
+trix-toolbar .trix-button {
+  @apply inline-flex justify-center items-center flex-shrink-0 w-btn-sm h-btn-sm min-w-btn-sm border-0 rounded bg-transparent;
+  font-size: 0; /* Fix for safari bug, we don't need to show any text in those buttons */
+  &:hover, &:focus {
+    @apply text-white bg-link-hover;
+  }
+  &::before {
+    @apply relative block h-icon-sm w-icon-sm bg-gray-darker;
+    background-image: none;
+    mask-repeat: no-repeat;
+  }
+}
+
+trix-toolbar .trix-button--icon::before {
+  content: "";
+  opacity: 1;
+}
+
+trix-toolbar .trix-button:hover {
+  &::before {
+    @apply opacity-100 bg-white;
+  }
+}
+
+trix-toolbar .trix-button.trix-active {
+  @apply bg-info;
+  &::before {
+    @apply bg-white;
+  }
+}
+
+trix-toolbar .trix-button:not(:first-child) {
+  @apply border-l-0;
+}
+
+.trix-button--icon-bold::before {
+  mask-image: url("/assets/images/format-bold.svg");
+}
+
+.trix-button--icon-italic::before {
+  mask-image: url("/assets/images/format-mark.svg");
+}
+.trix-button--icon-strike::before {
+  mask-image: url("/assets/images/format-strikethrough.svg");
+}
+.trix-button--icon-link::before {
+  mask-image: url("/assets/images/format-link.svg");
+}
+.trix-button--icon-heading-1::before {
+  mask-image: url("/assets/images/format-heading.svg");
+}
+.trix-button--icon-quote::before {
+  mask-image: url("/assets/images/format-quote.svg");
+}
+.trix-button--icon-code::before {
+  mask-image: url("/assets/images/format-code.svg");
+}
+.trix-button--icon-bullet-list::before {
+  mask-image: url("/assets/images/format-list-bulleted.svg");
+}
+.trix-button--icon-number-list::before {
+  mask-image: url("/assets/images/format-list-numbered.svg");
+}
+.trix-button--icon-decrease-nesting-level::before {
+  mask-image: url("/assets/images/format-indent-decrease.svg");
+}
+.trix-button--icon-increase-nesting-level::before {
+  mask-image: url("/assets/images/format-indent-increase.svg");
+}
+trix-toolbar .trix-button--icon-attach::before {
+  @apply top-0 bottom-0;
+  mask-image: url("/assets/images/attachment.svg");
+}
+.trix-button--icon-undo::before {
+  mask-image: url("/assets/images/undo.svg");
+}
+.trix-button--icon-redo::before {
+  mask-image: url("/assets/images/redo.svg");
+}
+
+
+/*//// Add link/URL popover ////*/
+
+trix-toolbar .trix-dialog {
+  @apply px-xs py-xxs bg-gray-lightest border border-bordercolor border-t-0;
+}
+
+trix-toolbar .trix-button--dialog {
+  @apply w-auto h-btn-sm px-xs bg-primary text-white text-label;
+}
+
+trix-toolbar .trix-dialog__link-fields {
+  @apply flex flex-row items-center;
+}
+
+trix-toolbar .trix-dialog .trix-button-group {
+  @apply ml-xs;
+}
+
+trix-toolbar .trix-input--dialog {
+  @apply w-full h-btn-sm px-xs border border-bordercolor rounded;
+}
+
+
+/*//// Attachments ////*/
+
+trix-editor .attachment-gallery .attachment,
+trix-editor .attachment {
+  @apply block w-full mb-xs;
+}
+
+trix-editor [data-trix-attachment] figcaption textarea {
+  @apply w-full h-btn-sm p-xs border border-bordercolor rounded;
+}
+
+trix-editor .attachment__caption {
+  @apply mt-xxs;
+}
+
+trix-editor .attachment__progress {
+  @apply appearance-none block overflow-hidden w-full h-progress-bar-thin-height my-xxs rounded-none;
+  &::-webkit-progress-bar {
+    @apply h-progress-bar-thin-height bg-gray-light;
+  }
+  &::-webkit-progress-value {
+    @apply h-progress-bar-thin-height bg-info;
+  }
+}

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

@@ -1,81 +1,81 @@
-
-h1, h2, h3, h4, h5,
-.text-heading-1,
-.text-heading-2,
-.text-heading-3,
-.text-heading-4,
-.text-heading-5 {
-  @apply font-light;
-}
-
-h1 {
-  @apply text-heading-1;
-}
-
-h2 {
-  @apply text-heading-2;
-}
-
-h3 {
-  @apply text-heading-3;
-}
-
-h4 {
-  @apply text-heading-4;
-}
-
-h5 {
-  @apply text-heading-5;
-}
-
-h6 {
-  @apply text-heading-6;
-}
-
-body {
-  @apply text-base;
-}
-
-.text-display-1,
-.text-display-2,
-.text-display-3,
-.text-display-4 {
-  @apply font-display;
-}
-
-a {
-  @apply text-link font-semibold hover:text-link-hover hover:underline cursor-pointer;
-}
-
-code {
-  @apply font-mono not-italic text-sm;
-}
-
-label, .label, .form-label, dt {
-  @apply text-label-color text-label font-semibold;
-}
-
-.link-with-icon {
-  @apply inline-flex items-start hover:no-underline;
-
-  &.black {
-    @apply text-black hover:text-link-hover;
-  }
-}
-
-.link-with-icon .icon {
-  @apply mr-icon-spacing;
-}
-
-.text-with-icon {
-  @apply inline-flex items-start;
-}
-
-.text-with-icon .icon {
-  @apply mr-icon-spacing;
-}
-
-.text-with-icon p {
-  @apply -mt-0.5;
-}
-
+
+h1, h2, h3, h4, h5,
+.text-heading-1,
+.text-heading-2,
+.text-heading-3,
+.text-heading-4,
+.text-heading-5 {
+  @apply font-light;
+}
+
+h1 {
+  @apply text-heading-1;
+}
+
+h2 {
+  @apply text-heading-2;
+}
+
+h3 {
+  @apply text-heading-3;
+}
+
+h4 {
+  @apply text-heading-4;
+}
+
+h5 {
+  @apply text-heading-5;
+}
+
+h6 {
+  @apply text-heading-6;
+}
+
+body {
+  @apply text-base;
+}
+
+.text-display-1,
+.text-display-2,
+.text-display-3,
+.text-display-4 {
+  @apply font-display;
+}
+
+a {
+  @apply text-link font-semibold hover:text-link-hover hover:underline cursor-pointer;
+}
+
+code {
+  @apply font-mono not-italic text-sm;
+}
+
+label, .label, .form-label, dt {
+  @apply text-label-color text-label font-semibold;
+}
+
+.link-with-icon {
+  @apply inline-flex items-start hover:no-underline;
+
+  &.black {
+    @apply text-black hover:text-link-hover;
+  }
+}
+
+.link-with-icon .icon {
+  @apply mr-icon-spacing;
+}
+
+.text-with-icon {
+  @apply inline-flex items-start;
+}
+
+.text-with-icon .icon {
+  @apply mr-icon-spacing;
+}
+
+.text-with-icon p {
+  @apply -mt-0.5;
+}
+