入力/テキストエリアの枠線の色を変更する方法：focus？

Question

私が反応を使用して、私の追加のCSSの定義は（それが悪い習慣ではないことを願っています）このような定数としてのjsファイルで検索します：

const STYLE = { 
    logo: { 
     width: '206px', 
     height: '73px', 
     margin: '120px auto 0', 
     display: 'block' 
    }, 
    label: { 
     fontSize: 'x-small' 
    }, 
    control: { 
     border: 'solid', 
     borderWidth: '0 0 1px', 
     borderColor: '#E0E0E0', 
     width: '200px' 
    } 
}; 

export default class Home extends React.Component { 
    render() { 
     return (
      <div> 
       <img src='.../logo.gif' style={STYLE.logo}/> 
       <FormGroup> 
        <Col smOffset=...> 
         <Form horizontal> 
          <FormGroup> 
           <Col sm=... style={STYLE.label}> 
            Label: 
            <input style={STYLE.control} type="text"/> 
           </Col> 
          </FormGroup> 
         </Form> 
        </Col> 
       </FormGroup> 
      </div> 
     ) 
    } 
} 

私はと入力コンポーネントの周囲に境界線を削除したいですCSS。私は私のSTYLE.controlに次のCSSを追加する必要があります。

input:focus { 
    outline:none; 
} 

しかし、私はので（もちろん）、これは動作しないことを行うには方法がわからない：

const STYLE = { 
    noBorder: { 
     input:focus: 'outline:none' 
    } 
}; 

Answer 1

後私はこの問題を解決する最良の選択肢は、Radiumを使用しているようだ、リアクションのドキュメントでいくつかのスタイリングを行った。

Answer 2

render() { 
     return (
      <div> 
       <style> 
       input:focus { 
       outline: none; 
       } 
       </style>