asked    Ruby     2018-10-22       javascript       22 view        2 Answers

[SOLVED] Sliding Menu in React

I want to create a file separator styled menu in react. I'm not very familiar with css, so i need a starting point. I have found many such menu components but all of them are full page.

I dont understand how to create the shape of the component, if it were a simple rectangle it would be possible, but the shape is the rectangle plus the button, i dont know how to manage that.

It will look something like this :

Filter Menu is hidden until clicked on

Alter clicking on "Filter Menu", it will slide into view:

Filter Menu slides into view

  2 Answers  

        answered    Nat     2018-10-22      

That is actually a CSS/HTML only question. However, to develop from scratch:

  • Draw a two column table and have the button in the second field

Or

  • Use Div containers and style them accordingly

Side Note: Usually you'd use something like bootstrap or even ant.design. There you have ready to use table components with possibility to filter (at least with ant.design) and for the filter seection popup you could use stuff like the modal component.



        answered    Samantha     2018-10-22      

Try like this

.menu-container {
  display: inline-block;
  position: fixed;
  top: 30%;
  left: 0;
}
.menu-body {
  display: inline-block;
  height: 200px;
  width: 100px;
  border: 1px solid black;
}
.activate-button {
  display: inline-block;
  height: 50px;
  width: 20px;
  border: 1px solid black;
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
  vertical-align: top;
}
<div>
  <div class="menu-container">
    <div class="menu-body">
      
    </div>
    <div class="activate-button">
      
    </div>
  </div>
<div>




Your Answer





 2018-10-22         Clement

Scrolling in ListView loses text color and typeface

I'm not sure why it's not working, but what my code should do is very simple.I have a ListView with default text color (BLACK) and typeface (MONOSPACE) that I declared in getView(), so everything works well when the view is created.When I select an item from the list it should change the text color to RED and the typeface to MONOSPACE and BOLD, and if I click another item, it will change that item to RED and BOLD and return the previous text to BLACK and NORMAL. This works just fine, but if I scroll away from the RED and BOLD text until it's not visible, and then scroll bac...
 java                     1 answers                     102 view
 2018-10-22         Chloe

PHP continues loop inside loop

I have a repeated row which have 5 columns. I want when every time row is looped column data is looped number but continues after every loop. Sample code:$list = 0;$list++;for ($i = 0; $i < 5; $i++ ){<div class="row"> <div class="col-2">$list</div> <div class="col-2">$list</div> <div class="col-2">$list</div> <div class="col-2">$list</div> <div class="col-2">$list</div></div>}Sample result what i want:<div class="row"> <div class="col-2">1</div> <div class="col-2">...
 php                     3 answers                     107 view
 2018-10-22         Ronald

Add all duplicate values in mysqli

I have an tabel trade as following:- bm | m | price | amount | status USD|BTC| 0.01 | 1 | active USD|BTC| 0.01 | 2.5 | active USD|BTC| 0.4 | 0.5 | active USD|BTC| 0.4 | 0.22 | activeI want to add amounts of duplicate price i.e 0.01 and 0.4 where status is active and show them so that the result is like:- price | amount 0.01 | 3.5 0.4 | 0.722I have tried an php query for showing but it shows values and rows as it is. Help please. Simply do a GROUP BY, use SUM() to calculate the sum for each price!select price, sum(amount)from tablenameWHERE bm = 'usd...
 php                     1 answers                     105 view