[CORL-503] More stable CSS classNames (#2477)

* feat: add more css classnames

* fix: snapshots
This commit is contained in:
Vinh
2019-08-20 19:22:58 +00:00
committed by Wyatt Johnson
parent b9f9e9b2d4
commit f3e615a610
72 changed files with 1106 additions and 184 deletions
@@ -149,6 +149,8 @@ Your email address will be used to:
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -325,6 +327,8 @@ Your email address will be used to:
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -495,6 +499,8 @@ Your email address will be used to:
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -675,6 +681,8 @@ Your email address will be used to:
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -839,6 +847,8 @@ GraphQL request (4:3)
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -989,6 +999,8 @@ Your email address will be used to:
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -82,6 +82,8 @@ we require users to create a password.
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -185,6 +187,8 @@ we require users to create a password.
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -285,6 +289,8 @@ we require users to create a password.
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -382,6 +388,8 @@ GraphQL request (4:3)
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -465,6 +473,8 @@ we require users to create a password.
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -59,6 +59,8 @@ exports[`checks for invalid username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -139,6 +141,8 @@ exports[`renders createUsername view 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -216,6 +220,8 @@ exports[`shows error when submitting empty form 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -290,6 +296,8 @@ GraphQL request (4:3)
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -350,6 +358,8 @@ exports[`successfully sets username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -79,6 +79,8 @@ reset your password.
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
data-color="primary"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -112,6 +112,8 @@ exports[`accepts correct password 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -246,6 +248,8 @@ exports[`accepts valid email 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -374,6 +378,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -411,6 +417,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular FacebookButton-colorRegular Button-variantFilled FacebookButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -437,6 +445,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular GoogleButton-colorRegular Button-variantFilled GoogleButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -463,6 +473,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular OIDCButton-colorRegular Button-variantFilled OIDCButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -493,6 +505,8 @@ exports[`auth configuration renders only some social login enabled 1`] = `
>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular FacebookButton-colorRegular Button-variantFilled FacebookButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -519,6 +533,8 @@ exports[`auth configuration renders only some social login enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular GoogleButton-colorRegular Button-variantFilled GoogleButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -673,6 +689,8 @@ exports[`checks for invalid email 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -842,6 +860,8 @@ exports[`renders sign in view 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1024,6 +1044,8 @@ exports[`renders sign in view with error 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1177,6 +1199,8 @@ exports[`shows error when submitting empty form 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1305,6 +1329,8 @@ exports[`shows server error 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1426,6 +1452,8 @@ exports[`submits form successfully 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -153,6 +153,8 @@ exports[`accepts correct password 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -333,6 +335,8 @@ exports[`accepts valid email 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -513,6 +517,8 @@ exports[`accepts valid username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -667,6 +673,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -704,6 +712,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular FacebookButton-colorRegular Button-variantFilled FacebookButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -730,6 +740,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular GoogleButton-colorRegular Button-variantFilled GoogleButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -756,6 +768,8 @@ exports[`auth configuration renders all auth enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular OIDCButton-colorRegular Button-variantFilled OIDCButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -786,6 +800,8 @@ exports[`auth configuration renders only some social login enabled 1`] = `
>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular FacebookButton-colorRegular Button-variantFilled FacebookButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -812,6 +828,8 @@ exports[`auth configuration renders only some social login enabled 1`] = `
</button>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorRegular GoogleButton-colorRegular Button-variantFilled GoogleButton-variantFilled Button-fullWidth"
data-color="regular"
data-variant="filled"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
@@ -1007,6 +1025,8 @@ exports[`checks for invalid characters in username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1200,6 +1220,8 @@ exports[`checks for invalid email 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1393,6 +1415,8 @@ exports[`checks for too long username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1586,6 +1610,8 @@ exports[`checks for too short password 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1779,6 +1805,8 @@ exports[`checks for too short username 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -1974,6 +2002,8 @@ exports[`renders sign up form 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -2170,6 +2200,8 @@ exports[`shows error when submitting empty form 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -2331,6 +2363,8 @@ exports[`shows server error 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}
@@ -2485,6 +2519,8 @@ exports[`submits form successfully 1`] = `
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorBrand Button-variantFilled Button-fullWidth"
data-color="brand"
data-variant="filled"
disabled={false}
onBlur={[Function]}
onFocus={[Function]}