@xdam/ember-partials 3.0.1 → 4.0.1

package/app/components/xep-menu-surface.js

@@ -1 +1,2 @@
+import '@material/menu-surface';
 export { default } from '@xdam/ember-partials/components/xep-menu-surface';

package/app/components/xep-menu.js

@@ -1 +1,3 @@
+import '@material/menu-surface';
+import '@material/menu';
 export { default } from '@xdam/ember-partials/components/xep-menu';

package/app/components/xep-radio.js

@@ -1 +1,2 @@
+import '@material/radio';
 export { default } from '@xdam/ember-partials/components/xep-radio';

package/app/components/xep-slider.js

@@ -1 +1,2 @@
+import '@material/slider';
 export { default } from '@xdam/ember-partials/components/xep-slider';

package/app/components/xep-snackbar.js

@@ -1 +1,2 @@
+import '@material/snackbar';
 export { default } from '@xdam/ember-partials/components/xep-snackbar';

package/app/components/xep-switch.js

@@ -1 +1,2 @@
+import '@material/switch';
 export { default } from '@xdam/ember-partials/components/xep-switch';

package/app/styles/ember-partials/components/xep-avatar.scss

@@ -1,24 +1,24 @@
-.xep-avatar {
-  display: inline-block;
-  position: relative;
-  border-radius: 50%;
-  overflow: hidden;
-  text-decoration: none;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  &__image,
-  &__text {
-    display: block;
-  }
-
-  &__image {
-    border: 0;
-  }
-
-  &__text {
-    color: $mdc-theme-on-primary;
-    text-transform: uppercase;
-  }
-}
+.xep-avatar {
+  display: inline-block;
+  position: relative;
+  border-radius: 50%;
+  overflow: hidden;
+  text-decoration: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  &__image,
+  &__text {
+    display: block;
+  }
+
+  &__image {
+    border: 0;
+  }
+
+  &__text {
+    color: $mdc-theme-on-primary;
+    text-transform: uppercase;
+  }
+}

package/app/styles/ember-partials/components/xep-bubble.scss

@@ -1,20 +1,20 @@
-$xep-bubble-font-size: 0.65rem;
-
-.xep-bubble {
-  display: inline-block;
-  min-width: $xep-bubble-font-size * 2;
-  line-height: $xep-bubble-font-size * 2;
-  // padding: 3px;
-  border-radius: 50%;
-  font-size: $xep-bubble-font-size;
-  text-align: center;
-  background: $mdc-theme-primary;
-  color: $mdc-theme-on-primary;
-  font-weight: bold;
-
-  &--floating {
-    position: absolute;
-    top: -#{calc($xep-bubble-font-size / 2)};
-    right: -#{calc($xep-bubble-font-size / 2)};
-  }
-}
+$xep-bubble-font-size: 0.65rem;
+
+.xep-bubble {
+  display: inline-block;
+  min-width: $xep-bubble-font-size * 2;
+  line-height: $xep-bubble-font-size * 2;
+  // padding: 3px;
+  border-radius: 50%;
+  font-size: $xep-bubble-font-size;
+  text-align: center;
+  background: $mdc-theme-primary;
+  color: $mdc-theme-on-primary;
+  font-weight: bold;
+
+  &--floating {
+    position: absolute;
+    top: -#{calc($xep-bubble-font-size / 2)};
+    right: -#{calc($xep-bubble-font-size / 2)};
+  }
+}

package/app/styles/ember-partials/components/xep-button.scss

@@ -1,58 +1,58 @@
-.xep-button {
-  &__trailing-icon {
-    // Note: styles reflect .mdc-button__icon
-    margin-right: 0;
-    margin-left: 8px;
-    display: inline-block;
-    width: 18px;
-    height: 18px;
-    font-size: 18px;
-    vertical-align: top;
-  }
-
-  // Attempt to strip down some properties
-  &--unstyled {
-    min-width: 0;
-
-    &:not(:disabled) {
-      color: currentColor;
-    }
-
-    &::before,
-    &::after {
-      background-color: transparent;
-    }
-  }
-
-  &.mdc-icon-button {
-    min-width: 0;
-  }
-
-  // Button colors...
-  @each $name, $value in $xep-colors {
-    &--#{"" + $name}-color {
-      &:not(:disabled) {
-        color: $value;
-      }
-
-      &.mdc-button--raised,
-      &.mdc-button--unelevated {
-        &:not(:disabled) {
-          background-color: $value;
-          color: $mdc-theme-on-primary;
-        }
-      }
-
-      &.mdc-button--outlined {
-        &:not(:disabled) {
-          border-color: $value;
-        }
-      }
-
-      &::before,
-      &::after {
-        background-color: $value;
-      }
-    }
-  }
-}
+.xep-button {
+  &__trailing-icon {
+    // Note: styles reflect .mdc-button__icon
+    margin-right: 0;
+    margin-left: 8px;
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    font-size: 18px;
+    vertical-align: top;
+  }
+
+  // Attempt to strip down some properties
+  &--unstyled {
+    min-width: 0;
+
+    &:not(:disabled) {
+      color: currentColor;
+    }
+
+    &::before,
+    &::after {
+      background-color: transparent;
+    }
+  }
+
+  &.mdc-icon-button {
+    min-width: 0;
+  }
+
+  // Button colors...
+  @each $name, $value in $xep-colors {
+    &--#{"" + $name}-color {
+      &:not(:disabled) {
+        color: $value;
+      }
+
+      &.mdc-button--raised,
+      &.mdc-button--unelevated {
+        &:not(:disabled) {
+          background-color: $value;
+          color: $mdc-theme-on-primary;
+        }
+      }
+
+      &.mdc-button--outlined {
+        &:not(:disabled) {
+          border-color: $value;
+        }
+      }
+
+      &::before,
+      &::after {
+        background-color: $value;
+      }
+    }
+  }
+}

package/app/styles/ember-partials/components/xep-drawer.scss

@@ -1,21 +1,21 @@
-.xep-drawer {
-  top: 0;
-  border: none;
-
-  &--right {
-    right: 0;
-    left: initial;
-
-    &.mdc-drawer--animate {
-      transform: translateX(100%);
-    }
-
-    &.mdc-drawer--opening {
-      transform: translateX(0);
-    }
-
-    &.mdc-drawer--closing {
-      transform: translateX(100%);
-    }
-  }
-}
+.xep-drawer {
+  top: 0;
+  border: none;
+
+  &--right {
+    right: 0;
+    left: initial;
+
+    &.mdc-drawer--animate {
+      transform: translateX(100%);
+    }
+
+    &.mdc-drawer--opening {
+      transform: translateX(0);
+    }
+
+    &.mdc-drawer--closing {
+      transform: translateX(100%);
+    }
+  }
+}

package/app/styles/ember-partials/components/xep-snackbar.scss

@@ -1,3 +1,3 @@
-.xep-snackbar {
-  z-index: 2; // snackbar show be elevated above toolbars
-}
+.xep-snackbar {
+  z-index: 2; // snackbar show be elevated above toolbars
+}

package/app/styles/ember-partials/components/xep-toolbar.scss

@@ -1,107 +1,107 @@
-$xep-toolbar-spacing: 5px;
-$xep-toolbar-divider-thickness: 2px;
-
-.xep-toolbar {
-  background: $mdc-theme-surface;
-  display: flex;
-  box-sizing: border-box;
-  flex-flow: row nowrap;
-  overflow: visible;
-  z-index: 1;
-
-  &--fixed {
-    position: fixed;
-  }
-
-  &__section {
-    display: inline-flex;
-
-    &--align-start {
-      justify-content: flex-start;
-    }
-
-    &--align-end {
-      justify-content: flex-end;
-    }
-
-    &--align-middle {
-      justify-content: center;
-    }
-
-    &--flex-grow {
-      flex: 1 1 auto;
-    }
-
-    &--flex-shrink {
-      flex: 0 1 auto;
-    }
-  }
-
-  &__item {
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    position: relative;
-  }
-
-  &__item-button,
-  &__item-text,
-  &__item-icon {
-    padding: $xep-toolbar-spacing;
-  }
-
-  &__divider {
-    background: map-get($xep-shades, typography-3);
-  }
-
-  &__item-text {
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-  }
-
-  &--horizontal {
-    padding: 0 $xep-toolbar-spacing;
-
-    .xep-toolbar__section {
-      flex-flow: row nowrap;
-    }
-
-    .xep-toolbar__divider {
-      width: $xep-toolbar-divider-thickness;
-      margin: ($xep-toolbar-spacing * 2) $xep-toolbar-spacing;
-    }
-  }
-
-  &--vertical {
-    height: 100%;
-    padding: $xep-toolbar-spacing 0;
-    flex-flow: column nowrap;
-
-    .xep-toolbar__section {
-      flex-flow: column nowrap;
-    }
-
-    .xep-toolbar__item {
-      display: flex;
-      text-align: center;
-      justify-content: center;
-      flex-direction: column;
-    }
-
-    .xep-toolbar__item-text {
-      font-size: 10px;
-    }
-
-    .xep-toolbar__divider {
-      height: $xep-toolbar-divider-thickness;
-      margin: $xep-toolbar-spacing ($xep-toolbar-spacing * 2);
-    }
-
-    .xep-toolbar__item-icon,
-    .xep-toolbar__item-text {
-      display: block;
-      line-height: 1;
-    }
-  }
-}
+$xep-toolbar-spacing: 5px;
+$xep-toolbar-divider-thickness: 2px;
+
+.xep-toolbar {
+  background: $mdc-theme-surface;
+  display: flex;
+  box-sizing: border-box;
+  flex-flow: row nowrap;
+  overflow: visible;
+  z-index: 1;
+
+  &--fixed {
+    position: fixed;
+  }
+
+  &__section {
+    display: inline-flex;
+
+    &--align-start {
+      justify-content: flex-start;
+    }
+
+    &--align-end {
+      justify-content: flex-end;
+    }
+
+    &--align-middle {
+      justify-content: center;
+    }
+
+    &--flex-grow {
+      flex: 1 1 auto;
+    }
+
+    &--flex-shrink {
+      flex: 0 1 auto;
+    }
+  }
+
+  &__item {
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    position: relative;
+  }
+
+  &__item-button,
+  &__item-text,
+  &__item-icon {
+    padding: $xep-toolbar-spacing;
+  }
+
+  &__divider {
+    background: map-get($xep-shades, typography-3);
+  }
+
+  &__item-text {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+
+  &--horizontal {
+    padding: 0 $xep-toolbar-spacing;
+
+    .xep-toolbar__section {
+      flex-flow: row nowrap;
+    }
+
+    .xep-toolbar__divider {
+      width: $xep-toolbar-divider-thickness;
+      margin: ($xep-toolbar-spacing * 2) $xep-toolbar-spacing;
+    }
+  }
+
+  &--vertical {
+    height: 100%;
+    padding: $xep-toolbar-spacing 0;
+    flex-flow: column nowrap;
+
+    .xep-toolbar__section {
+      flex-flow: column nowrap;
+    }
+
+    .xep-toolbar__item {
+      display: flex;
+      text-align: center;
+      justify-content: center;
+      flex-direction: column;
+    }
+
+    .xep-toolbar__item-text {
+      font-size: 10px;
+    }
+
+    .xep-toolbar__divider {
+      height: $xep-toolbar-divider-thickness;
+      margin: $xep-toolbar-spacing ($xep-toolbar-spacing * 2);
+    }
+
+    .xep-toolbar__item-icon,
+    .xep-toolbar__item-text {
+      display: block;
+      line-height: 1;
+    }
+  }
+}

package/app/styles/ember-partials/dark-theme.scss

@@ -1,42 +1,42 @@
-$xep-colors: (
-  primary: #2284ff,
-  success: #3adb76,
-  warning: #ffae00,
-  alert: #cc4b37
-) !default;
-
-$xep-shades: (
-  typography: #fefefe,
-  typography-1: #b2b3b4,
-  typography-2: #8d9192,
-  typography-3: #7c8081,
-  typography-4: #616364,
-  background: #1b1e22,
-  background-1: #1f2327,
-  background-2: #282b2f,
-  background-3: #383b3f,
-  background-4: #44474b
-) !default;
-
-$xep-surface-border: map-get($xep-shades, background-3) !default;
-
-/* ============= MDC Color ============= */
-
-$mdc-theme-primary: map-get($xep-colors, primary) !default;
-$mdc-theme-secondary: map-get($xep-colors, success) !default;
-$mdc-theme-background: map-get($xep-shades, background) !default;
-$mdc-theme-surface: map-get($xep-shades, background-2) !default;
-$mdc-theme-on-primary: map-get($xep-shades, typography) !default;
-$mdc-theme-on-secondary: map-get($xep-shades, typography) !default;
-$mdc-theme-on-surface: map-get($xep-shades, typography-1) !default;
-
-$mdc-theme-text-primary-on-light: map-get($xep-colors, primary) !default;
-$mdc-theme-text-primary-on-dark: map-get($xep-colors, primary) !default;
-$mdc-theme-text-secondary-on-dark: map-get($xep-colors, success) !default;
-$mdc-theme-text-secondary-on-light: map-get($xep-colors, success) !default;
-$mdc-theme-text-hint-on-dark: map-get($xep-shades, typography-2) !default;
-$mdc-theme-text-hint-on-light: map-get($xep-shades, typography-2) !default;
-$mdc-theme-text-disabled-on-dark: map-get($xep-shades, typography-3) !default;
-$mdc-theme-text-disabled-on-light: map-get($xep-shades, typography-3) !default;
-$mdc-theme-text-icon-on-dark: map-get($xep-shades, typography-1) !default;
-$mdc-theme-text-icon-on-light: map-get($xep-shades, typography-1) !default;
+$xep-colors: (
+  primary: #2284ff,
+  success: #3adb76,
+  warning: #ffae00,
+  alert: #cc4b37
+) !default;
+
+$xep-shades: (
+  typography: #fefefe,
+  typography-1: #b2b3b4,
+  typography-2: #8d9192,
+  typography-3: #7c8081,
+  typography-4: #616364,
+  background: #1b1e22,
+  background-1: #1f2327,
+  background-2: #282b2f,
+  background-3: #383b3f,
+  background-4: #44474b
+) !default;
+
+$xep-surface-border: map-get($xep-shades, background-3) !default;
+
+/* ============= MDC Color ============= */
+
+$mdc-theme-primary: map-get($xep-colors, primary) !default;
+$mdc-theme-secondary: map-get($xep-colors, success) !default;
+$mdc-theme-background: map-get($xep-shades, background) !default;
+$mdc-theme-surface: map-get($xep-shades, background-2) !default;
+$mdc-theme-on-primary: map-get($xep-shades, typography) !default;
+$mdc-theme-on-secondary: map-get($xep-shades, typography) !default;
+$mdc-theme-on-surface: map-get($xep-shades, typography-1) !default;
+
+$mdc-theme-text-primary-on-light: map-get($xep-colors, primary) !default;
+$mdc-theme-text-primary-on-dark: map-get($xep-colors, primary) !default;
+$mdc-theme-text-secondary-on-dark: map-get($xep-colors, success) !default;
+$mdc-theme-text-secondary-on-light: map-get($xep-colors, success) !default;
+$mdc-theme-text-hint-on-dark: map-get($xep-shades, typography-2) !default;
+$mdc-theme-text-hint-on-light: map-get($xep-shades, typography-2) !default;
+$mdc-theme-text-disabled-on-dark: map-get($xep-shades, typography-3) !default;
+$mdc-theme-text-disabled-on-light: map-get($xep-shades, typography-3) !default;
+$mdc-theme-text-icon-on-dark: map-get($xep-shades, typography-1) !default;
+$mdc-theme-text-icon-on-light: map-get($xep-shades, typography-1) !default;