TiBillet-Ticket-Nonfree/DjangoFiles/BaseBillet/templates/blk-pro/examples/profile-page.html

626 lines
30 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
=========================================================
* Blk• Design System Pro - v1.0.0
=========================================================
* Product Page: https://www.creative-tim.com/product/blk-design-system-pro
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
* Coded by www.creative-tim.com
=========================================================
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="apple-touch-icon" sizes="76x76" href="../../../static/blk-pro/assets/img/apple-icon.png">
<link rel="icon" type="image/png" href="../../../static/blk-pro/assets/img/favicon.png">
<title>
Blk• Design System Pro by Creative Tim
</title>
<!-- Fonts and icons -->
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
<!-- Nucleo Icons -->
<link href="../../../static/blk-pro/assets/css/nucleo-icons.css" rel="stylesheet" />
<!-- CSS Files -->
<link href="../../../static/blk-pro/assets/css/blk-design-system-pro.css?v=1.0.0" rel="stylesheet" />
<!-- CSS Just for demo purpose, don't include it in your project -->
<link href="../../../static/blk-pro/assets/demo/demo.css" rel="stylesheet" />
</head>
<body class="profile-page">
<!-- Navbar -->
<nav class="navbar navbar-expand-lg fixed-top navbar-transparent " color-on-scroll="300">
<div class="container">
<div class="navbar-translate">
<a class="navbar-brand" href="https://demos.creative-tim.com/blk-design-system-pro/index.html" rel="tooltip" title="Designed and Coded by Creative Tim" data-placement="bottom" target="_blank">
<span>BLK•</span> Design System PRO
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-bar bar1"></span>
<span class="navbar-toggler-bar bar2"></span>
<span class="navbar-toggler-bar bar3"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navigation">
<div class="navbar-collapse-header">
<div class="row">
<div class="col-6 collapse-brand">
<a>
BLK•
<span> PRO </span>
</a>
</div>
<div class="col-6 collapse-close text-right">
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
<i class="tim-icons icon-simple-remove"></i>
</button>
</div>
</div>
</div>
<ul class="navbar-nav ml-auto">
<li class="dropdown nav-item">
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
<i class="fa fa-cogs d-lg-none d-xl-none"></i> Getting started
</a>
<div class="dropdown-menu dropdown-with-icons">
<a href="../index.html" class="dropdown-item">
<i class="tim-icons icon-paper"></i> Components
</a>
<a href="../presentation.html" class="dropdown-item">
<i class="tim-icons icon-bullet-list-67"></i>Presentation Page
</a>
<a href="https://demos.creative-tim.com/blk-design-system-pro/docs/1.0/getting-started/overview.html" class="dropdown-item">
<i class="tim-icons icon-book-bookmark"></i>Documentation
</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown">
<i class="tim-icons icon-paper" aria-hidden="true"></i>
<p>Sections</p>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="../sections.html#headers">
<i class="tim-icons icon-app"></i> Headers
</a>
<a class="dropdown-item" href="../sections.html#features">
<i class="tim-icons icon-settings"></i> Features
</a>
<a class="dropdown-item" href="../sections.html#blogs">
<i class="tim-icons icon-align-left-2"></i> Blogs
</a>
<a class="dropdown-item" href="../sections.html#teams">
<i class="tim-icons icon-user-run"></i> Teams
</a>
<a class="dropdown-item" href="../sections.html#projects">
<i class="tim-icons icon-paper"></i> Projects
</a>
<a class="dropdown-item" href="../sections.html#pricing">
<i class="tim-icons icon-money-coins"></i> Pricing
</a>
<a class="dropdown-item" href="../sections.html#testimonials">
<i class="tim-icons icon-chat-33"></i> Testimonials
</a>
<a class="dropdown-item" href="../sections.html#contactus">
<i class="tim-icons icon-mobile"></i> Contact Us
</a>
<a class="dropdown-item" href="../sections.html#tables">
<i class="tim-icons icon-chart-bar-32"></i> Tables
</a>
<a class="dropdown-item" href="../sections.html#accordion">
<i class="tim-icons icon-paper"></i> Accordion
</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown">
<i class="tim-icons icon-book-bookmark" aria-hidden="true"></i>
<p>Examples</p>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="../examples/about-us.html">
<i class="tim-icons icon-bulb-63"></i> About-us
</a>
<a class="dropdown-item" href="../examples/blog-post.html">
<i class="tim-icons icon-align-center"></i> Blog Post
</a>
<a class="dropdown-item" href="../examples/blog-posts.html">
<i class="tim-icons icon-chart-bar-32"></i> Blog Posts
</a>
<a class="dropdown-item" href="../examples/contact-us.html">
<i class="tim-icons icon-square-pin"></i> Contact Us
</a>
<a class="dropdown-item" href="../examples/landing-page.html">
<i class="tim-icons icon-paper"></i> Landing Page
</a>
<a class="dropdown-item" href="../examples/pricing.html">
<i class="tim-icons icon-coins"></i> Pricing
</a>
<a class="dropdown-item" href="../examples/ecommerce.html">
<i class="tim-icons icon-basket-simple"></i> Ecommerce Page
</a>
<a class="dropdown-item" href="../examples/product-page.html">
<i class="tim-icons icon-bag-16"></i> Product Page
</a>
<a class="dropdown-item" href="../examples/profile-page.html">
<i class="tim-icons icon-lock-circle"></i> Profile Page
</a>
<a class="dropdown-item" href="../examples/error.html">
<i class="tim-icons icon-button-power"></i> 404 Error Page
</a>
<a class="dropdown-item" href="../examples/500-error.html">
<i class="tim-icons icon-alert-circle-exc"></i> 500 Error Page
</a>
<a href="#" class="dropdown-item dropdown-toggle" id="navbarDropdown2" data-toggle="dropdown">
<i class="tim-icons icon-book-bookmark" aria-hidden="true"></i> App Pages
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown2">
<a class="dropdown-item" href="../examples/account-settings.html">
<i class="tim-icons icon-lock-circle"></i> Account Settings
</a>
<a class="dropdown-item" href="../examples/login-page.html">
<i class="tim-icons icon-tablet-2"></i> Login Page
</a>
<a class="dropdown-item" href="../examples/register-page.html">
<i class="tim-icons icon-laptop"></i> Register Page
</a>
<a class="dropdown-item" href="../examples/reset-page.html">
<i class="tim-icons icon-molecule-40"></i> Reset Page
</a>
<a class="dropdown-item" href="../examples/invoice-page.html">
<i class="tim-icons icon-notes"></i> Invoice Page
</a>
<a class="dropdown-item" href="../examples/checkout-page.html">
<i class="tim-icons icon-basket-simple"></i> Checkout Page
</a>
<a class="dropdown-item" href="../examples/chat-page.html">
<i class="tim-icons icon-email-85"></i> Chat Page
</a>
</div>
</div>
</li>
<li class="nav-item">
<a class="nav-link btn btn-sm btn-default" href="https://www.creative-tim.com/product/blk-design-system-pro" target="_blank">
<p>Buy Now</p>
</a>
</li>
<!-- <li class="nav-item">
<a class="nav-link" rel="tooltip" title="Follow us on Twitter" data-placement="bottom" href="https://twitter.com/CreativeTim" target="_blank">
<i class="fab fa-twitter"></i>
<p class="hidden-lg-up">Twitter</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Like us on Facebook" data-placement="bottom" href="https://www.facebook.com/CreativeTim" target="_blank">
<i class="fab fa-facebook-square"></i>
<p class="hidden-lg-up">Facebook</p>
</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="tooltip" title="Follow us on Instagram" data-placement="bottom" href="https://www.instagram.com/CreativeTimOfficial" target="_blank">
<i class="fab fa-instagram"></i>
<p class="hidden-lg-up">Instagram</p>
</a>
</li> -->
</ul>
</div>
</div>
</nav>
<!-- End Navbar -->
<div class="wrapper">
<div class="page-header">
<img src="../../../static/blk-pro/assets/img/dots.png" class="dots">
<img src="../../../static/blk-pro/assets/img/path4.png" class="path">
<div class="container align-items-center">
<div class="row">
<div class="col-lg-6 col-md-6">
<h1 class="profile-title text-left">Mike Scheinder</h1>
<h5 class="text-on-back">01</h5>
<p class="profile-description">Offices parties lasting outward nothing age few resolve. Impression to discretion understood to we interested he excellence. Him remarkably use projection collecting. Going about eat forty world has round miles.</p>
<div class="btn-wrapper profile pt-3">
<a target="_blank" href="https://twitter.com/creativetim" class="btn btn-icon btn-twitter btn-round" data-toggle="tooltip" data-original-title="Follow us">
<i class="fab fa-twitter"></i>
</a>
<a target="_blank" href="https://www.facebook.com/creativetim" class="btn btn-icon btn-facebook btn-round" data-toggle="tooltip" data-original-title="Like us">
<i class="fab fa-facebook-square"></i>
</a>
<a target="_blank" href="https://dribbble.com/creativetim" class="btn btn-icon btn-dribbble btn-round" data-toggle="tooltip" data-original-title="Follow us">
<i class="fab fa-dribbble"></i>
</a>
</div>
</div>
<div class="col-lg-4 col-md-6 ml-auto mr-auto">
<div class="card card-coin card-plain">
<div class="card-header">
<img src="../../../static/blk-pro/assets/img/mike.jpg" class="img-center img-fluid rounded-circle">
<h4 class="title">Transactions</h4>
</div>
<div class="card-body">
<ul class="nav nav-tabs nav-tabs-primary justify-content-center">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#linka">
Wallet
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#linkb">
Send
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#linkc">
News
</a>
</li>
</ul>
<div class="tab-content tab-subcategories">
<div class="tab-pane active" id="linka">
<div class="table-responsive">
<table class="table tablesorter " id="plain-table">
<thead class=" text-primary">
<tr>
<th class="header">
COIN
</th>
<th class="header">
AMOUNT
</th>
<th class="header">
VALUE
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
BTC
</td>
<td>
7.342
</td>
<td>
48,870.75 USD
</td>
</tr>
<tr>
<td>
ETH
</td>
<td>
30.737
</td>
<td>
64,53.30 USD
</td>
</tr>
<tr>
<td>
XRP
</td>
<td>
19.242
</td>
<td>
18,354.96 USD
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane" id="linkb">
<div class="row">
<label class="col-sm-3 col-form-label">Pay to</label>
<div class="col-sm-9">
<div class="form-group">
<input type="text" class="form-control" placeholder="e.g. 1Nasd92348hU984353hfid">
<span class="form-text">Please enter a valid address.</span>
</div>
</div>
</div>
<div class="row">
<label class="col-sm-3 col-form-label">Amount</label>
<div class="col-sm-9">
<div class="form-group">
<input type="text" class="form-control" placeholder="1.587">
</div>
</div>
</div>
<button type="submit" class="btn btn-simple btn-primary btn-icon btn-round float-right"><i class="tim-icons icon-send"></i></button>
</div>
<div class="tab-pane" id="linkc">
<div class="table-responsive">
<table class="table tablesorter " id="plain-table">
<thead class=" text-primary">
<tr>
<th class="header">
Latest Crypto News
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
The Daily: Nexo to Pay on Stable...
</td>
</tr>
<tr>
<td>
Venezuela Begins Public of Nation...
</td>
</tr>
<tr>
<td>
PR: BitCanna Dutch Blockchain...
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section">
<div class="container">
<div class="row justify-content-between">
<div class="col-md-6">
<div class="row justify-content-between align-items-center">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<img class="d-block" src="../../../static/blk-pro/assets/img/denys.jpg" alt="First slide">
<div class="carousel-caption d-none d-md-block">
<h5>Big City Life, United States</h5>
</div>
</div>
<div class="carousel-item">
<img class="d-block" src="../../../static/blk-pro/assets/img/fabien-bazanegue.jpg" alt="Second slide">
<div class="carousel-caption d-none d-md-block">
<h5>Somewhere Beyond, United States</h5>
</div>
</div>
<div class="carousel-item">
<img class="d-block" src="../../../static/blk-pro/assets/img/mark-finn.jpg" alt="Third slide">
<div class="carousel-caption d-none d-md-block">
<h5>Stocks, United States</h5>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<i class="tim-icons icon-minimal-left"></i>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<i class="tim-icons icon-minimal-right"></i>
</a>
</div>
</div>
</div>
<div class="col-md-5">
<h1 class="profile-title text-left">Projects</h1>
<h5 class="text-on-back">02</h5>
<p class="profile-description text-left">An artist of considerable range, Ryan — the name taken by Melbourne-raised, Brooklyn-based Nick Murphy — writes, performs and records all of his own music, giving it a warm, intimate feel with a solid groove structure. An artist of considerable range.</p>
<div class="btn-wrapper pt-3">
<button href="javascript:void(0)" class="btn btn-simple btn-primary">
<i class="tim-icons icon-book-bookmark"></i> Bookmark
</button>
<button href="javascript:void(0)" class="btn btn-simple btn-info">
<i class="tim-icons icon-bulb-63"></i> Check it!
</button>
</div>
</div>
</div>
</div>
</div>
<section class="section">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="card card-plain">
<div class="card-header">
<h1 class="profile-title text-left">Contact</h1>
<h5 class="text-on-back">03</h5>
</div>
<div class="card-body">
<form>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>Your Name</label>
<input type="text" class="form-control" value="Mike">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Email address</label>
<input type="email" class="form-control" placeholder="mike@email.com">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label>Phone</label>
<input type="text" class="form-control" value="001-12321345">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Company</label>
<input type="text" class="form-control" value="CreativeTim">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label>Message</label>
<input type="text" class="form-control" placeholder="Hello there!">
</div>
</div>
</div>
<button type="submit" class="btn btn-primary btn-round float-right" rel="tooltip" data-original-title="Can't wait for your message" data-placement="right">Send text</button>
</form>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 ml-auto">
<div class="info info-horizontal">
<div class="icon icon-primary">
<i class="tim-icons icon-square-pin"></i>
</div>
<div class="description">
<h4 class="info-title">Find us at the office</h4>
<p> Bld Mihail Kogalniceanu, nr. 8,
<br> 7652 Bucharest,
<br> Romania
</p>
</div>
</div>
<div class="info info-horizontal">
<div class="icon icon-primary">
<i class="tim-icons icon-mobile"></i>
</div>
<div class="description">
<h4 class="info-title">Give us a ring</h4>
<p> Michael Jordan
<br> +40 762 321 762
<br> Mon - Fri, 8:00-22:00
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-md-3">
<h1 class="title">BLK•</h1>
</div>
<div class="col-md-3 col-6">
<ul class="nav">
<li class="nav-item">
<a href="../index.html" class="nav-link">
Home
</a>
</li>
<li class="nav-item">
<a href="../examples/landing-page.html" class="nav-link">
Landing
</a>
</li>
<li class="nav-item">
<a href="../examples/register-page.html" class="nav-link">
Register
</a>
</li>
<li class="nav-item">
<a href="../examples/profile-page.html" class="nav-link">
Profile
</a>
</li>
</ul>
</div>
<div class="col-md-3 col-6">
<ul class="nav">
<li class="nav-item">
<a href="https://creative-tim.com/contact-us?ref=blkdsp-footer" class="nav-link">
Contact Us
</a>
</li>
<li class="nav-item">
<a href="https://creative-tim.com/about-us?ref=blkdsp-footer" class="nav-link">
About Us
</a>
</li>
<li class="nav-item">
<a href="http://creative-tim.com/blog?ref=blkdsp-footer" class="nav-link">
Blog
</a>
</li>
<li class="nav-item">
<a href="https://opensource.org/licenses/MIT?ref=blkdsp-footer" class="nav-link">
License
</a>
</li>
</ul>
</div>
<div class="col-md-3">
<h3 class="title">Follow us:</h3>
<div class="btn-wrapper profile text-left">
<a target="_blank" href="https://twitter.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Follow us">
<i class="fab fa-twitter"></i>
</a>
<a target="_blank" href="https://www.facebook.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Like us">
<i class="fab fa-facebook-square"></i>
</a>
<a target="_blank" href="https://dribbble.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Follow us">
<i class="fab fa-dribbble"></i>
</a>
</div>
</div>
</div>
</div>
</footer>
</div>
<!-- Core JS Files -->
<script src="../../../static/blk-pro/assets/js/core/jquery.min.js" type="text/javascript"></script>
<script src="../../../static/blk-pro/assets/js/core/popper.min.js" type="text/javascript"></script>
<script src="../../../static/blk-pro/assets/js/core/bootstrap.min.js" type="text/javascript"></script>
<script src="../../../static/blk-pro/assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
<!-- Plugin for Switches, full documentation here: http://www.jque.re/plugins/version3/bootstrap.switch/ -->
<script src="../../../static/blk-pro/assets/js/plugins/bootstrap-switch.js"></script>
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
<script src="../../../static/blk-pro/assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
<!-- Plugin for the Carousel, full documentation here: http://kenwheeler.github.io/slick/ -->
<script src="../../../static/blk-pro/assets/js/plugins/slick.js" type="text/javascript"></script>
<!-- Plugin for the blob animation -->
<script src="../../../static/blk-pro/assets/js/plugins/anime.min.js" type="text/javascript"></script>
<!-- Chart JS -->
<script src="../../../static/blk-pro/assets/js/plugins/chartjs.min.js"></script>
<!-- Plugin for the DatePicker, full documentation here: https://github.com/uxsolutions/bootstrap-datepicker -->
<script src="../../../static/blk-pro/assets/js/plugins/moment.min.js"></script>
<!-- Plugin for Tags, full documentation here: https://github.com/bootstrap-tagsinput/bootstrap-tagsinputs -->
<script src="../../../static/blk-pro/assets/js/plugins/bootstrap-tagsinput.js"></script>
<!-- Plugin for Select, full documentation here: http://silviomoreto.github.io/bootstrap-select -->
<script src="../../../static/blk-pro/assets/js/plugins/bootstrap-selectpicker.js" type="text/javascript"></script>
<!-- Plugin for the DateTimePicker, full documentation here: https://eonasdan.github.io/bootstrap-datetimepicker/ -->
<script src="../../../static/blk-pro/assets/js/plugins/bootstrap-datetimepicker.js" type="text/javascript"></script>
<!-- Plugin for Fileupload, full documentation here: http://www.jasny.net/bootstrap/javascript/#fileinput -->
<script src="../../../static/blk-pro/assets/js/plugins/jasny-bootstrap.min.js"></script>
<!-- Black Dashboard DEMO methods, don't include it in your project! -->
<script src="../../../static/blk-pro/assets/demo/demo.js"></script>
<!-- Control Center for Black UI Kit: parallax effects, scripts for the example pages etc -->
<!-- Google Maps Plugin -->
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
<script src="../../../static/blk-pro/assets/js/blk-design-system-pro.min.js?v=1.0.0" type="text/javascript"></script>
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script>
<script>
window.TrackJS &&
TrackJS.install({
token: "ee6fab19c5a04ac1a32a645abde4613a",
application: "black-dashboard-pro"
});
</script>
</body>
</html>