delete button

jh-changes
Shin'ya Ueoka 7 years ago
parent 2641183a5b
commit bbad1c6c6a
  1. 6
      src/settings/components/form/search-engine-form.jsx
  2. 12
      src/settings/components/form/search-engine-form.scss
  3. 12
      src/settings/components/ui/delete-button.jsx
  4. 12
      src/settings/components/ui/delete-button.scss

@ -1,5 +1,6 @@
import { h, Component } from 'preact';
import './search-engine-form.scss'; import './search-engine-form.scss';
import { h, Component } from 'preact';
import DeleteButton from '../ui/delete-button';
class SearchEngineForm extends Component { class SearchEngineForm extends Component {
@ -33,8 +34,7 @@ class SearchEngineForm extends Component {
<input data-index={index} type='radio' name='default' <input data-index={index} type='radio' name='default'
checked={defaultEngine === engine[0]} checked={defaultEngine === engine[0]}
onChange={this.bindValue.bind(this)} /> onChange={this.bindValue.bind(this)} />
<input data-index={index} type='button' name='delete' <DeleteButton data-index={index} name='delete'
value='&#x2716;'
onClick={this.bindValue.bind(this)} /> onClick={this.bindValue.bind(this)} />
</div> </div>
</div>; </div>;

@ -22,17 +22,5 @@
&-row { &-row {
@include row-base; @include row-base;
.column-option input[type='button'] {
border: none;
padding: 4;
display: inline;
background: none;
color: red;
&:hover {
color: darkred;
}
}
} }
} }

@ -0,0 +1,12 @@
import './delete-button.scss';
import { h, Component } from 'preact';
class DeleteButton extends Component {
render() {
return <input
className='ui-delete-button' type='button' value='&#x2716;'
{...this.props} />;
}
}
export default DeleteButton;

@ -0,0 +1,12 @@
.ui-delete-button {
border: none;
padding: 4;
display: inline;
background: none;
color: red;
&:hover {
color: darkred;
}
}