add selected items css

diff --git a/front-end/src/component/result-filter/index.css b/front-end/src/component/result-filter/index.css
index dac40d17b65fd43e79e3e7d424693a9dfcf13ce6..bbb0cc60954d8f792a151bc15876ac9ac0862ca9 100644 (file)
--- a/front-end/src/component/result-filter/index.css
+++ b/front-end/src/component/result-filter/index.css
@@ -2,6 +2,12 @@
     width: 860px;
 }
 
+.selected_item > li{
+    float: left;
+    margin-left: 10px;
+    list-style-type:none;
+    border: 1px solid slateblue;
+}
 /* select */
 .select {
     padding: 5px 10px;

diff --git a/front-end/src/component/result-filter/index.jsx b/front-end/src/component/result-filter/index.jsx
index e93d859b5ead05035b416b88bb66acdef75ad1ac..936a8d5bcf839a8678a78e803d89d483fb06372a 100644 (file)
--- a/front-end/src/component/result-filter/index.jsx
+++ b/front-end/src/component/result-filter/index.jsx
@@ -75,7 +75,7 @@ class ResultFilter extends React.Component {
         let selected_item = _this.state.selected_items.map((s, index) => {
             // let is_high_light = index == 0 ? "select-all selected" :"select-all"
             return (
-                <p key={index}>{s}</p>
+                <li key={index}>{s} <a href="javascript:void(0)">x</a></li>
             )
         });
 
@@ -84,7 +84,8 @@ class ResultFilter extends React.Component {
             let filter_item = item["data"].map((s, index) => {
                 let is_high_light = index == 0 ? "select-all selected" : "select-all"
                 return (
-                    <dd onClick={(e) => this.selectItemClick(e)} key={index} data-name={s} className={is_high_light}><a href="#">{s}</a></dd>
+                    <dd onClick={(e) => this.selectItemClick(e)} key={index} data-name={s} className={is_high_light}><a
+                        href="#">{s}</a></dd>
                 )
             });
 
@@ -124,8 +125,13 @@ class ResultFilter extends React.Component {
                             </div>
                         </div>
                         <div id="panel1" className="panel-collapse collapse in">
-                            {selected_item}
+
                             <div className="panel-body">
+                                <ul className="selected_item">
+                                    {selected_item}
+                                </ul>
+
+
                                 <ul className="select">
 
                                     {filter}