{% extends "layout/layout.html" %} {% set page_title = "Account Setting" %} {%
block content %}

<main class="app-wrapper">
  {% include "../templates/layout/header-footer/app-header.html" %} {% include
  "../templates/layout/header-footer/app-sidebar.html" %} {% include
  "../templates/layout/header-footer/topnavbar.html" %}
  <div class="content-wrapper">
    <div class="page-content">
      <div class="container-fluid">
        <div class="row">
          <div class="col-12 rt-mb-25">
            {% include "../templates/components/breadcrumbs/breadcrumbs.html" %}
          </div>
        </div>
        <div class="row">
          <div class="col-xxl-3 col-xl-6 col-lg-6 col-md-6 col-sm-6">
            <div class="card">
              <div class="upload-file">
                <div class="upload-photo-thumb">
                  <img src="assets/images/all-img/users/user1.png" alt="" />
                </div>
                <div
                  class="btn btn-outline-primary pill btn-icon d-block position-static"
                >
                  <span class="button-content-wrapper">
                    <span class="button-text"> Upload Proifle Photo </span>
                    <span class="button-icon">
                      <img src="assets/images/svg/download2.svg" alt="" />
                    </span>
                  </span>
                </div>
                <input type="file" />
              </div>
              <div class="upload-photo-content">
                <p>
                  <span>Remember:</span> For best results, use an image at least
                  200px by 200px in .jpg or .png format
                </p>
              </div>
            </div>
          </div>
          <div class="col-xxl-3 col-xl-6 col-lg-6 col-md-6 col-sm-6">
            <div class="card">
              <div class="upload-file two">
                <div class="upload-photo-thumb two">
                  <img src="assets/images/all-img/banner2.jpg" alt="" />
                </div>
                <input type="file" />
                <div class="upload-btn-wrap">
                  <div
                    class="btn btn-outline-primary pill btn-icon d-block position-static"
                  >
                    <span class="button-content-wrapper">
                      <span class="button-text"> Upload Proifle Photo </span>
                      <span class="button-icon">
                        <img src="assets/images/svg/download2.svg" alt="" />
                      </span>
                    </span>
                  </div>
                </div>
              </div>
              <div class="upload-photo-content two">
                <button type="button" class="btn btn-danger2 pill d-block">
                  Remove Banner
                </button>
                <p>
                  <span>Remember:</span> For best results, use an image at least
                  200px by 200px in .jpg or .png format
                </p>
              </div>
            </div>
          </div>
          <div class="col-xxl-6 col-xl-12">
            <div class="card">
              <div class="card-header">Basic Info</div>
              <div class="card-body">
                <div class="row">
                  <div class="col-lg-6 col-md-6">
                    <div class="fromGroup mb-3">
                      <label>Name</label>
                      <input
                        class="form-control"
                        type="text"
                        placeholder="Full name"
                      />
                    </div>
                  </div>
                  <div class="col-lg-6 col-md-6">
                    <div class="fromGroup mb-3">
                      <label>Tittle</label>
                      <input
                        class="form-control"
                        type="text"
                        placeholder="headline, sub-tittle"
                      />
                    </div>
                  </div>
                  <div class="fromGroup mb-3">
                    <label>Boigraphy</label>
                    <textarea
                      class="form-control"
                      name="textarea"
                      placeholder="You boigraphy, description"
                    ></textarea>
                  </div>
                  <div class="save-change-btn">
                    <button type="button" class="btn btn-primary pill mt-3">
                      Save Changes
                    </button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-xxl-4 col-xl-6 col-md-6">
            <div class="card">
              <div class="card-header">Private Info</div>
              <div class="card-body">
                <div class="fromGroup mb-3">
                  <label>Team</label>
                  <div class="select-box">
                    <select class="custom-select sources" title="Select...">
                      <option>Select...</option>
                      <option>Select...</option>
                      <option>Select...</option>
                    </select>
                  </div>
                </div>
                <div class="row">
                  <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
                    <div class="fromGroup mb-3">
                      <label>Country</label>
                      <div class="select-box">
                        <select class="custom-select sources" title="Select...">
                          <option>Bangladesh</option>
                          <option>New zealand</option>
                          <option>switzerland</option>
                        </select>
                      </div>
                    </div>
                  </div>
                  <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
                    <div class="fromGroup mb-3">
                      <label>City</label>
                      <div class="select-box">
                        <select class="custom-select sources" title="Select...">
                          <option>Dhaka</option>
                          <option>New zealand</option>
                          <option>switzerland</option>
                        </select>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="fromGroup has-icon mb-3">
                  <label>Date of Birth</label>
                  <div class="form-control-icon">
                    <input
                      class="form-control date-picker-calender"
                      type="text"
                      placeholder="DD / MM / YY"
                    />
                    <div class="icon-badge-2">
                      <img src="assets/images/svg/calendar.svg" alt="" />
                    </div>
                  </div>
                </div>
                <div class="fromGroup mb-3">
                  <label>Language</label>
                  <div class="select-box">
                    <select class="custom-select sources" title="Select...">
                      <option>Bangla</option>
                      <option>English</option>
                    </select>
                  </div>
                </div>
                <button type="button" class="btn btn-primary pill mt-3">
                  Save Changes
                </button>
              </div>
            </div>
          </div>
          <div class="col-xxl-4 col-xl-6 col-md-6">
            <div class="card">
              <div class="card-header">Social Account</div>
              <div class="card-body">
                <form action="#">
                  <div class="fromGroup mb-3">
                    <label>Facebook</label>
                    <input
                      class="form-control"
                      type="text"
                      placeholder="Facebook profile url..."
                    />
                  </div>
                  <div class="fromGroup mb-3">
                    <label>Twitter</label>
                    <input
                      class="form-control"
                      type="text"
                      placeholder="Twitter profile url..."
                    />
                  </div>
                  <div class="fromGroup mb-3">
                    <label>Linkedin</label>
                    <input
                      class="form-control"
                      type="text"
                      placeholder="Linkedin profile url..."
                    />
                  </div>
                  <div class="fromGroup mb-3">
                    <label>Instagram</label>
                    <input
                      class="form-control"
                      type="text"
                      placeholder="Instagram profile url..."
                    />
                  </div>
                  <button type="button" class="btn btn-primary pill mt-3">
                    Save Changes
                  </button>
                </form>
              </div>
            </div>
          </div>
          <div class="col-xxl-4">
            <div class="card">
              <div class="card-header">Contact Info</div>
              <div class="card-body">
                <form action="#">
                  <div class="fromGroup has-icon mb-3">
                    <label>Phone</label>
                    <div class="form-control-icon">
                      <input
                        class="form-control"
                        type="text"
                        placeholder="Phone number"
                      />
                      <div class="icon-badge-2">
                        <img src="assets/images/svg/phonecall2.svg" alt="" />
                      </div>
                    </div>
                  </div>
                  <div class="fromGroup has-icon mb-3">
                    <label>Email</label>
                    <div class="form-control-icon">
                      <input
                        class="form-control"
                        type="text"
                        placeholder="email address"
                      />
                      <div class="icon-badge-2">
                        <img src="assets/images/svg/envelope2.svg" alt="" />
                      </div>
                    </div>
                  </div>
                  <div class="fromGroup has-icon mb-3">
                    <label>Address</label>
                    <div class="form-control-icon">
                      <input
                        class="form-control"
                        type="text"
                        placeholder="Current location..."
                      />
                      <div class="icon-badge-2">
                        <img src="assets/images/svg/map2.svg" alt="" />
                      </div>
                    </div>
                  </div>
                  <div class="fromGroup has-icon mb-3">
                    <label>Portfolio</label>
                    <div class="form-control-icon">
                      <input
                        class="form-control"
                        type="text"
                        placeholder="Personal portfolio url"
                      />
                      <div class="icon-badge-2">
                        <img src="assets/images/svg/briefcase.svg" alt="" />
                      </div>
                    </div>
                  </div>
                  <button type="button" class="btn btn-primary pill mt-3">
                    Save Changes
                  </button>
                </form>
              </div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-xxl-4 col-xl-6 col-md-6">
            <div class="card">
              <div class="card-header">Change Password</div>
              <div class="card-body">
                <form action="#">
                  <div class="fromGroup eye mb-3">
                    <label>Current Password</label>
                    <div class="form-control-icon">
                      <input
                        id="password-hide_show"
                        class="form-control"
                        type="password"
                        placeholder="password"
                      />
                      <div class="has-badge">
                        <i class="ph-eye"></i>
                      </div>
                    </div>
                  </div>
                  <div class="fromGroup eye mb-3">
                    <label>New Password</label>
                    <div class="form-control-icon">
                      <input
                        id="password-hide_show2"
                        class="form-control"
                        type="password"
                        placeholder="password"
                      />
                      <div class="has-badge select-icon__two">
                        <i class="ph-eye"></i>
                      </div>
                    </div>
                  </div>
                  <div class="fromGroup eye mb-3">
                    <label>Confirm Password</label>
                    <div class="form-control-icon">
                      <input
                        id="password-hide_show3"
                        class="form-control"
                        type="password"
                        placeholder="password"
                      />
                      <div class="has-badge select-icon__three">
                        <i class="ph-eye"></i>
                      </div>
                    </div>
                  </div>
                  <button type="button" class="btn btn-primary pill mt-3">
                    Save Changes
                  </button>
                </form>
              </div>
            </div>
          </div>
          <div class="col-xxl-3 col-xl-6 col-md-6">
            <div class="card">
              <div class="card-header">Advance Setting</div>
              <div class="card-body">
                <form action="#">
                  <div class="checkbox-top">
                    <div class="form-check from-chekbox-custom mb-2">
                      <input
                        class="form-check-input"
                        type="checkbox"
                        value=""
                        id="check-one"
                        checked
                      />
                      <label class="form-check-label" for="check-one">
                        Show my balance
                      </label>
                    </div>
                    <div class="form-check from-chekbox-custom mb-2">
                      <input
                        class="form-check-input"
                        type="checkbox"
                        value=""
                        id="check-two"
                        checked
                      />
                      <label class="form-check-label" for="check-two">
                        Show total Kanban Board card
                      </label>
                    </div>
                    <div class="form-check from-chekbox-custom mb-2">
                      <input
                        class="form-check-input"
                        type="checkbox"
                        value=""
                        id="check-three"
                      />
                      <label class="form-check-label" for="check-three">
                        Show total Calendar task
                      </label>
                    </div>
                    <div class="form-check from-chekbox-custom">
                      <input
                        class="form-check-input"
                        type="checkbox"
                        value=""
                        id="check-four"
                      />
                      <label class="form-check-label" for="check-four">
                        Show total Calendar events
                      </label>
                    </div>
                  </div>
                  <div class="form-check from-chekbox-custom mb-2">
                    <input
                      class="form-check-input"
                      type="checkbox"
                      value=""
                      id="check-five"
                      checked
                    />
                    <label class="form-check-label" for="check-five">
                      Show private information
                    </label>
                  </div>
                  <div class="form-check from-chekbox-custom mb-2">
                    <input
                      class="form-check-input"
                      type="checkbox"
                      value=""
                      id="check-six"
                    />
                    <label class="form-check-label" for="check-six">
                      Contact information
                    </label>
                  </div>
                  <div class="form-check from-chekbox-custom">
                    <input
                      class="form-check-input"
                      type="checkbox"
                      value=""
                      id="check-seven"
                    />
                    <label class="form-check-label" for="check-seven">
                      Social media link
                    </label>
                  </div>
                  <button type="button" class="btn btn-primary pill mt-3">
                    Save Changes
                  </button>
                </form>
              </div>
            </div>
          </div>
          <div class="col-xxl-5">
            <div class="pricing-plan-wrap">
              <div class="pricing-plan top">
                <h4>Pricing Plans</h4>
                <h5>🚀 Premium</h5>
                <p>
                  Transfer this account to another user or to an organization
                  where you have the ability to create repositories.
                </p>
                <button type="button" class="btn btn-primary pill">
                  Upgrade plan
                </button>
              </div>
              <div class="pricing-plan bottom">
                <h4>Deactivate this account</h4>
                <p>
                  Once you delete a account, there is no going back. Please be
                  certain.
                </p>
                <button type="button" class="btn btn-danger2 pill">
                  Deactivated account
                </button>
              </div>
            </div>
          </div>
        </div>
        {% include "../templates/layout/header-footer/footer.html" %}
      </div>
    </div>
  </div>
</main>

{% endblock %}