<% include ../layout/head %>
<% let selected= (string)=>{
    return category.icon_type==string
} %>
<div class="container">
    <div class="row">
        <!-- FORM -->
        <div class="col-md-4 offset-md-3">
            <h2>Crear Categoría</h2>
            <div class="card">
                <div class="card-body">

                    <form action="/categories/edit/<%= category._id %>" method="post">
                        <div class="form-group">
                            <label for="exampleFormControlInput1">Category Name</label>
                            <input name="category_name" type="text" class="form-control" id="exampleFormControlInput1"
                                value='<%= category.category_name %>' placeholder="Entretainment">
                        </div>
                        <div class="form-group">
                            <label for="exampleFormControlInput1">Icon Name (see react native icons)</label>
                            <input name="icon_name" type="text" class="form-control" id="exampleFormControlInput1"
                                value="<%= category.icon_name %>" placeholder="umbrella">
                        </div>
                        <div class="form-group">
                            <label for="exampleFormControlSelect1">Icon Family</label>
                            <select name="icon_type" class="form-control" id="exampleFormControlSelect1">
                                <Option <%= selected('AntDesign') ?'selected':'' %>>AntDesign</Option>
                                <Option <%= selected('Ionicons') ?'selected':'' %>>Ionicons</Option>
                                <Option <%= selected('Entypo') ?'selected':'' %>>Entypo</Option>
                                <Option <%= selected('EvilIcons') ?'selected':'' %>>EvilIcons</Option>
                                <Option <%= selected('Feather') ?'selected':'' %>>Feather</Option>
                                <Option <%= selected('FontAwesome') ?'selected':'' %>>FontAwesome</Option>
                                <Option <%= selected('FontAwesome5') ?'selected':'' %>>FontAwesome5</Option>
                                <Option <%= selected('Foundation') ?'selected':'' %>>Foundation</Option>
                                <Option <%= selected('MaterialIcons') ?'selected':'' %>>MaterialIcons</Option>
                                <Option <%= selected('MaterialCommunityIcons') ?'selected':'' %>>MaterialCommunityIcons</Option>
                                <Option <%= selected('Octicons') ?'selected':'' %>>Octicons</Option>
                                <Option <%= selected('Roboto') ?'selected':'' %>>Roboto</Option>
                                <Option <%= selected('rubicon-icon-font') ?'selected':'' %>>rubicon-icon-font</Option>
                                <Option <%= selected('SimpleLineIcons') ?'selected':'' %>>SimpleLineIcons</Option>
                                <Option <%= selected('Zocial') ?'selected':'' %>>Zocial</Option>
                            </select>
                        </div>
                        <button type="submit" class="btn btn-block btn-primary">
                            Actualizar
                        </button>
                    </form>

                </div>
            </div>
        </div>

    </div>
</div>

<% include ../layout/foot %>