@extends('layouts.master')

@section('content')

@if (session()->has('message'))
<div class="row">
        <!-- left column -->
        <div class="col-md-2"></div>
<div class="col-md-4 alert alert-success alert-dismissible" style="font-size:18px;font-weight:bold;width:400px;margin-left:15px">
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                {!! session('message') !!}
              </div>
              </div> 
@endif


<div class="row">
        <!-- left column -->
        <div class="col-md-2"></div>
        <div class="col-md-8">
          <!-- general form elements -->
          <div class="box box-primary">
            <div class="box-header with-border">
              <h3 class="box-title">Add New Public Message For Suppervisors   </h3>
            </div>
            <!-- /.box-header -->
            <!-- form start -->
            <form   role="form" method="POST" action="{{ url('/message/create') }}">
                        {{ csrf_field() }}
              <div class="box-body">
                
                
                <div class="form-group">
                  <label for="exampleInputPassword1">Message title  </label>
                  <input type="text" name="title" class="form-control"  placeholder="Message title" required>
                </div>


                <div class="form-group">
                  <label for="exampleInputPassword1">Message body</label>
                  <input type="text" name="body" class="form-control"  placeholder="Message body " required>
                </div>


                <div class="form-group">
                <label>Status   
                  <span style="background-color: #bae6fd;margin-left: 10px;border-width: 5px;border-style: solid;border-color: #bae6fd;border-radius: 22%;"> info   </span>
                  <span style="background-color: #bbf7d0;margin-left: 10px;border-width: 5px;border-style: solid;border-color: #bbf7d0;border-radius: 22%;"> success </span>
                  <span style="background-color: #fed7aa;margin-left: 10px;border-width: 5px;border-style: solid;border-color: #fed7aa;border-radius: 22%;"> warning </span>
                  <span style="background-color: #fecaca;margin-left: 10px;border-width: 5px;border-style: solid;border-color: #fecaca;border-radius: 22%;"> error </span>
              </label>
                <select class="form-control select2"  style="width: 100%;" name="status" id="status" required>
                 
                  <option value="info" > info</option>
                  <option value="success"> success</option>
                  <option value="warning"> warning</option>
                  <option value="error"> error</option>
                  
                </select>
                </div>
                     
              </div>
              <!-- /.box-body -->

              <div class="box-footer">
                <button type="submit" class="btn btn-primary">Save</button>
              </div>
            </form>
          </div>    
</div>
         
      </div>

@endsection