@extends('my.layout')

@section('profile')

<div class="card-body pb-2">
    <div class="form-group">
        <label class="form-label">Twitter</label>
        <input type="text" class="form-control" value="https://twitter.com/user">
        <div class="clearfix"></div>
    </div>
    <div class="form-group">
        <label class="form-label">Facebook</label>
        <input type="text" class="form-control" value="https://www.facebook.com/user">
        <div class="clearfix"></div>
    </div>
    <div class="form-group">
        <label class="form-label">Google+</label>
        <input type="text" class="form-control" value="">
        <div class="clearfix"></div>
    </div>
    <div class="form-group">
        <label class="form-label">LinkedIn</label>
        <input type="text" class="form-control" value="">
        <div class="clearfix"></div>
    </div>
    <div class="form-group">
        <label class="form-label">Instagram</label>
        <input type="text" class="form-control" value="https://www.instagram.com/user">
        <div class="clearfix"></div>
    </div>
</div>

<div class="card-body">
    <button type="button" class="btn btn-twitter">Connect to<strong>Twitter</strong></button>
</div>
<hr class="border-light m-0">
<div class="card-body">
    <h5 class="mb-2">
        <a href="javascript:void(0)" class="float-right text-muted text-tiny">
            <i class="ion ion-md-close"></i> Remove
        </a>
        <i class="ion ion-logo-google text-google"></i>You are connected to Google:
    </h5> nmaxwell@mail.com
</div>
<hr class="border-light m-0">
<div class="card-body">
    <button type="button" class="btn btn-facebook">Connect to<strong>Facebook</strong></button>
</div>
<hr class="border-light m-0">
<div class="card-body">
    <button type="button" class="btn btn-instagram">Connect to<strong>Instagram</strong></button>
</div>
<div class="text-right mt-3">
    <button type="button" class="btn btn-primary">Save changes</button>&nbsp;
    <button type="button" class="btn btn-default">Cancel</button>
</div>

@endsection