creativetimofficial--ui
Stefan
579 行
29 KiB
HTML
579 行
29 KiB
HTML
<!--
|
|
=========================================================
|
|
Material Dashboard - v2.1.2
|
|
=========================================================
|
|
|
|
Product Page: https://www.creative-tim.com/product/material-dashboard
|
|
Copyright 2020 Creative Tim (https://www.creative-tim.com)
|
|
Licensed under MIT (https://github.com/creativetimofficial/material-dashboard/blob/master/LICENSE.md)
|
|
|
|
Coded by Creative Tim
|
|
|
|
=========================================================
|
|
|
|
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 content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
<!-- Favicons -->
|
|
<link rel="apple-touch-icon" href="assets-old/img/apple-icon.png">
|
|
<link rel="icon" href="assets-old/img/favicon.png">
|
|
<title>
|
|
Material Dashboard | Bootstrap 4 Material Design
|
|
</title>
|
|
<!-- Canonical SEO -->
|
|
<link rel="canonical" href="https://www.creative-tim.com/product/material-dashboard">
|
|
|
|
<!-- Social tags -->
|
|
<meta name="keywords" content="creative tim, html dashboard, html css template, web template, bootstrap, css3 template, frontend, responsive bootstrap template, bootstrap 4 dashboard, premium bootstrap dashboard, responsive dashboard, open source">
|
|
|
|
<meta name="description" content="Prototype and Develop with a Badass Bootstrap 4 Admin Template inspired by Material Design.">
|
|
|
|
<!-- Schema.org markup for Google+ -->
|
|
<meta itemprop="name" content="Material Dashboard by Creative Tim">
|
|
<meta itemprop="description" content="Prototype and Develop with a Badass Bootstrap 4 Admin Template inspired by Material Design.">
|
|
|
|
<meta itemprop="image" content="https://s3.amazonaws.com/creativetim_bucket/products/50/opt_md_thumbnail.jpg">
|
|
|
|
<!-- Twitter Card data -->
|
|
<meta name="twitter:card" content="product">
|
|
<meta name="twitter:site" content="@creativetim">
|
|
<meta name="twitter:title" content="Material Dashboard by Creative Tim">
|
|
|
|
<meta name="twitter:description" content="Prototype and Develop with a Badass Bootstrap 4 Admin Template inspired by Material Design.">
|
|
<meta name="twitter:creator" content="@creativetim">
|
|
<meta name="twitter:image" content="https://s3.amazonaws.com/creativetim_bucket/products/50/opt_md_thumbnail.jpg">
|
|
<meta name="twitter:data1" content="Material Dashboard by Creative Tim">
|
|
<meta name="twitter:label1" content="Product Type">
|
|
<meta name="twitter:label2" content="Price">
|
|
|
|
<!-- Open Graph data -->
|
|
<meta property="fb:app_id" content="655968634437471">
|
|
<meta property="og:title" content="Material Dashboard by Creative Tim">
|
|
<meta property="og:type" content="article">
|
|
<meta property="og:url" content="https://demos.creative-tim.com/material-dashboard/presentation.html">
|
|
<meta property="og:image" content="https://s3.amazonaws.com/creativetim_bucket/products/50/opt_md_thumbnail.jpg">
|
|
<meta property="og:description" content="Prototype and Develop with a Badass Bootstrap 4 Admin Template inspired by Material Design.">
|
|
<meta property="og:site_name" content="Creative Tim">
|
|
|
|
<!-- 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" />
|
|
<link rel="stylesheet" href="https://s3.amazonaws.com/creativetim_bucket/static-assets-old/material-kit.min.css">
|
|
|
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
|
<link href="https://s3.amazonaws.com/creativetim_bucket/static-assets-old/material-kit-demo.min.css" rel="stylesheet" />
|
|
<style>
|
|
|
|
.section-technologies a img{
|
|
max-width: 100%;
|
|
}
|
|
.technologies{
|
|
text-align: center;
|
|
margin-bottom: 50px;
|
|
}
|
|
.technologies a{
|
|
margin: 30px 15px 0px;
|
|
max-width: 65px;
|
|
display: inline-block;
|
|
}
|
|
@media(max-width:767px){
|
|
.social-img{
|
|
display: none;
|
|
}
|
|
.area-img{
|
|
display: none;
|
|
}
|
|
|
|
.info-img{
|
|
display: none;
|
|
}
|
|
|
|
.navbar-nav .dropdown{
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
</style>
|
|
<!-- Google Tag Manager -->
|
|
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
|
|
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
|
|
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
|
|
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
|
|
})(window,document,'script','dataLayer','GTM-NKDMSK6');</script>
|
|
<!-- End Google Tag Manager -->
|
|
</head>
|
|
|
|
<body>
|
|
<!-- Google Tag Manager (noscript) -->
|
|
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NKDMSK6"
|
|
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
|
|
<!-- End Google Tag Manager (noscript) -->
|
|
<nav class="navbar navbar-color-on-scroll navbar-transparent fixed-top navbar-expand-lg " color-on-scroll="100" id="sectionsNav">
|
|
<div class="container">
|
|
<div class="navbar-translate">
|
|
<a class="navbar-brand" href="https://www.creative-tim.com" target="_blank">Creative Tim </a>
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" aria-expanded="false" aria-label="Toggle navigation">
|
|
<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="nav-item">
|
|
<a href="#pablo" id="twitter" class="nav-link sharrre" rel="tooltip" title="Tweet!">
|
|
<i class="fa fa-twitter"></i>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="#pablo" id="facebook" class="nav-link sharrre" rel="tooltip" title="Share!">
|
|
<i class="fa fa-facebook-square"></i>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="https://github.com/creativetimofficial/material-dashboard" target="_blank" class="nav-link">
|
|
<i class="fa fa-github mr-2"></i>
|
|
Github
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="https://demos.creative-tim.com/material-dashboard/examples/dashboard.html" target="_blank" class="nav-link">
|
|
<i class="material-icons">view_carousel</i>
|
|
Live Preview
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<div class="dropdown text-center">
|
|
<a href="#" class="btn btn-primary btn-round dropdown-toggle" data-toggle="dropdown" aria-expanded="true"><i class="material-icons">cloud_download</i> Download
|
|
<b class="caret"></b>
|
|
</a>
|
|
<ul class="dropdown-menu dropdown-menu-right">
|
|
<li>
|
|
<a href="https://github.com/creativetimofficial/material-dashboard/archive/master.zip" class="google-events" data-google-event="Download HTML Navbar">Download HTML
|
|
</a>
|
|
</li>
|
|
<li><a href="https://github.com/creativetimofficial/material-dashboard-react/archive/master.zip" class="google-events" data-google-event="Download React Navbar">Download React</a></li>
|
|
<li><a href="https://github.com/creativetimofficial/material-dashboard-angular2/archive/master.zip" class="google-events" data-google-event="Download Angular Navbar">Download Angular</a></li>
|
|
<li><a href="https://github.com/creativetimofficial/vue-material-dashboard/archive/master.zip" class="google-events" data-google-event="Download Vue Navbar">Download Vue</a></li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="page-header header-filter clear-filter" data-parallax="true" >
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<div class="brand">
|
|
<h1 class="title"> Material Dashboard</h1>
|
|
<h4>Free Admin for Bootstrap 4, React, Angular, Vue.js</h4>
|
|
<br>
|
|
|
|
<iframe src="https://yvoschaap.com/producthunt/counter.html#href=https://demos.creative-tim.com/material-dashboard/presentation.html?ref=producthunt&layout=wide" width="84" height="21" scrolling="no" frameborder="0" allowtransparency="true"></iframe>
|
|
|
|
<iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Ffacebook.com%2FCreativeTim&width=74&layout=button_count&action=like&size=small&show_faces=true&share=false&height=21&appId" data-size="small" width="76px" height="20px" style="border:none;overflow:hidden;" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
|
|
|
|
<a href="https://twitter.com/creativetim?ref_src=twsrc%5Etfw" data-size="small" class="twitter-follow-button" data-show-screen-name="false" data-show-count="true">Follow @creativetim</a>
|
|
|
|
<a class="github-button" href="https://github.com/creativetimofficial/material-dashboard" data-icon="octicon-star" data-size="small" data-show-count="true" aria-label="Star creativetimofficial/material-dashboard on GitHub">Star</a>
|
|
|
|
<a class="github-button" href="https://github.com/creativetimofficial/material-dashboard/fork" data-icon="octicon-repo-forked" data-size="small" data-show-count="true" aria-label="Fork creativetimofficial/material-dashboard on GitHub">Fork</a>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<img src="assets-old/img/imac1.png" class="imac">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main main-raised">
|
|
<div class="section section-technologies">
|
|
<div class="container">
|
|
<div class="row">
|
|
|
|
<div class="col-md-8 offset-2 text-center">
|
|
<h2 class="title">Modern technologies</h2>
|
|
<h4 class="description">
|
|
Material Dashboard is a free Material Design Admin with a fresh design inspired by Google's Material Design. Material Dashboard is built on top of modern frameworks. Having the coded and the designed versions for the same framework, your designers and developers will talk the same language.
|
|
</h4>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<div class="technologies">
|
|
|
|
<a href="https://getbootstrap.com/" target="_blank" rel="tooltip" title="" data-original-title="Bootstrap - Most popular front-end component library">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/bootstrap.jpg">
|
|
</a>
|
|
|
|
<a href="https://vuejs.org/" target="_blank" rel="tooltip" title="" data-original-title="Vue.js - The progressive javascript framework">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/vue.jpg">
|
|
</a>
|
|
|
|
<a href="https://angularjs.org/" target="_blank" rel="tooltip" title="" data-original-title="Angular - One framework. Mobile & desktop">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/angular.jpg">
|
|
</a>
|
|
|
|
<a href="https://reactjs.org/" target="_blank" rel="tooltip" title="" data-original-title="React - A JavaScript library for building user interfaces">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/react.jpg">
|
|
</a>
|
|
|
|
<a href="https://sass-lang.com/" target="_blank" rel="tooltip" title="" data-original-title="Sass - Powerful professional CSS extension language in the world">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/sass.jpg">
|
|
</a>
|
|
|
|
<a href="https://www.adobe.com/products/photoshop.html" target="_blank" rel="tooltip" title="" data-original-title="Adobe Photoshop - Software for digital images manipulation">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/ps.jpg">
|
|
</a>
|
|
|
|
<a href="https://www.sketchapp.com/" target="_blank" rel="tooltip" title="" data-original-title="Sketch - Digital design toolkit">
|
|
<img src="https://s3.amazonaws.com/creativetim_bucket/tim_static_images/presentation-page/sketch.jpg">
|
|
</a>
|
|
|
|
</div>
|
|
<div class="features-1">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="info text-center">
|
|
<div class="icon icon-rose">
|
|
<i class="material-icons">font_download</i>
|
|
</div>
|
|
<h3 class="info-title">Web Fonts</h3>
|
|
<p>By default, Material Dashboard is using <a href="https://fonts.google.com/specimen/Roboto">Roboto Google</a> font, but it can easily be changed with any other Google font.</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="info text-center">
|
|
<div class="icon icon-info">
|
|
<i class="material-icons">view_carousel</i>
|
|
</div>
|
|
<h3 class="info-title">Google Material Design</h3>
|
|
<p>Material Dashboard has a fresh design inspired by Google's Material Design.</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="info text-center">
|
|
<div class="icon icon-success">
|
|
<i class="material-icons">phonelink</i>
|
|
</div>
|
|
<h3 class="info-title">Scalable</h3>
|
|
<p>Vector-only shapes scale to any size, including retina, with no optimization required.</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="info text-center">
|
|
<div class="icon icon-warning">
|
|
<i class="material-icons">dashboard</i>
|
|
</div>
|
|
<h3 class="info-title">Bootstrap 4</h3>
|
|
<p>Material Dashboard is is based on the popular Bootstrap 4 framework. </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="section-components">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-5">
|
|
<h2 class="title">Basic Components
|
|
<h6 class="category">The core elements of your website</h6>
|
|
<h5 class="description">We re-styled every Bootstrap element to make it resemble Material Design and also fit with each other. All the Bootstrap components that you need in a development have been re-design with the new look. All these items will help you take your project to the next level.
|
|
</h5>
|
|
</h2>
|
|
</div>
|
|
<div class="col-lg-6 ml-auto">
|
|
<div class="image-container">
|
|
<img class="components-macbook" src="assets-old/img/Macbook.png" alt="" />
|
|
<img class="table-img" src="assets-old/img/ex1.png" style="box-shadow:none; height: 230px;" salt="" />
|
|
<img class="share-btn-img" src="assets-old/img/ex2.png" style="box-shadow:none; height: 70px;" alt="" />
|
|
<img class="social-img" src="assets-old/img/ex3.png" style="height: 50px;" alt="" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="section section-content">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-7 mr-auto">
|
|
<div class="image-container">
|
|
<img class="ipad-img" src="assets-old/img/iPad2.png">
|
|
<img class="area-img add-animation animated" src="assets-old/img/notification.png" style="box-shadow:none; width:360px; left:50%;">
|
|
<img class="info-img add-animation animated" src="assets-old/img/table.png" style="box-shadow:none; width:450px; left: 0;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="section-description">
|
|
<h2 class="title">Content Areas</h2>
|
|
<h6 class="category">For Areas that Need More Space</h6>
|
|
<h5 class="description">If you need elements such as tables, comments, description areas, tabs and many others, we've got you covered. We took into consideration multiple use cases and came up with some specific elements that you will love to use. They're beautiful and easy to use for the end user navigating your website. </h5>
|
|
<br>
|
|
<a href="https://demos.creative-tim.com/material-dashboard/examples/tables.html" class="btn btn-primary btn-round" target="_blank">View Content Areas</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="features-3">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<!-- Some <br /> tags to push the text to align with the image, you can remove it if you have more text on the right side :-) -->
|
|
<h2 class="title">Your life will be much easier</h2>
|
|
|
|
<div class="info info-horizontal">
|
|
<div class="icon icon-primary">
|
|
<i class="material-icons">child_friendly</i>
|
|
</div>
|
|
<div class="description">
|
|
<h4 class="info-title">Easy to Use</h4>
|
|
<p>Every element that you need in a product comes built in as a component. All components fit perfectly with each other and can take variations in colour.</p>
|
|
</div>
|
|
</div>
|
|
<div class="info info-horizontal">
|
|
<div class="icon icon-primary">
|
|
<i class="material-icons">access_time</i>
|
|
</div>
|
|
<div class="description">
|
|
<h4 class="info-title">Fast Prototyping</h4>
|
|
<p>Using the Material Dashboard will save you large amount of time. You don't have to worry about customising the basic Bootstrap 4 design or generating new components.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="image-container-responsive">
|
|
<img src="assets-old/img/ipad.png">
|
|
<img class="phone" style="width:50%;" src="assets-old/img/iphonex.png">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<div class="section section-download">
|
|
<div class="container">
|
|
<div class="row text-center">
|
|
<div class="col-2">
|
|
</div>
|
|
<div class="col-md-8">
|
|
<h2 class="title">Do you love this UI Dashboard?</h2>
|
|
<h4>Cause if you do, it can be yours for FREE. Hit the buttons below to download the HTML, React, Angular or Vue version. Start a new project or give an old Bootstrap 4 project a new look!</h4>
|
|
</div>
|
|
<div class="col-2">
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row">
|
|
|
|
<div class="col-lg-3 text-center">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<img src="assets-old/img/html.png">
|
|
</div>
|
|
</div>
|
|
<h3>For HTML Lovers</h3>
|
|
<p>Material Dashboard HTML was built over the popular Bootstrap 4 framework</p>
|
|
|
|
<a href="https://github.com/creativetimofficial/material-dashboard/archive/master.zip" data-google-event="Download HTML Footer" class="btn btn-warning btn-round google-events">
|
|
Download HTML
|
|
</a>
|
|
</div>
|
|
<div class="col-lg-3 text-center">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<img src="assets-old/img/react.png">
|
|
|
|
</div>
|
|
</div>
|
|
<h3>For React Lovers</h3>
|
|
<p>Material Dashboard React was built over the popular Material-UI framework</p>
|
|
<a href="https://github.com/creativetimofficial/material-dashboard-react/archive/master.zip" data-google-event="Download React Footer" class="btn btn-info btn-round google-events">
|
|
Download React
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-lg-3 text-center">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<img src="assets-old/img/angular.png">
|
|
|
|
</div>
|
|
</div>
|
|
<h3>For Angular Lovers</h3>
|
|
<p>Material Dashboard HTML was built over the popular Bootstrap 4 and Angular 5</p>
|
|
<a href="https://github.com/creativetimofficial/material-dashboard-angular2/archive/master.zip" data-google-event="Download Angular Footer" class="btn btn-danger btn-round google-events">
|
|
Download Angular
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-lg-3 text-center">
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<img src="assets-old/img/vue.png">
|
|
|
|
</div>
|
|
</div>
|
|
<h3>For Vue Lovers</h3>
|
|
<p>Vue Material Dashboard is a beautiful resource built over Vue Material and Vuejs</p>
|
|
<a href="https://github.com/creativetimofficial/vue-material-dashboard/archive/master.zip" data-google-event="Download Angular Footer" class="btn btn-success btn-round google-events">
|
|
Download Vue
|
|
</a>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<br><br>
|
|
|
|
<div class="text-center">
|
|
<h3>Thank you for supporting us!</h3>
|
|
</div>
|
|
<br>
|
|
<div class="col-12 text-center">
|
|
|
|
<a class="github-button" href="https://github.com/creativetimofficial/material-dashboard" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star creativetimofficial/material-dashboard on GitHub">Star</a>
|
|
|
|
<a class="github-button" href="https://github.com/creativetimofficial/material-dashboard/fork" data-icon="octicon-repo-forked" data-size="large" data-show-count="true" aria-label="Fork creativetimofficial/material-dashboard on GitHub">Fork</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<a class="footer-brand" href="https://demos.creative-tim.com/material-dashboard/examples/dashboard.html">Material Dashboard</a>
|
|
<ul class="pull-center">
|
|
<li>
|
|
<a href="https://www.creative-tim.com/" target="_blank">
|
|
Creative Tim
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://presentation.creative-tim.com/" target="_blank">
|
|
About Us
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="http://blog.creative-tim.com/" target="_blank">
|
|
Blog
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="https://www.creative-tim.com/license" target="_blank">
|
|
Licenses
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="copyright pull-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="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
|
|
<script src="https://unpkg.com/popper.js/dist/umd/popper.min.js"></script>
|
|
<script src="https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.js"></script>
|
|
<script src="https://s3.amazonaws.com/creativetim_bucket/static-assets-old/material-kit.min.js"></script>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.7.1/modernizr.min.js"></script>
|
|
|
|
<!-- Sharrre library -->
|
|
<script src="assets-old/demo/jquery.sharrre.js"></script>
|
|
|
|
<script src="https://s3.amazonaws.com/creativetim_bucket/static-assets-old/material-kit-demo.min.js"></script>
|
|
<script src="https://buttons.github.io/buttons.js"></script>
|
|
|
|
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
|
|
|
|
<script type="text/javascript">
|
|
|
|
$(document).ready(function() {
|
|
|
|
$('#twitter').sharrre({
|
|
share: {
|
|
twitter: true
|
|
},
|
|
enableHover: false,
|
|
enableTracking: false,
|
|
buttons: { twitter: {}},
|
|
click: function(api, options){
|
|
api.simulateClick();
|
|
api.openPopup('twitter');
|
|
},
|
|
template:'<i class="fa fa-twitter"></i>',
|
|
url: 'https://demos.creative-tim.com/material-dashboard/examples/dashboard.html'
|
|
});
|
|
|
|
$('#facebook').sharrre({
|
|
share: {
|
|
facebook: true
|
|
},
|
|
buttons: {
|
|
facebook: {}
|
|
},
|
|
|
|
enableHover: false,
|
|
enableTracking: false,
|
|
click: function(api, options){
|
|
api.simulateClick();
|
|
api.openPopup('facebook');
|
|
},
|
|
template: '<i class="fa fa-facebook-square"></i>',
|
|
url: 'https://demos.creative-tim.com/material-dashboard/examples/dashboard.html'
|
|
});
|
|
|
|
|
|
});
|
|
|
|
</script>
|
|
<script>
|
|
// Facebook Pixel Code Don't Delete
|
|
!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
|
|
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
|
|
n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
|
|
t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
|
|
document,'script','//connect.facebook.net/en_US/fbevents.js');
|
|
|
|
try{
|
|
fbq('init', '111649226022273');
|
|
fbq('track', "PageView");
|
|
|
|
}catch(err) {
|
|
console.log('Facebook Track Error:', err);
|
|
}
|
|
</script>
|
|
<noscript>
|
|
<img height="1" width="1" style="display:none"
|
|
src="https://www.facebook.com/tr?id=111649226022273&ev=PageView&noscript=1"
|
|
/>
|
|
</noscript>
|
|
|
|
</body>
|
|
|
|
</html>
|