fix: button color in publish form

package.json

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

src/renderer/component/common/form-components/form-field.jsx

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

src/renderer/scss/component/_button.scss

@@ -53,26 +53,35 @@
   }
 }
 
-.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;
   transition: background-color 0.2s;
+  border-radius: 0;
 
   html[data-mode='dark'] & {
+    &:not(:hover) {
       border-color: rgba($lbry-white, 0.1);
       background-color: rgba($lbry-black, 0.3);
     }
 
+    &:hover {
+      border-color: rgba($lbry-white, 0.1);
+      background-color: rgba($lbry-white, 0.1);
+      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;
-
-    html[data-mode='dark'] & {
-      background-color: rgba($lbry-white, 0.1);
-      color: $lbry-white;
     }
   }
 
@@ -82,6 +91,7 @@
     }
   }
 }
+
 .button--link:not(:disabled) {
   html[data-mode='dark'] & {
     &:not(:hover) {

src/renderer/scss/component/_form-field.scss

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

yarn.lock

@@ -111,10 +111,10 @@
   version "0.7.1"
   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":
   version "0.1.3"