fix: button color in publish form

This commit is contained in:
Sean Yesmunt 2019-02-20 17:51:54 -05:00
parent 04115ac264
commit 87549a5a30
5 changed files with 45 additions and 30 deletions

View file

@ -34,7 +34,7 @@
"postinstall": "electron-builder install-app-deps && node build/downloadDaemon.js" "postinstall": "electron-builder install-app-deps && node build/downloadDaemon.js"
}, },
"dependencies": { "dependencies": {
"@lbry/components": "^2.2.3", "@lbry/components": "^2.2.4",
"@types/three": "^0.93.1", "@types/three": "^0.93.1",
"bluebird": "^3.5.1", "bluebird": "^3.5.1",
"breakdance": "^3.0.1", "breakdance": "^3.0.1",

View file

@ -168,11 +168,9 @@ export class FormField extends React.PureComponent<Props> {
input = ( input = (
<React.Fragment> <React.Fragment>
<fieldset-section> <fieldset-section>
{(label || errorMessage) && ( <label htmlFor={name}>
<label htmlFor={name}> {errorMessage ? <span className="error-text">{errorMessage}</span> : label}
{errorMessage ? <span className="error-text">{errorMessage}</span> : label} </label>
</label>
)}
{prefix && ( {prefix && (
<label className="form-field--inline-prefix" htmlFor={name}> <label className="form-field--inline-prefix" htmlFor={name}>
{prefix} {prefix}

View file

@ -53,35 +53,45 @@
} }
} }
.button--inverse { // This is a hack and the extra styles are just so this is more specific than the @lbry/components styling
// Will make a PR there, but just doing it now for the release - Sean
[type='button'].button--inverse {
font-size: 1rem; font-size: 1rem;
transition: background-color 0.2s; transition: background-color 0.2s;
border-radius: 0;
html[data-mode='dark'] & { html[data-mode='dark'] & {
border-color: rgba($lbry-white, 0.1); &:not(:hover) {
background-color: rgba($lbry-black, 0.3); border-color: rgba($lbry-white, 0.1);
} background-color: rgba($lbry-black, 0.3);
}
&:not(:hover) { &:hover {
background-color: $lbry-white; border-color: rgba($lbry-white, 0.1);
}
&:hover {
background-color: $lbry-gray-1;
color: $lbry-black;
html[data-mode='dark'] & {
background-color: rgba($lbry-white, 0.1); background-color: rgba($lbry-white, 0.1);
color: $lbry-white; color: $lbry-white;
} }
} }
html[data-mode='light'] & {
&:not(:hover) {
background-color: $lbry-white;
color: $lbry-black;
}
&:hover {
background-color: $lbry-gray-1;
color: $lbry-black;
}
}
.button__content { .button__content {
svg { svg {
color: $lbry-gray-4; color: $lbry-gray-4;
} }
} }
} }
.button--link:not(:disabled) { .button--link:not(:disabled) {
html[data-mode='dark'] & { html[data-mode='dark'] & {
&:not(:hover) { &:not(:hover) {

View file

@ -142,14 +142,21 @@ fieldset-group {
// form buttons are black by default // form buttons are black by default
form { form {
// [data-mode='dark'] & { [type='button'] {
.button--primary:not(:hover) { &.button--primary {
background-color: $lbry-teal-5; &:not(:hover) {
border-color: $lbry-teal-5; background-color: $lbry-teal-5;
border-color: $lbry-teal-5;
}
&:hover { &:hover {
background-color: $lbry-teal-3; background-color: $lbry-teal-3;
border-color: $lbry-teal-3; border-color: $lbry-teal-3;
}
}
&.button--inverse {
@extend .button--inverse;
} }
} }
} }

View file

@ -111,10 +111,10 @@
version "0.7.1" version "0.7.1"
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f" resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f"
"@lbry/components@^2.2.3": "@lbry/components@^2.2.4":
version "2.2.3" version "2.2.4"
resolved "https://registry.yarnpkg.com/@lbry/components/-/components-2.2.3.tgz#8823855bb4e011d2fc7497de03e6435e07757d6f" resolved "https://registry.yarnpkg.com/@lbry/components/-/components-2.2.4.tgz#ee2c91788de447ed33185daa7a747ba684e5143f"
integrity sha512-HONPvhjtvOBEaBTeHTIs0WFD1u3j9tprNTFTKa9zoI7ZLtbHnGqHM+Vi3Oq5xl8OQxEkgJNsHGUDtV4FLhcsHg== integrity sha512-SF0g4JROwYsvJc9fEFmAYAj9cITJ9L2MTkWCs9vfPhDS4iXE6ZW5VNtcxI5JOVAvsZMRHq5oX9EtjxHs1pIIdg==
"@mapbox/hast-util-table-cell-style@^0.1.3": "@mapbox/hast-util-table-cell-style@^0.1.3":
version "0.1.3" version "0.1.3"