JSFiddle - React, Tailwind, and code Playground

Config Windows

by Dug Sohn

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://yakabod.yakabox.com/css/scss/themes/darkly/ui_dark.css">
<div >
<div class="modal fade in" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: block;">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
        <h4 class="modal-title" id="myModalLabel">Setup Digital Signature Field</h4>
      </div>
      <div class="modal-body clearfix">
      <div class="row">
      <div class="col-12">
       <div class="alert alert-warning">
         When placed within a form container, the signatory is validating the informationly within the container itself, all container fields will be locked after a signature is provided
       </div>
      </div>
       <div class="col-12">
       <div class="alert alert-info">
         Once a signatory provides a valid digital singature all fields on this form will be locked. 
       </div>
      </div>
      </div>
        <div class="row">
          <div class="col-xs-12 col-sm-12">
            <form class="form-horizontal">
            <div class="row">
              <div class="form-group">
                <label class="control-label col-xs-4 text-right" title="Field Label">Label</label>
                <div class="col-xs-6">
                  <input type="text" id="e" class="form-control">
                </div>
              </div>
              
            </div>
            <div class="row">
              <div class="form-group">
                <label class="control-label...

SCSS

.text-right {
  text-align:right;
}
 
 
  .modal-dialog {
    max-width:600px;
  }