JSFiddle - React, Tailwind, and code Playground

by talamusiclover

HTML

<!DOCTYPE>
<html ng-app="myApp">

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<link rel="stylesheet" type="text/css" href="C:\Users\etashah\Desktop\email.css">

<div class="container" >
<div class="row">
    <div class="col-md-4"></div>
<div class="col-md-4">
    	<form name="myForm" ng-controller="emailController">
          <div class="form-group1" >
            <label for="exampleInputEmail1">Contacts</label>
            <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email" ng-model="email.text" >
          </div>
          <div role="alert">
              <span class="error alert" ng-show="myForm.$error.required">
                Required!</span>
              <span class="error alert" ng-show="myForm.$error.email">
                Not valid email!</span>
          </div>

      <div class="form-group2">
        <label for="subject">Subject</label>
        <input type="text" class="form-control" id="subject" placeholder="Subject">
      </div>
      <div class="form-group3">
        <label for="message">Message</label>
        <textarea class="form-control" id="message"></textarea>
      </div>
      <div class="blueBox">
          <div class="form-group"> 
            <div class="col-sm-offset-8 col-sm-10">
              <div class="checkbox">
                <label class="checkboxLable"><input type="checkbox">Save a copy</label>
              </div>
            </div>
          </div>
          <div class= "button">
            <div class="col-sm-u-8 col-sm-10">
              <button type="button" class="btn btn-primary">Send</button>
            </div>
          </div>
          <div style="clear: both;"></div>
      </div>
    </form>
</div>
        <div class="col-md-4"></div>
    </div>

    <br><br><br>
</div>
    <script src=...

CSS

body{


	
	background:#F0FFFF  ;
	
}

.button	{

color: #4CAF50;
font-size: 25px;
border-radius: 30px;
color: black;
position:relative;
right: 10px;
bottom: 30px;

}


.form-group1 {
    padding-top: 70px;
    
    
}

.form-group2 {
    padding-top: 10px;
    
    
}

.form-group3 {
    padding-top: 10px;
    
    
}


.form-control {
    border-color: blue;
    
}

.blueBox {

	background-color : #00FFFF;



}

JavaScript

var myApp = angular.module('myApp', []);

    myApp.controller('emailController', ['$scope', function($scope) {

      $scope.email = {
        text: 'shahin@gmail.com'
      };
    }]);