mirror of
https://gitlab.com/TheGamecraft/c-cms.git
synced 2026-04-21 10:49:10 -04:00
Add Material Design for Public and Admin
This commit is contained in:
Mathieu Lagace
303
resources/theme/material-kit/examples/landing-page.html
Normal file
303
resources/theme/material-kit/examples/landing-page.html
Normal file
@@ -0,0 +1,303 @@
|
||||
<!--
|
||||
=========================================================
|
||||
* Material Kit - v2.0.5
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-kit
|
||||
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
|
||||
Licensed under MIT (https://github.com/creativetimofficial/material-kit/blob/master/LICENSE.md)
|
||||
|
||||
|
||||
=========================================================
|
||||
|
||||
* 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" />
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
|
||||
<link rel="icon" type="image/png" href="../assets/img/favicon.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<title>
|
||||
Material Kit by Creative Tim
|
||||
</title>
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
|
||||
<!-- Fonts and icons -->
|
||||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" />
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<!-- CSS Files -->
|
||||
<link href="../assets/css/material-kit.css?v=2.0.5" rel="stylesheet" />
|
||||
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||
<link href="../assets/demo/demo.css" rel="stylesheet" />
|
||||
</head>
|
||||
|
||||
<body class="landing-page sidebar-collapse">
|
||||
<nav class="navbar navbar-transparent navbar-color-on-scroll fixed-top navbar-expand-lg" color-on-scroll="100" id="sectionsNav">
|
||||
<div class="container">
|
||||
<div class="navbar-translate">
|
||||
<a class="navbar-brand" href="https://demos.creative-tim.com/material-kit/index.html">
|
||||
Material Kit </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="dropdown nav-item">
|
||||
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
|
||||
<i class="material-icons">apps</i> Components
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-with-icons">
|
||||
<a href="../index.html" class="dropdown-item">
|
||||
<i class="material-icons">layers</i> All Components
|
||||
</a>
|
||||
<a href="https://demos.creative-tim.com/material-kit/docs/2.1/getting-started/introduction.html" class="dropdown-item">
|
||||
<i class="material-icons">content_paste</i> Documentation
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="javascript:void(0)" onclick="scrollToDownload()">
|
||||
<i class="material-icons">cloud_download</i> Download
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://twitter.com/CreativeTim" target="_blank" data-original-title="Follow us on Twitter">
|
||||
<i class="fa fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.facebook.com/CreativeTim" target="_blank" data-original-title="Like us on Facebook">
|
||||
<i class="fa fa-facebook-square"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.instagram.com/CreativeTimOfficial" target="_blank" data-original-title="Follow us on Instagram">
|
||||
<i class="fa fa-instagram"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="page-header header-filter" data-parallax="true" style="background-image: url('../assets/img/profile_city.jpg')">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<h1 class="title">Your Story Starts With Us.</h1>
|
||||
<h4>Every landing page needs a small description after the big bold title, that's why we added this text here. Add here all the information that can make you or your product create the first impression.</h4>
|
||||
<br>
|
||||
<a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank" class="btn btn-danger btn-raised btn-lg">
|
||||
<i class="fa fa-play"></i> Watch video
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main main-raised">
|
||||
<div class="container">
|
||||
<div class="section text-center">
|
||||
<div class="row">
|
||||
<div class="col-md-8 ml-auto mr-auto">
|
||||
<h2 class="title">Let's talk product</h2>
|
||||
<h5 class="description">This is the paragraph where you can write more details about your product. Keep you user engaged by providing meaningful information. Remember that by this time, the user is curious, otherwise he wouldn't scroll to get here. Add a button if you want the user to see more.</h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="features">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="info">
|
||||
<div class="icon icon-info">
|
||||
<i class="material-icons">chat</i>
|
||||
</div>
|
||||
<h4 class="info-title">Free Chat</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="info">
|
||||
<div class="icon icon-success">
|
||||
<i class="material-icons">verified_user</i>
|
||||
</div>
|
||||
<h4 class="info-title">Verified Users</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="info">
|
||||
<div class="icon icon-danger">
|
||||
<i class="material-icons">fingerprint</i>
|
||||
</div>
|
||||
<h4 class="info-title">Fingerprint</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section text-center">
|
||||
<h2 class="title">Here is our team</h2>
|
||||
<div class="team">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<div class="card card-plain">
|
||||
<div class="col-md-6 ml-auto mr-auto">
|
||||
<img src="../assets/img/faces/avatar.jpg" alt="Thumbnail Image" class="img-raised rounded-circle img-fluid">
|
||||
</div>
|
||||
<h4 class="card-title">Gigi Hadid
|
||||
<br>
|
||||
<small class="card-description text-muted">Model</small>
|
||||
</h4>
|
||||
<div class="card-body">
|
||||
<p class="card-description">You can write here details about one of your team members. You can give more details about what they do. Feel free to add some
|
||||
<a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
<div class="card-footer justify-content-center">
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-twitter"></i></a>
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-instagram"></i></a>
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-facebook-square"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<div class="card card-plain">
|
||||
<div class="col-md-6 ml-auto mr-auto">
|
||||
<img src="../assets/img/faces/christian.jpg" alt="Thumbnail Image" class="img-raised rounded-circle img-fluid">
|
||||
</div>
|
||||
<h4 class="card-title">Christian Louboutin
|
||||
<br>
|
||||
<small class="card-description text-muted">Designer</small>
|
||||
</h4>
|
||||
<div class="card-body">
|
||||
<p class="card-description">You can write here details about one of your team members. You can give more details about what they do. Feel free to add some
|
||||
<a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
<div class="card-footer justify-content-center">
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-twitter"></i></a>
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-linkedin"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<div class="card card-plain">
|
||||
<div class="col-md-6 ml-auto mr-auto">
|
||||
<img src="../assets/img/faces/kendall.jpg" alt="Thumbnail Image" class="img-raised rounded-circle img-fluid">
|
||||
</div>
|
||||
<h4 class="card-title">Kendall Jenner
|
||||
<br>
|
||||
<small class="card-description text-muted">Model</small>
|
||||
</h4>
|
||||
<div class="card-body">
|
||||
<p class="card-description">You can write here details about one of your team members. You can give more details about what they do. Feel free to add some
|
||||
<a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
<div class="card-footer justify-content-center">
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-twitter"></i></a>
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-instagram"></i></a>
|
||||
<a href="#pablo" class="btn btn-link btn-just-icon"><i class="fa fa-facebook-square"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section section-contacts">
|
||||
<div class="row">
|
||||
<div class="col-md-8 ml-auto mr-auto">
|
||||
<h2 class="text-center title">Work with us</h2>
|
||||
<h4 class="text-center description">Divide details about your product or agency work into parts. Write a few lines about each one and contact us about any further collaboration. We will responde get back to you in a couple of hours.</h4>
|
||||
<form class="contact-form">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="bmd-label-floating">Your Name</label>
|
||||
<input type="email" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<label class="bmd-label-floating">Your Email</label>
|
||||
<input type="email" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="exampleMessage" class="bmd-label-floating">Your Message</label>
|
||||
<textarea type="email" class="form-control" rows="4" id="exampleMessage"></textarea>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 ml-auto mr-auto text-center">
|
||||
<button class="btn btn-primary btn-raised">
|
||||
Send Message
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer footer-default">
|
||||
<div class="container">
|
||||
<nav class="float-left">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com">
|
||||
Creative Tim
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://creative-tim.com/presentation">
|
||||
About Us
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://blog.creative-tim.com">
|
||||
Blog
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com/license">
|
||||
Licenses
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="copyright float-right">
|
||||
©
|
||||
<script>
|
||||
document.write(new Date().getFullYear())
|
||||
</script>, made with <i class="material-icons">favorite</i> by
|
||||
<a href="https://www.creative-tim.com" target="_blank">Creative Tim</a> for a better web.
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- Core JS Files -->
|
||||
<script src="../assets/js/core/jquery.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/popper.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/bootstrap-material-design.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/plugins/moment.min.js"></script>
|
||||
<!-- Plugin for the Datepicker, full documentation here: https://github.com/Eonasdan/bootstrap-datetimepicker -->
|
||||
<script src="../assets/js/plugins/bootstrap-datetimepicker.js" type="text/javascript"></script>
|
||||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
|
||||
<script src="../assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
|
||||
<!-- Google Maps Plugin -->
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||
<!-- Control Center for Material Kit: parallax effects, scripts for the example pages etc -->
|
||||
<script src="../assets/js/material-kit.js?v=2.0.5" type="text/javascript"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
195
resources/theme/material-kit/examples/login-page.html
Normal file
195
resources/theme/material-kit/examples/login-page.html
Normal file
@@ -0,0 +1,195 @@
|
||||
<!--
|
||||
=========================================================
|
||||
* Material Kit - v2.0.5
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-kit
|
||||
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
|
||||
Licensed under MIT (https://github.com/creativetimofficial/material-kit/blob/master/LICENSE.md)
|
||||
|
||||
|
||||
=========================================================
|
||||
|
||||
* 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" />
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
|
||||
<link rel="icon" type="image/png" href="../assets/img/favicon.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<title>
|
||||
Material Kit by Creative Tim
|
||||
</title>
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
|
||||
<!-- Fonts and icons -->
|
||||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" />
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<!-- CSS Files -->
|
||||
<link href="../assets/css/material-kit.css?v=2.0.5" rel="stylesheet" />
|
||||
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||
<link href="../assets/demo/demo.css" rel="stylesheet" />
|
||||
</head>
|
||||
|
||||
<body class="login-page sidebar-collapse">
|
||||
<nav class="navbar navbar-transparent navbar-color-on-scroll fixed-top navbar-expand-lg" color-on-scroll="100" id="sectionsNav">
|
||||
<div class="container">
|
||||
<div class="navbar-translate">
|
||||
<a class="navbar-brand" href="https://demos.creative-tim.com/material-kit/index.html">
|
||||
Material Kit </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="dropdown nav-item">
|
||||
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
|
||||
<i class="material-icons">apps</i> Components
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-with-icons">
|
||||
<a href="../index.html" class="dropdown-item">
|
||||
<i class="material-icons">layers</i> All Components
|
||||
</a>
|
||||
<a href="https://demos.creative-tim.com/material-kit/docs/2.1/getting-started/introduction.html" class="dropdown-item">
|
||||
<i class="material-icons">content_paste</i> Documentation
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="javascript:void(0)" onclick="scrollToDownload()">
|
||||
<i class="material-icons">cloud_download</i> Download
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://twitter.com/CreativeTim" target="_blank" data-original-title="Follow us on Twitter">
|
||||
<i class="fa fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.facebook.com/CreativeTim" target="_blank" data-original-title="Like us on Facebook">
|
||||
<i class="fa fa-facebook-square"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.instagram.com/CreativeTimOfficial" target="_blank" data-original-title="Follow us on Instagram">
|
||||
<i class="fa fa-instagram"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="page-header header-filter" style="background-image: url('../assets/img/bg7.jpg'); background-size: cover; background-position: top center;">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-4 col-md-6 ml-auto mr-auto">
|
||||
<div class="card card-login">
|
||||
<form class="form" method="" action="">
|
||||
<div class="card-header card-header-primary text-center">
|
||||
<h4 class="card-title">Login</h4>
|
||||
<div class="social-line">
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link">
|
||||
<i class="fa fa-facebook-square"></i>
|
||||
</a>
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link">
|
||||
<i class="fa fa-twitter"></i>
|
||||
</a>
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link">
|
||||
<i class="fa fa-google-plus"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p class="description text-center">Or Be Classical</p>
|
||||
<div class="card-body">
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<i class="material-icons">face</i>
|
||||
</span>
|
||||
</div>
|
||||
<input type="text" class="form-control" placeholder="First Name...">
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<i class="material-icons">mail</i>
|
||||
</span>
|
||||
</div>
|
||||
<input type="email" class="form-control" placeholder="Email...">
|
||||
</div>
|
||||
<div class="input-group">
|
||||
<div class="input-group-prepend">
|
||||
<span class="input-group-text">
|
||||
<i class="material-icons">lock_outline</i>
|
||||
</span>
|
||||
</div>
|
||||
<input type="password" class="form-control" placeholder="Password...">
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer text-center">
|
||||
<a href="#pablo" class="btn btn-primary btn-link btn-wd btn-lg">Get Started</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<nav class="float-left">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com">
|
||||
Creative Tim
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://creative-tim.com/presentation">
|
||||
About Us
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://blog.creative-tim.com">
|
||||
Blog
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com/license">
|
||||
Licenses
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="copyright float-right">
|
||||
©
|
||||
<script>
|
||||
document.write(new Date().getFullYear())
|
||||
</script>, made with <i class="material-icons">favorite</i> by
|
||||
<a href="https://www.creative-tim.com" target="_blank">Creative Tim</a> for a better web.
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
<!-- Core JS Files -->
|
||||
<script src="../assets/js/core/jquery.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/popper.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/bootstrap-material-design.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/plugins/moment.min.js"></script>
|
||||
<!-- Plugin for the Datepicker, full documentation here: https://github.com/Eonasdan/bootstrap-datetimepicker -->
|
||||
<script src="../assets/js/plugins/bootstrap-datetimepicker.js" type="text/javascript"></script>
|
||||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
|
||||
<script src="../assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
|
||||
<!-- Google Maps Plugin -->
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||
<!-- Control Center for Material Kit: parallax effects, scripts for the example pages etc -->
|
||||
<script src="../assets/js/material-kit.js?v=2.0.5" type="text/javascript"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
228
resources/theme/material-kit/examples/profile-page.html
Normal file
228
resources/theme/material-kit/examples/profile-page.html
Normal file
@@ -0,0 +1,228 @@
|
||||
<!--
|
||||
=========================================================
|
||||
* Material Kit - v2.0.5
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-kit
|
||||
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
|
||||
Licensed under MIT (https://github.com/creativetimofficial/material-kit/blob/master/LICENSE.md)
|
||||
|
||||
|
||||
=========================================================
|
||||
|
||||
* 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" />
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
|
||||
<link rel="icon" type="image/png" href="../assets/img/favicon.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<title>
|
||||
Material Kit by Creative Tim
|
||||
</title>
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
|
||||
<!-- Fonts and icons -->
|
||||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" />
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<!-- CSS Files -->
|
||||
<link href="../assets/css/material-kit.css?v=2.0.5" rel="stylesheet" />
|
||||
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||
<link href="../assets/demo/demo.css" rel="stylesheet" />
|
||||
</head>
|
||||
|
||||
<body class="profile-page sidebar-collapse">
|
||||
<nav class="navbar navbar-transparent navbar-color-on-scroll fixed-top navbar-expand-lg" color-on-scroll="100" id="sectionsNav">
|
||||
<div class="container">
|
||||
<div class="navbar-translate">
|
||||
<a class="navbar-brand" href="https://demos.creative-tim.com/material-kit/index.html">
|
||||
Material Kit </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="dropdown nav-item">
|
||||
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
|
||||
<i class="material-icons">apps</i> Components
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-with-icons">
|
||||
<a href="../index.html" class="dropdown-item">
|
||||
<i class="material-icons">layers</i> All Components
|
||||
</a>
|
||||
<a href="https://demos.creative-tim.com/material-kit/docs/2.1/getting-started/introduction.html" class="dropdown-item">
|
||||
<i class="material-icons">content_paste</i> Documentation
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="javascript:void(0)" onclick="scrollToDownload()">
|
||||
<i class="material-icons">cloud_download</i> Download
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://twitter.com/CreativeTim" target="_blank" data-original-title="Follow us on Twitter">
|
||||
<i class="fa fa-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.facebook.com/CreativeTim" target="_blank" data-original-title="Like us on Facebook">
|
||||
<i class="fa fa-facebook-square"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" rel="tooltip" title="" data-placement="bottom" href="https://www.instagram.com/CreativeTimOfficial" target="_blank" data-original-title="Follow us on Instagram">
|
||||
<i class="fa fa-instagram"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="page-header header-filter" data-parallax="true" style="background-image: url('../assets/img/city-profile.jpg');"></div>
|
||||
<div class="main main-raised">
|
||||
<div class="profile-content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6 ml-auto mr-auto">
|
||||
<div class="profile">
|
||||
<div class="avatar">
|
||||
<img src="../assets/img/faces/christian.jpg" alt="Circle Image" class="img-raised rounded-circle img-fluid">
|
||||
</div>
|
||||
<div class="name">
|
||||
<h3 class="title">Christian Louboutin</h3>
|
||||
<h6>Designer</h6>
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link btn-dribbble"><i class="fa fa-dribbble"></i></a>
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link btn-twitter"><i class="fa fa-twitter"></i></a>
|
||||
<a href="#pablo" class="btn btn-just-icon btn-link btn-pinterest"><i class="fa fa-pinterest"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="description text-center">
|
||||
<p>An artist of considerable range, Chet Faker — 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. </p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6 ml-auto mr-auto">
|
||||
<div class="profile-tabs">
|
||||
<ul class="nav nav-pills nav-pills-icons justify-content-center" role="tablist">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="#studio" role="tab" data-toggle="tab">
|
||||
<i class="material-icons">camera</i> Studio
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#works" role="tab" data-toggle="tab">
|
||||
<i class="material-icons">palette</i> Work
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#favorite" role="tab" data-toggle="tab">
|
||||
<i class="material-icons">favorite</i> Favorite
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-content tab-space">
|
||||
<div class="tab-pane active text-center gallery" id="studio">
|
||||
<div class="row">
|
||||
<div class="col-md-3 ml-auto">
|
||||
<img src="../assets/img/examples/studio-1.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/studio-2.jpg" class="rounded">
|
||||
</div>
|
||||
<div class="col-md-3 mr-auto">
|
||||
<img src="../assets/img/examples/studio-5.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/studio-4.jpg" class="rounded">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane text-center gallery" id="works">
|
||||
<div class="row">
|
||||
<div class="col-md-3 ml-auto">
|
||||
<img src="../assets/img/examples/olu-eletu.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/clem-onojeghuo.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/cynthia-del-rio.jpg" class="rounded">
|
||||
</div>
|
||||
<div class="col-md-3 mr-auto">
|
||||
<img src="../assets/img/examples/mariya-georgieva.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/clem-onojegaw.jpg" class="rounded">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane text-center gallery" id="favorite">
|
||||
<div class="row">
|
||||
<div class="col-md-3 ml-auto">
|
||||
<img src="../assets/img/examples/mariya-georgieva.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/studio-3.jpg" class="rounded">
|
||||
</div>
|
||||
<div class="col-md-3 mr-auto">
|
||||
<img src="../assets/img/examples/clem-onojeghuo.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/olu-eletu.jpg" class="rounded">
|
||||
<img src="../assets/img/examples/studio-1.jpg" class="rounded">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer footer-default">
|
||||
<div class="container">
|
||||
<nav class="float-left">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com">
|
||||
Creative Tim
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://creative-tim.com/presentation">
|
||||
About Us
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://blog.creative-tim.com">
|
||||
Blog
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.creative-tim.com/license">
|
||||
Licenses
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="copyright float-right">
|
||||
©
|
||||
<script>
|
||||
document.write(new Date().getFullYear())
|
||||
</script>, made with <i class="material-icons">favorite</i> by
|
||||
<a href="https://www.creative-tim.com" target="_blank">Creative Tim</a> for a better web.
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- Core JS Files -->
|
||||
<script src="../assets/js/core/jquery.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/popper.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/core/bootstrap-material-design.min.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/plugins/moment.min.js"></script>
|
||||
<!-- Plugin for the Datepicker, full documentation here: https://github.com/Eonasdan/bootstrap-datetimepicker -->
|
||||
<script src="../assets/js/plugins/bootstrap-datetimepicker.js" type="text/javascript"></script>
|
||||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
|
||||
<script src="../assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
|
||||
<!-- Google Maps Plugin -->
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||
<!-- Control Center for Material Kit: parallax effects, scripts for the example pages etc -->
|
||||
<script src="../assets/js/material-kit.js?v=2.0.5" type="text/javascript"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user