@extends('layouts.mainlay')
@section('title','أسئلة المتداولة')
@section('content')
	<div style="height: 130px"></div>
	<div class="about-box" style="text-align: right; padding:1%">
	    <div class="container">
            <div class="allstorydiv" style="margin-top: 20px">
                @foreach($commonQ as $item)
                    <div style="border-bottom:dashed 1px #555; margin-bottom: 5px; width:95%">
                        <div style="margin-bottom: 3px;">
                        <div onclick="tooganswer({{$loop->index}})" style="color:#0067b8; font-size: 25px; cursor: pointer;">{{$item->cquestionText}} <i id ="ianswer-{{$loop->index}}" class="fa fa-plus-circle" aria-hidden="true"> </i> </div>
                        </div>
                        <div id="answer-{{$loop->index}}" style="margin-left:0px;margin-right: 60px; display:none">{{$item->cquestionAnswer}}<br></div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
@endsection
@section('scriptadded')
    <script>
        function tooganswer(index){
            //="ianswer-$loop->index}}"
            //-$loop->index}}
            $('#answer-'+index).toggle();
            if($('#ianswer-'+index).hasClass('fa-plus-circle')){
                $('#ianswer-'+index).removeClass('fa-plus-circle').addClass('fa-minus-circle')
            }else{
                $('#ianswer-'+index).removeClass('fa-minus-circle').addClass('fa-plus-circle')
            }

        }
     
    </script>   
@endsection