cleanup and styling , wip

web/pages/components/config/form-textfield.tsx

@@ -14,15 +14,6 @@ save to local state/context.
 read vals from there.
 update vals to state, andthru api.
 
-TODO
-- no on blur
-- no onEnter
-- if values chnage, then show "submit" button next to it
-  - on blur hide submit button. on submit success, hide button, blur out?
-  - esc key to reset + blur?
-
-- if field clears, repop with orig value, if no orig vlaue, pop with default
-
 
 */
 import React, { useState, useContext } from 'react';

web/pages/components/config/public-facing-details.tsx

@@ -45,7 +45,7 @@ export default function PublicFacingDetails() {
             <TextField fieldName="streamTitle" {...extraProps} />
           </Form>
         </div>
-        <div className="misc-optionals">
+        <div className="misc-fields">
           add social handles comp
           <br/>
           add tags comp

web/styles/config.scss

@@ -1,16 +1,33 @@
 
-
+.ant-btn-primary:hover, .ant-btn-primary:focus {
+  background-color: white;
+  color: #40a9ff;
+}
+.ant-btn-primary:focus {
+  box-shadow: 0px 1px 3px 2px rgba(90,103,216, .25)
+}
+.ant-input-affix-wrapper,
+.ant-btn {
+  transition-delay: 0s;
+  transition-duration: 0.15s;
+}
 .config-public-details-container {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
+  flex-wrap: wrap;
 
   .text-fields {
-    margin-right: 1rem;
+    margin-right: 2rem;
+  }
+
+  .misc-fields {
+    border: 1px solid var(--owncast-purple);
+    padding: 2em;
+
   }
 }
 .textfield-container {
-  // width: 28rem;
   display: flex;
   flex-direction: column;
   align-items: flex-end;

web/types/config-section.ts

@@ -1,9 +1,9 @@
 // TS types for elements on the Config pages
 
 export interface TextFieldProps {
-  onUpdate: ({ fieldName, value }: UpdateArgs) => void;
+  handleResetValue: ({ fieldName }) => void;
   fieldName: string;
-  initialValue: string;
+  initialValues: any;
   type: string;
 }