@extends('_layouts.app-public')

@section('content')
  <div class="content-wrapper page-tools">
    <div class="content-header">
      <div class="container">
        <div class="row">
          <div class="col-md-12">
            <button class="btn btn-outline-secondary" onclick="window.history.back()">
              <i class="fa fa-chevron-left"></i> Back
            </button>
          </div>
          <div class="col-md-12">
            <h1 class="mt-3 text-center">Text Diff Checker</h1>
          </div>
        </div>
      </div>
    </div>
    <div class="content page-text-diff-checker">
      <div class="container">
        <div class="row">
          <div class="col-md-12">
            <div class="card">
              <div id="form-error"></div>
              <div class="card-body">
                <form method="post" action="" id="form-text-diff-checker">
                  <div class="row mb-4">
                    <div class="col-md-6">
                      <label for="original_text">Original text</label>
                      <textarea name="original_text" id="original_text" class="form-control" rows="15"></textarea>
                    </div>
                    <div class="col-md-6">
                      <label for="modified_text">Modified text</label>
                      <textarea name="modified_text" id="modified_text" class="form-control" rows="15"></textarea>
                    </div>
                    <div class="col-md-12 mt-4 text-center">
                      <button type="submit" class="btn btn-lg btn-primary">Compare</button>
                    </div>
                  </div>
                </form>
                <div class="row">
                  <div class="col-md-12">
                    <div id="text-diff-checker-result"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('title')
  Text Diff Checker
@endsection