@aws-amplify/ui 2.0.4-unstable.99 → 3.0.0

package/src/Button.css.d.ts

@@ -1,10 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const button: string;
-export const signInButton: string;
-export const googleSignInButton: string;
-export const signInButtonIcon: string;
-export const auth0SignInButton: string;
-export const facebookSignInButton: string;
-export const amazonSignInButton: string;
-export const oAuthSignInButton: string;
-export const signInButtonContent: string;

package/src/Form.css

@@ -1,43 +0,0 @@
-@import './Theme.css';
-
-.formContainer {
-  text-align: center;
-  margin-top: 20px;
-  margin: 5% auto 50px;
-}
-
-.formSection {
-  position: relative;
-  margin-bottom: 20px;
-  background-color: var(--form-color);
-  padding: 35px 40px;
-  text-align: left;
-  display: inline-block;
-  min-width: 460px;
-  border-radius: 6px;
-  box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.15);
-  box-sizing: border-box;
-}
-
-.formField {
-  margin-bottom: 22px;
-}
-
-.formRow {
-  margin-bottom: 12px;
-}
-
-@media only screen and (max-width: 599px) {
-  .formContainer {
-    margin: 0;
-  }
-
-  .formSection {
-    width: 100%;
-    box-sizing: border-box;
-    padding: 35px 25px;
-    box-shadow: none;
-    border-radius: 0;
-    min-width: auto;
-  }
-}

package/src/Form.css.d.ts

@@ -1,5 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const formContainer: string;
-export const formSection: string;
-export const formField: string;
-export const formRow: string;

package/src/Hint.css

@@ -1,6 +0,0 @@
-@import './Theme.css';
-
-.hint {
-  color: var(--grey);
-  font-size: 12px;
-}

package/src/Hint.css.d.ts

@@ -1,2 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const hint: string;

package/src/Input.css

@@ -1,41 +0,0 @@
-@import './Theme.css';
-
-.input {
-  display: block;
-  width: 100%;
-  padding: 16px;
-  font-size: 14px;
-  color: var(--input-color);
-  background-color: var(--input-background-color);
-  background-image: none;
-  border: 1px solid var(--lightGrey);
-  border-radius: 3px;
-  box-sizing: border-box;
-  margin-bottom: 10px;
-}
-
-.input:disabled {
-  color: #545454;
-  background-color: var(--silver);
-}
-
-.inputLabel {
-  color: var(--input-color);
-  font-size: 14px;
-  margin-bottom: 8px;
-}
-
-.label {
-  color: var(--input-color);
-}
-
-.radio {
-  margin-right: 18px;
-  vertical-align: bottom;
-}
-
-@media only screen and (max-width: 599px) {
-  .input {
-    font-size: 16px;
-  }
-}

package/src/Input.css.d.ts

@@ -1,5 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const input: string;
-export const inputLabel: string;
-export const label: string;
-export const radio: string;

package/src/Nav.css

@@ -1,21 +0,0 @@
-.navBar {
-  position: relative;
-  border: 1px solid transparent;
-  border-color: #e7e7e7;
-  background-color: #fff;
-}
-
-.navRight {
-  text-align: right
-}
-
-.nav {
-  padding: 10px;
-}
-
-.navItem {
-  display: inline-block;
-  padding: 10px 5px;
-  line-height: 20px;
-  margin-right: 12px;
-}

package/src/Nav.css.d.ts

@@ -1,5 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const navBar: string;
-export const navRight: string;
-export const nav: string;
-export const navItem: string;

package/src/PhotoPicker.css

@@ -1,15 +0,0 @@
-@import './Theme.css';
-
-.photoPickerButton {
-  width: 100%;
-}
-
-.photoPlaceholder {
-  border: 2px dotted var(--grey);
-  padding: 64px 0 64px;
-}
-
-.photoPlaceholderIcon {
-  text-align: center;
-  opacity: 0.2;
-}

package/src/PhotoPicker.css.d.ts

@@ -1,4 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const photoPickerButton: string;
-export const photoPlaceholder: string;
-export const photoPlaceholderIcon: string;

package/src/Section.css

@@ -1,67 +0,0 @@
-@import './Theme.css';
-
-.container {
-	font-weight: 400;
-}
-
-.actionRow {
-	margin-bottom: 15px;
-}
-
-.sectionHeader {
-	color: var(--deepSquidInk);
-	margin-bottom: 24px;
-	font-size: 18px;
-	font-weight: 500;
-}
-
-.sectionHeaderHint {
-	color: var(--grey);
-	font-size: 16px;
-	font-weight: 400;
-	margin-top: 4px;
-}
-
-.sectionBody {
-	margin-bottom: 30px;
-}
-
-.sectionHeaderContent {
-}
-
-.sectionFooter {
-	font-size: 14px;
-	color: var(--grey);
-	display: flex;
-	flex-direction: row-reverse;
-	align-items: flex-start;
-}
-
-.sectionFooterPrimaryContent {
-	margin-left: auto;
-}
-
-.sectionFooterSecondaryContent {
-	margin-right: auto;
-	align-self: center;
-}
-
-@media only screen and (max-width: 599px) {
-	.sectionFooter {
-		flex-wrap: wrap;
-	}
-
-	.sectionFooterPrimaryContent {
-		width: 100%;
-		margin-bottom: 32px;
-	}
-
-	.sectionFooterPrimaryContent > button {
-		width: 100%;
-	}
-
-	.sectionFooterSecondaryContent {
-		text-align: center;
-		flex: 0 0 100%;
-	}
-}

package/src/Section.css.d.ts

@@ -1,10 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const container: string;
-export const actionRow: string;
-export const sectionHeader: string;
-export const sectionHeaderHint: string;
-export const sectionBody: string;
-export const sectionHeaderContent: string;
-export const sectionFooter: string;
-export const sectionFooterPrimaryContent: string;
-export const sectionFooterSecondaryContent: string;

package/src/SelectInput.css

@@ -1,36 +0,0 @@
-@import './Theme.css';
-
-.selectInput {
-	display: flex;
-}
-
-.selectInput > input {
-	flex: 1;
-	border-radius: 0 3px 3px 0 !important;
-}
-
-.selectInput > select {
-	padding: 16px 20px 16px 16px;
-	font-size: 14px;
-	color: var(--deepSquidInk);
-	background-color: #fff;
-	background-image: none;
-	border: 1px solid var(--lightGrey);
-	border-right: none;
-	border-radius: 3px 0 0 3px;
-	box-sizing: border-box;
-	margin-bottom: 10px;
-	-webkit-appearance: none;
-	-moz-appearance: none;
-	appearance: none;
-	flex-basis: 22%;
-	width: 1%;
-
-	background-image: linear-gradient(45deg, transparent 50%, gray 50%),
-		linear-gradient(135deg, gray 50%, transparent 50%),
-		linear-gradient(to right, #ccc, #ccc);
-	background-position: calc(100% - 10px) calc(1em + 8px),
-		calc(100% - 4px) calc(1em + 8px), calc(100% - 2.5em) 0.5em;
-	background-size: 6px 5px, 6px 5px, 0px 1.5em;
-	background-repeat: no-repeat;
-}

package/src/SelectInput.css.d.ts

@@ -1,2 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const selectInput: string;

package/src/Strike.css

@@ -1,17 +0,0 @@
-@import './Theme.css';
-
-.strike {
-  width: 100%;
-  text-align: center;
-  border-bottom: 1px solid var(--lightGrey); 
-  line-height: 0.1em;
-  margin: 32px 0;
-  color: var(--grey);
-}
-
-.strikeContent {
-  background: var(--form-color); 
-  padding: 0 25px;
-  font-size: 14px;
-  font-weight: 500;
-}

package/src/Strike.css.d.ts

@@ -1,3 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const strike: string;
-export const strikeContent: string;

package/src/Theme.css

@@ -1,150 +0,0 @@
-/*
- * Copyright 2018 Amazon.com, Inc. or its affiliates. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance with
- * the License. A copy of the License is located at
- *
- *     http://aws.amazon.com/apache2.0/
- *
- * or in the "license" file accompanying this file. This file is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
- * CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions
- * and limitations under the License.
- */
-:root {
-
-  /* Colors */
-  --amazonOrange: #FF9900;
-  --lightAmazonOrange: #FFAC31;
-  --darkAmazonOrange: #E88B01;
-  --squidInk: #232F3E;
-  --lightSquidInk: #31465F;
-  --deepSquidInk: #152939;
-  --grey: #828282;
-  --lightGrey: #C4C4C4;
-  --silver: #E1E4EA;
-  --darkBlue: #31465F;
-  --red: #DD3F5B;
-  --white: #FFFFFF;
-  --light-blue: #00a1c9;
-  
-
-  /* Theme */
-  --button-color: var(--white);
-  --button-background-color: var(--amazonOrange);
-  --button-click: var(--darkAmazonOrange);
-  --link-color: var(--amazonOrange);
-  --form-color: var(--white);
-  --input-color: var(--deepSquidInk);
-  --input-background-color: var(--white);
-
-  --font-family: "Amazon Ember","Helvetica Neue Light","Helvetica Neue","Helvetica" ,"Arial","sans-serif";
-  --body-background: #F8F4F4;
-
-  /** Angular Theme **/
-  --component-width-desktop: 460px;
-  --component-width-mobile: 100%;
-
-  --color-primary: #FF9900;
-  --color-primary-accent: #232F3E;
-  --color-primary-highlight: #FFC46D;
-  
-  --color-background:#232F3E;
-
-  --color-secondary: #152939;
-  --color-secondary-accent: #31465F;
-
-  --color-danger: #DD3F5B;
-  --color-error: #D0021B;
-
-  --color-accent-brown: #828282;
-  --color-accent-blue: #E1E4EA;
-
-  --gradient-blaze: linear-gradient(270deg, #FFC300 0%, #FF9000 100%);
-
-  --color-blue: #007EB9;
-  --color-purple: #527FFF;
-  --color-gray: #828282;
-  --color-white: #FFFFFF;
-
-  --input-border: 1px solid #C4C4C4;
-  --input-padding: 0.5em 0.5em 0.3em 1em;
-
-  --box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.15);
-  --button-height: 42px;
-
-  --interactions-conversation-height: 250px;
-
-  /* Ionic Theme */
-  
-  /** primary **/
-  --ion-color-primary: #FF9900;
-  --ion-color-primary-rgb: 255,153,0;
-  --ion-color-primary-contrast: #fff;
-  --ion-color-primary-contrast-rgb: 255,255,255;
-  --ion-color-primary-shade: #232F3E;
-  --ion-color-primary-tint: #FFC46D;
-
-  /** secondary **/
-  --ion-color-secondary: #32db64;
-  --ion-color-secondary-rgb: 50,219,100;
-  --ion-color-secondary-contrast: #fff;
-  --ion-color-secondary-contrast-rgb: 255,255,255;
-  --ion-color-secondary-shade: #2cc158;
-  --ion-color-secondary-tint: #47df74;
-
-  /** tertiary **/
-  --ion-color-tertiary: #f4a942;
-  --ion-color-tertiary-rgb: 244,169,66;
-  --ion-color-tertiary-contrast: #fff;
-  --ion-color-tertiary-contrast-rgb: 255,255,255;
-  --ion-color-tertiary-shade: #d7953a;
-  --ion-color-tertiary-tint: #f5b255;
-
-  /** success **/
-  --ion-color-success: #10dc60;
-  --ion-color-success-rgb: 16,220,96;
-  --ion-color-success-contrast: #fff;
-  --ion-color-success-contrast-rgb: 255,255,255;
-  --ion-color-success-shade: #0ec254;
-  --ion-color-success-tint: #28e070;
-
-  /** warning **/
-  --ion-color-warning: #ffce00;
-  --ion-color-warning-rgb: 255,206,0;
-  --ion-color-warning-contrast: #000;
-  --ion-color-warning-contrast-rgb: 0,0,0;
-  --ion-color-warning-shade: #e0b500;
-  --ion-color-warning-tint: #ffd31a;
-
-  /** danger **/
-  --ion-color-danger: #f53d3d;
-  --ion-color-danger-rgb: 245,61,61;
-  --ion-color-danger-contrast: #fff;
-  --ion-color-danger-contrast-rgb: 255,255,255;
-  --ion-color-danger-shade: #d83636;
-  --ion-color-danger-tint: #f65050;
-
-  /** light **/
-  --ion-color-light: #f4f4f4;
-  --ion-color-light-rgb: 244,244,244;
-  --ion-color-light-contrast: #000;
-  --ion-color-light-contrast-rgb: 0,0,0;
-  --ion-color-light-shade: #d7d7d7;
-  --ion-color-light-tint: #f5f5f5;
-
-  /** medium **/
-  --ion-color-medium: #989aa2;
-  --ion-color-medium-rgb: 152,154,162;
-  --ion-color-medium-contrast: #000;
-  --ion-color-medium-contrast-rgb: 0,0,0;
-  --ion-color-medium-shade: #86888f;
-  --ion-color-medium-tint: #a2a4ab;
-  
-  /** dark **/
-  --ion-color-dark: #222;
-  --ion-color-dark-rgb: 34,34,34;
-  --ion-color-dark-contrast: #fff;
-  --ion-color-dark-contrast-rgb: 255,255,255;
-  --ion-color-dark-shade: #1e1e1e;
-  --ion-color-dark-tint: #383838;
-}

package/src/Toast.css

@@ -1,63 +0,0 @@
-@import './Theme.css';
-
-.toast {
-  display: flex;
-  justify-content: space-between;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  z-index: 99;
-  box-shadow: 0 0 5px 0 rgba(0,0,0,0.3);
-  padding: 16px;
-  background-color: var(--lightSquidInk);
-  font-size: 14px;
-  color: #fff;
-  box-sizing: border-box;
-}
-
-.toast > span {
-  margin-right: 10px;
-}
-
-.toastClose {
-  margin-left: auto;
-  align-self: center;
-  position: relative;
-  width: 18px;
-  height: 18px;
-  overflow: hidden;
-  cursor: pointer;
-}
-
-.toastClose::before,
-.toastClose::after {
-  content: '';
-  position: absolute;
-  height: 2px;
-  width: 100%;
-  top: 50%;
-  left: 0;
-  margin-top: -1px;
-  background: var(--lightGrey);
-}
-
-.toastClose:hover::before,
-.toastClose:hover::after {
-  background: var(--red);
-}
-
-.toastClose::before {
-  -webkit-transform: rotate(45deg);
-  -moz-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  -o-transform: rotate(45deg);
-  transform: rotate(45deg);
-}
-.toastClose::after {
-  -webkit-transform: rotate(-45deg);
-  -moz-transform: rotate(-45deg);
-  -ms-transform: rotate(-45deg);
-  -o-transform: rotate(-45deg);
-  transform: rotate(-45deg);
-}

package/src/Toast.css.d.ts

@@ -1,3 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const toast: string;
-export const toastClose: string;

package/src/Totp.css

@@ -1,4 +0,0 @@
-.totpQrcode {
-  text-align: center;
-  margin-bottom: 30px;
-}

package/src/Totp.css.d.ts

@@ -1,2 +0,0 @@
-// AUTOMATICALLY GENERATED - DO NOT EDIT
-export const totpQrcode: string;