<!--
* @Description: In User Settings Edit
* @Author: your name
* @Date: 2019-04-23 17:33:02
* @LastEditTime: 2019-12-06 10:45:44
* @LastEditors: Please set LastEditors
-->
<!DOCTYPE html>
< html lang = "en" >
< head >
< title > 凤凰商城 - 汽车零配件网上商城(刹车、滤芯、电瓶、引擎)< / title >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" / >
<!-- @todo: fill with your company info or remove -->
< meta name = "description" content = "" >
< meta name = "author" content = "Themelize.me" >
<!-- Bootstrap v4.1.3 CSS via CDN -->
< link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" >
<!-- Plugins required on all pages NOTE: Additional non - required plugins are loaded ondemand as of AppStrap 2.5 -->
<!-- Theme style -->
< link href = "assets/css/theme-style.min.css" rel = "stylesheet" >
<!-- Shop UI CSS - required if using shopping cart or any shop pages -->
< link href = "assets/css/theme-shop.min.css" rel = "stylesheet" >
<!-- Your custom colour override -->
< link href = "#" id = "colour-scheme" rel = "stylesheet" >
<!-- Your custom override -->
< link href = "assets/css/custom-style.css" rel = "stylesheet" >
<!-- Optional: ICON SETS -->
<!-- Iconset: Font Awesome 5.0.13 via CDN -->
< link href = "https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel = "stylesheet" >
<!-- Iconset: flag icons - http://lipis.github.io/flag - icon - css/ -->
< link href = "assets/plugins/flag-icon-css/css/flag-icon.min.css" rel = "stylesheet" >
<!-- Iconset: ionicons - http://ionicons.com/ -->
< link href = "http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel = "stylesheet" >
<!-- Iconset: Linearicons - https://linearicons.com/free -->
< link href = "https://cdn.linearicons.com/free/1.0.0/icon-font.min.css" rel = "stylesheet" >
<!-- Iconset: Lineawesome - https://icons8.com/articles/line - awesome -->
< link href = "https://maxcdn.icons8.com/fonts/line-awesome/1.1/css/line-awesome.min.css" rel = "stylesheet" >
<!-- Le fav and touch icons - @todo: fill with your icons or remove, try https://realfavicongenerator.net -->
< link rel = "manifest" href = "assets/favicons/manifest.json" >
< link rel = "shortcut icon" href = "assets/favicons/favicon.ico" >
< meta name = "msapplication-config" content = "assets/favicons/browserconfig.xml" >
< meta name = "theme-color" content = "#ffffff" >
<!-- Google fonts -->
< link href = 'assets/fonts/OpenSans.css' rel = 'stylesheet' type = 'text/css' >
< link href = 'assets/fonts/Rambla.css' rel = 'stylesheet' type = 'text/css' >
< link href = 'assets/fonts/Calligraffitti.css' rel = 'stylesheet' type = 'text/css' >
< link href = 'assets/fonts/RobotoSlab.css' rel = 'stylesheet' type = 'text/css' >
< link href = 'assets/fonts/Roboto.css' rel = 'stylesheet' type = 'text/css' >
< / head >
<!-- ======== @Region: body ======== -->
< body class = "page page-shop header-compact-sticky page-shop navbar-layout-navbar-below" >
<!-- @plugin: page loading indicator, delete to remove loader -->
< div class = "page-loader" data-toggle = "page-loader" > < / div >
< a id = "#top" href = "#content" class = "sr-only" > Skip to content< / a >
<!-- ======== @Region: #header ======== -->
< div id = "header" >
< div data-toggle = "sticky" >
<!-- Header search region - hidden by default -->
< div class = "header-search collapse" id = "search" >
< form class = "search-form container" >
< input type = "text" name = "search" class = "form-control search" value = "" placeholder = "Search" >
< button type = "button" class = "btn btn-link" > < span class = "sr-only" > Search < / span > < i class = "fa fa-search fa-flip-horizontal search-icon" > < / i > < / button >
< button type = "button" class = "btn btn-link close-btn" data-toggle = "search-form-close" > < span class = "sr-only" > Close < / span > < i class = "fa fa-times search-icon" > < / i > < / button >
< / form >
< / div >
<!-- Header & Branding region -->
< div class = "header" >
<!-- all direct children of the .header - inner element will be vertically aligned with each other you can override all the behaviours using the flexbox utilities (flexbox.html) All elements with .header - brand & .header - block - flex wrappers will automatically be aligned inline & vertically using flexbox, this can be overridden using the flexbox utilities (flexbox.htm) Use .header - block to stack elements within on small screen & "float" on larger screens use .order - first or/and .order - last classes to make an element show first or last within .header - inner or .headr - block elements -->
< div class = "header-inner container justify-content-start" >
<!-- branding/logo -->
< div class = "header-brand" >
< img src = "assets/img/logo/logo.png" height = "50" width = "50" class = "pull-left mr-1" >
< a class = "header-brand-text" href = "#" title = "Home" >
< h1 class = "h2" >
< span class = "header-brand-text-alt" > 凤凰汽车零部件 < / span > 网上商城
< / h1 >
< / a >
< / div >
<!-- other header content -->
< div class = "header-block order-12" >
< div class = "flex-column text-right d-none d-lg-flex mr-2" >
< h6 class = "my-0 mt-1" >
< i class = "fa fa-truck text-primary" > < / i > 全球限时免邮
< / h6 >
< / div >
<!-- Search trigger -->
< a href = "#search" class = "btn btn-icon btn-link header-btn float-right order-11" data-toggle = "search-form" data-target = ".header-search" > < i class = "fa fa-search fa-flip-horizontal search-icon" > < / i > < / a >
<!-- mobile collapse menu button - data - toggle="collapse" = default BS menu - data - toggle="off - canvas" = Off - cavnas Menu - data - toggle="overlay" = Overlay Menu -->
< a href = "#top" class = "btn btn-link btn-icon header-btn float-right d-lg-none" data-toggle = "off-canvas" data-target = ".navbar-main" data-settings = '{"cloneTarget":true, "targetClassExtras": "navbar-offcanvas"}' > < i class = "fa fa-bars" > < / i > < / a >
< div class = "header-divider d-none d-lg-block" > < / div >
<!-- Shopping cart -->
< div class = "dropdown dropdowns-no-carets dropdown-effect-fadeup float-right" >
< a href = "#" class = "btn btn-icon btn-dark btn-link float-right dropdown-toggle cart-link" data-toggle = "dropdown" >
< span class = "cart-link-icon" > < i class = "fa fa-shopping-cart" > < / i > < span class = "sr-only" > Cart< / span > < span class = "cart-link-count bg-primary text-white" > 2< / span > < / span >
< / a >
<!-- Shopping cart dropdown -->
< div class = "dropdown-menu dropdown-menu-right dropdown-menu-arrow cart-dropdown-menu" role = "menu" >
< h5 class = "dropdown-header mb-0" >
购物车列表
< / h5 >
< hr class = "mt-0 mb-3" / >
<!-- Shopping cart items -->
< div class = "cart-items" >
<!-- Shopping cart item 1 -->
< div class = "cart-items-item" >
< a href = "#" class = "cart-img mr-2 float-left" >
< img class = "img-fluid" src = "assets/img/shop/air01.jpeg" alt = "Product 1" >
< / a >
< div class = "float-left" >
< h5 class = "mb-0" >
空气滤芯
< / h5 >
< p class = "mb-0" > ¥90 / x2< / p >
< a href = "#" class = "close cart-remove text-primary" > < i class = "fa fa-times" > < / i > < / a >
< / div >
< / div >
<!-- Shopping cart item 2 -->
< div class = "cart-items-item" >
< a href = "#" class = "cart-img mr-2 float-left" >
< img class = "img-fluid" src = "assets/img/shop/air02.jpeg" alt = "Product 2" >
< / a >
< div class = "float-left" >
< h5 class = "mb-0" >
汽油滤芯
< / h5 >
< p class = "mb-0" > ¥69 / x1< / p >
< a href = "#" class = "close cart-remove text-primary" > < i class = "fa fa-times" > < / i > < / a >
< / div >
< / div >
< / div >
<!-- End of Shopping cart items -->
< hr class = "mt-3 mb-0" / >
< div class = "dropdown-footer text-center" >
< h5 class = "font-weight-bold" >
合计: < span class = "text-primary" > ¥249< / span >
< / h5 >
< a href = "#" tabindex = "-1" class = "btn btn-outline-primary btn-sm btn-rounded mx-2" > 清理购物车< / a > < a href = "#" tabindex = "-1" class = "btn btn-primary btn-sm btn-rounded mx-2" > 去结算< / a >
< / div >
< / div >
< / div >
<!-- end of shopping cart -->
< / div >
< / div >
< / div >
< div class = "navbar navbar-expand-md" >
<!-- everything within this div is collapsed on mobile -->
< div class = "navbar-main collapse bg-grey-dark navbar-dark" >
< div class = "container clearfix" >
<!-- main navigation -->
< ul class = "nav navbar-nav float-lg-left navbar-nav-flush dropdown-effect-fadeup ml-1" >
<!-- Shop Homepage -->
< li class = "nav-item" > < a href = "index" class = "nav-link" > 主页< / a > < / li >
< li class = "nav-item" > < a href = "#" class = "nav-link" > 产品列表< / a > < / li >
< li class = "nav-item" > < a href = "#" class = "nav-link" > 招商加盟< / a > < / li >
< li class = "nav-item" > < a href = "shop_list" class = "nav-link" > 线下门店< / a > < / li >
< li class = "nav-item" > < a href = "#" class = "nav-link" > 客服中心< / a > < / li >
< / ul >
<!-- All Categories menu -->
< ul class = "nav navbar-nav float-lg-right navbar-nav-flush-right dropdown-effect-fadeup" >
< li class = "nav-item dropdown dropdowns-no-carets dropdown-persist" >
< a href = "#" class = "nav-link dropdown-toggle" id = "account-drop" data-toggle = "dropdown" data-hover = "dropdown" > < i class = "fa fa-user mr-2" > < / i > 我的账户< / a >
<!-- Dropdown Menu -->
< div class = "dropdown-menu dropdown-menu-right" > < a href = "#" class = "dropdown-item" > 我的收藏< / a > < a href = "#" class = "dropdown-item" > 订单记录< / a >
< / li >
< li class = "nav-item dropdown dropdowns-no-carets dropdown-persist" > < a href = "#" class = "btn btn-primary btn-sm btn-rounded text-uppercase font-weight-bold px-3 ml-3" > 促销商品< / a > < / li >
< / ul >
< / div >
< / div >
<!-- /.navbar - collapse -->
< / div >
< / div >
< / div >
<!-- ======== @Region: #highlighted ======== -->
< div id = "highlighted" >
<!-- Showshow - Slider Revolution see: plugins/slider - revolution/examples&sources for help invoke using data - toggle="slider - rev" options can be passed to the slider via HTML5 data - ie. data - startwidth="960" -->
< div class = "slider-wrapper rev_slider_wrapper bg-black" data-page-class = "slider-appstrap-theme" >
< div class = "rev_slider" data-toggle = "slider-rev" data-settings = '{"startwidth":1100, "startheight":500, "delay":10000}' >
< ul >
<!-- SLIDE 1 -->
< li class = "slide" data-transition = "fadethroughdark" data-slotamount = "7" data-hideafterloop = "0" data-hideslideonmobile = "off" data-easein = "default" data-easeout = "default" data-masterspeed = "default" data-thumb = "assets/img/shop/mens-1-thumb.jpg" data-rotate = "0" data-saveperformance = "off" data-title = "Slide" >
< img src = "assets/img/slide-dummy.png" style = 'background-color:#151513' data-lazyload = "assets/img/transparent.png" alt = "Background image" data-bgposition = "center top" data-bgfit = "cover" data-bgparallax = "10" class = "rev-slidebg" data-no-retina / >
<!-- SLIDE 1 Content -->
< div class = "slide-content container pos-zindex-80" >
<!-- elements within .slide - content are pushed below navbar on "behind" -->
<!-- Layer 1 -->
< div class = "tp-caption text-grey" data-x = "['left','left','left','left']" data-hoffset = "['0','0','0','40']" data-y = "['bottom','bottom','bottom','bottom']" data-voffset = "['140','140','140','140']" data-fontsize = "['52','52','52','52']" data-lineheight = "['52','52','52','52']" data-width = "420" data-height = "none" data-whitespace = "normal" data-type = "text" data-basealign = "slide" data-responsive_offset = "on" data-frames = '[{"from":"y:[100%];z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;","mask":"x:0px;y:0px;s:inherit;e:inherit;","speed":1200,"to":"o:1;","delay":1300,"ease":"Power3.easeInOut"},{"delay":"wait","speed":1000,"to":"opacity:0;","ease":"nothing"}]' data-textAlign = "left" > < span class = "font-weight-bold text-uppercase text-white" > Phoenix-BC86刹车钳促销中!< / span >
< / div >
<!-- Layer 3 -->
< div class = "tp-caption text-grey" data-x = "['left','left','left','left']" data-hoffset = "['0','0','0','40']" data-y = "['bottom','bottom','bottom','bottom']" data-voffset = "['80','80','80','80']" data-fontsize = "['20','20','20','30']" data-width = "none" data-height = "none" data-whitespace = "nowrap" data-type = "text" data-basealign = "slide" data-responsive_offset = "on" data-frames = '[{"delay":0,"speed":1200,"frame":"0","from":"y:[100%];z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0;","to":"o:1;","delay":1400},{"delay":"wait","speed":300,"frame":"999","to":"auto:auto;","ease":"Power3.easeInOut"}]' data-textAlign = "['center','center','center','center']" > 最高可享8折优惠!
< / div >
<!-- Layer 3 -->
< div class = "tp-caption rs-parallaxlevel-8" data-frames = '[{"from":"o:0;sX:3;sY:3;","speed":1500,"to":"o:0.20;sX:3;sY:3;","delay":500,"ease":"Power3.easeInOut"},{"delay":"wait","speed":1200,"to":"x:[100%];","ease":"Power3.easeInOut"}]' data-x = "left" data-y = "bottom" data-hoffset = "0" data-voffset = "0" data-width = "none" data-height = "none" data-type = "image" data-basealign = "slide" > < i class = "fa fa-bullseye icon-20x icon-bg op-1 text-white" > < / i >
< / div >
<!-- Layer 4 -->
< div class = "tp-caption tp-resizeme bg-primary-bright" data-frames = '[{"from":"x:[-100%];z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;","mask":"x:0px;y:0px;s:inherit;e:inherit;","speed":1500,"to":"o:1;","delay":500,"ease":"Power3.easeInOut"},{"delay":"wait","speed":1000,"to":"x:[100%];","mask":"x:inherit;y:inherit;s:inherit;e:inherit;","ease":"Power3.easeInOut"}]' data-x = "['left','left','left','left']" data-hoffset = "['0','0','0','40']" data-y = "bottom" data-voffset = "120" data-width = "380" data-height = "4" data-basealign = "slide" > < / div >
< / div >
< div class = "tp-caption tp-resizeme" data-x = "['right','right','right','right']" data-hoffset = "['0','0','0','0']" data-y = "['top','top','top','top']" data-voffset = "['0','0','0','0']" data-width = "full-proportional"
data-height="full-proportional"
data-whitespace="nowrap"
data-type="image" data-responsive_offset="on" data-frames='[{"delay":500,"speed":3800,"frame":"0","from":"opacity:0;x:150%;","to":"o:1;x:0;","ease":"Circ.easeOut"},{"delay":"wait","speed":300,"frame":"999","to":"opacity:0;","ease":"Power3.easeInOut"}]'
data-textAlign="['inherit','inherit','inherit','inherit']"
data-paddingtop="[0,0,0,0]"
data-paddingright="[0,0,0,0]"
data-paddingbottom="[0,0,0,0]"
data-paddingleft="[0,0,0,0]"
style="z-index: 5;">
< img src = "assets/img/slide-dummy.png" alt = "" data-lazyload = "assets/img/shop/slider-car-1.png" data-no-retina / >
< / div >
< / li >
< / ul >
< div class = "tp-bannertimer tp-bottom" > < / div >
< / div >
<!-- end of tp - banner -->
< / div >
< / div >
<!-- ======== @Region: #content ======== -->
< form id = "choice" name = 'form' method = "POST" action = "/" >
< div id = "content" class = "p-0" >
<!-- Most Popular Products -->
< div id = "features" class = "container py-4 py-lg-6" >
< hr class = "hr-lg mt-0 mb-3 w-10 mx-auto hr-primary" / >
< h2 class = "text-center text-uppercase font-weight-bold my-0" >
最受 欢迎 产品
< / h2 >
< h5 class = "text-center font-weight-light mt-2 mb-0 text-muted" >
Great products, great value!
< / h5 >
< hr class = "mb-5 w-50 mx-auto" / >
<!-- Products cards -->
< div class = "card-deck-wrapper" >
< div class = "card-deck" >
<!-- Product 1 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud01.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_a}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "a" name = "vote" class = "btn btn-primary btn-vote text-light" value = "a" > ❤ LIKE< / a >
< / div >
< / div >
<!-- Product 2 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud02.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_b}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "b" name = "vote" class = "btn btn-primary btn-vote text-light" value = "b" > ❤ LIKE< / a >
< / div >
< / div >
<!-- Product 3 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud03.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_c}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "c" name = "vote" class = "btn btn-primary btn-vote text-light" value = "c" > ❤ LIKE< / a >
< / div >
< / div >
< / div >
< br / >
< div class = "card-deck" >
<!-- Product 4 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud04.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_d}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "d" name = "vote" class = "btn btn-primary btn-vote text-light" value = "d" > ❤ LIKE< / a >
< / div >
< / div >
<!-- Product 5 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud05.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_e}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "e" name = "vote" class = "btn btn-primary btn-vote text-light" value = "e" > ❤ LIKE< / a >
< / div >
< / div >
<!-- Product 6 -->
< div class = "card product-card" >
<!-- Image & price content -->
< div class = "pos-relative" >
< img class = "card-img-top img-fluid" src = "assets/img/shop/devcloud06.jpg" alt = "Card image cap" >
< / div >
<!-- Content -->
< div class = "card-body" >
< h5 class = "card-title" >
{{option_f}}
< / h5 >
< / div >
< div class = "card-footer" >
< a id = "f" name = "vote" class = "btn btn-primary btn-vote text-light" value = "f" btn-vote > ❤ LIKE< / a >
< / div >
< / div >
< / div >
< / div >
< / div >
<!-- Call to action -->
< / div >
< / form >
<!-- ======== @Region: #footer ======== -->
< footer id = "footer" >
< div class = "container" >
< div class = "row" >
< div class = "col-lg-4" >
< h3 class = "text-white text-uppercase text-slab font-weight-bold" >
凤凰< span class = "text-primary" > 商城< / span >
< / h3 >
< p class = "text-sm" > 顾客至上 服务第一 < / p >
< address >
< ul class = "list-unstyled text-sm" >
< li >
< abbr title = "Email" > < i class = "fa fa-envelope fa-fw text-white" > < / i > < / abbr >
Info@PartsUnlimited.com
< / li >
< / ul >
< / address >
<!-- social media icons -->
< div class = "mt-3 mb-4 mb-lg-0" >
<!-- @todo: replace with company social media details -->
< a href = "#" class = "btn btn-icon btn-dark btn-rounded btn-flat" > < i class = "fab fa-twitter" > < / i > < span class = "sr-only" > Fa twitter< / span > < / a >
< a href = "#" class = "btn btn-icon btn-dark btn-rounded btn-flat" > < i class = "fab fa-facebook-f" > < / i > < span class = "sr-only" > Fa facebook f< / span > < / a >
< a href = "#" class = "btn btn-icon btn-dark btn-rounded btn-flat" > < i class = "fab fa-linkedin-in" > < / i > < span class = "sr-only" > Fa linkedin in< / span > < / a >
< a href = "#" class = "btn btn-icon btn-dark btn-rounded btn-flat" > < i class = "fab fa-google-plus-g" > < / i > < span class = "sr-only" > Fa google plus g< / span > < / a >
< / div >
< / div >
< div class = "col-lg-7 offset-lg-1" >
< div class = "row" >
< div class = "col-6 col-md-3" >
< h4 class = "mt-0 text-slab" >
制动配件
< / h4 >
< ul class = "list-unstyled footer-links" >
< li > < a href = "#" > 刹车片< / a > < / li >
< li > < a href = "#" > 刹车钳< / a > < / li >
< li > < a href = "#" > 制动液< / a > < / li >
< li > < a href = "#" > 刹车软管< / a > < / li >
< / ul >
< / div >
< div class = "col-6 col-md-3" >
< h4 class = "mt-0 text-slab" >
滤清器
< / h4 >
< ul class = "list-unstyled footer-links" >
< li > < a href = "#" > 空气滤清器< / a > < / li >
< li > < a href = "#" > 燃油滤清器< / a > < / li >
< li > < a href = "#" > 机油滤清器< / a > < / li >
< / ul >
< / div >
< div class = "col-6 col-md-3" >
< h4 class = "mt-0 text-slab" >
电瓶
< / h4 >
< ul class = "list-unstyled footer-links" >
< li > < a href = "#" > 汽车电瓶< / a > < / li >
< li > < a href = "#" > 电瓶充电器< / a > < / li >
< li > < a href = "#" > 电瓶铜搭火线< / a > < / li >
< / ul >
< / div >
< div class = "col-6 col-md-3" >
< h4 class = "mt-0 text-slab" >
发动机配件
< / h4 >
< ul class = "list-unstyled footer-links" >
< li > < a href = "#" > 发动机垫圈< / a > < / li >
< li > < a href = "#" > 发动机曲轴< / a > < / li >
< li > < a href = "#" > 三元催化器< / a > < / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
< hr class = "my-4 hr-white op-1" / >
<!-- @todo: replace with company copyright details -->
< div class = "subfooter text-sm text-center" >
< p > Copyright 2018 © 无限极汽车零部件有限公司< / p >
< ul class = "list-inline footer-links" >
< li class = "list-inline-item" > < a href = "#" > 服务条款< / a > < / li >
< li class = "list-inline-item" > < a href = "#" > 隐私< / a > < / li >
< li class = "list-inline-item" > < a href = "#" > 联系我们< / a > < / li >
< / ul >
< / div >
< / div >
< a href = "#top" class = "btn btn-icon btn-dark pos-fixed pos-b pos-r mr-3 mb-3 scroll-state-hidden" title = "Back to top" data-scroll = "scroll-state" > < i class = "fa fa-chevron-up" > < / i > < / a >
< / footer >
<!-- Style switcher - demo only - @todo: remove in production -->
< div class = "colour-switcher" >
< a href = "#" class = "colour-switcher-toggle" data-toggle = "class" data-target = ".colour-switcher" > < i class = "fa fa-paint-brush" > < / i > < / a >
< h5 class = "text-uppercase my-0" >
Theme Colours
< / h5 >
< hr / >
< div class = "theme-colours" > < a href = "#green" class = "green active" data-toggle = "tooltip" data-placement = "right" data-original-title = "Green (Default)" > Green< / a > < a href = "#red" class = "red" data-toggle = "tooltip" data-placement = "right" data-original-title = "Red" > Red< / a > < a href = "#blue" class = "blue" data-toggle = "tooltip" data-placement = "right" data-original-title = "Blue" > Blue< / a > < a href = "#purple" class = "purple" data-toggle = "tooltip" data-placement = "right" data-original-title = "Purple" > Purple< / a > < a href = "#pink" class = "pink" data-toggle = "tooltip" data-placement = "right" data-original-title = "Pink" > Pink< / a > < a href = "#orange" class = "orange" data-toggle = "tooltip" data-placement = "right" data-original-title = "Orange" > Orange< / a > < a href = "#lime" class = "lime" data-toggle = "tooltip" data-placement = "right" data-original-title = "Lime" > Lime< / a > < a href = "#blue-dark" class = "blue-dark" data-toggle = "tooltip" data-placement = "right" data-original-title = "Blue-dark" > Blue-dark< / a > < a href = "#red-dark" class = "red-dark" data-toggle = "tooltip" data-placement = "right" data-original-title = "Red-dark" > Red-dark< / a > < a href = "#brown" class = "brown" data-toggle = "tooltip" data-placement = "right" data-original-title = "Brown" > Brown< / a > < a href = "#cyan-dark" class = "cyan-dark" data-toggle = "tooltip" data-placement = "right" data-original-title = "Cyan-dark" > Cyan-dark< / a > < a href = "#yellow" class = "yellow" data-toggle = "tooltip" data-placement = "right" data-original-title = "Yellow" > Yellow< / a > < a href = "#slate" class = "slate" data-toggle = "tooltip" data-placement = "right" data-original-title = "Slate" > Slate< / a > < a href = "#olive" class = "olive" data-toggle = "tooltip" data-placement = "right" data-original-title = "Olive" > Olive< / a > < a href = "#teal" class = "teal" data-toggle = "tooltip" data-placement = "right" data-original-title = "Teal" > Teal< / a > < a href = "#green-bright" class = "green-bright" data-toggle = "tooltip" data-placement = "right" data-original-title = "Green-bright" > Green-bright< / a > < / div >
< hr / >
< p class = "text-xs text-muted" > Cookies are NOT enabled so colour selection is not persistent.< / p >
< p class = "text-xs my-0" > < a href = "index.html" > Back to main homepage< / a > < / p >
< p class = "text-xs my-0" > < a href = "intro.html" > Back to intro page< / a > < / p >
< / div >
<!-- Hidden elements - excluded from jPanel Menu on mobile -->
< div class = "hidden-elements js-off-canvas-exclude" >
<!-- @modal - signup modal -->
< div class = "modal fade" id = "signup-modal" tabindex = "-1" role = "dialog" aria-hidden = "true" >
< div class = "modal-dialog" >
< form action = "signup.html" >
< div class = "modal-content" >
< div class = "modal-header bg-light" >
< h4 class = "modal-title" >
Sign Up
< / h4 >
< button type = "button" class = "close" data-dismiss = "modal" aria-hidden = "true" > × < / button >
< / div >
< div class = "modal-body" >
< div class = "form-group" >
< h6 class = "op-8" >
Price Plan
< / h6 >
< select class = "form-control" >
< option > Basic< / option >
< option > Pro< / option >
< option > Pro +< / option >
< / select >
< / div >
< hr / >
< h6 class = "op-8" >
Account Information
< / h6 >
< div class = "form-group" >
< label class = "sr-only" for = "signup-first-name" > First Name< / label >
< input type = "text" class = "form-control" id = "signup-first-name" placeholder = "First name" >
< / div >
< div class = "form-group" >
< label class = "sr-only" for = "signup-last-name" > Last Name< / label >
< input type = "text" class = "form-control" id = "signup-last-name" placeholder = "Last name" >
< / div >
< div class = "form-group" >
< label class = "sr-only" for = "signup-username" > Userame< / label >
< input type = "text" class = "form-control" id = "signup-username" placeholder = "Username" >
< / div >
< div class = "form-group" >
< label class = "sr-only" for = "signup-email" > Email address< / label >
< input type = "email" class = "form-control" id = "signup-email" placeholder = "Email address" >
< / div >
< div class = "form-group" >
< label class = "sr-only" for = "signup-password" > Password< / label >
< input type = "password" class = "form-control" id = "signup-password" placeholder = "Password" >
< / div >
< div class = "form-check text-xs" >
< label class = "form-check-label op-8" >
< input type = "checkbox" value = "term" class = "form-check-input mt-1" >
I agree with the Terms and Conditions.
< / label >
< / div >
< / div >
< div class = "modal-footer bg-light py-3" >
< div class = "d-flex align-items-center" >
< button type = "button" class = "btn btn-primary" > Sign Up< / button >
< button type = "button" class = "btn btn-link ml-1" data-dismiss = "modal" aria-hidden = "true" > Cancel< / button >
< / div >
< p class = "text-xs text-right text-lh-tight op-8 my-0 ml-auto" > Already signed up? < a href = "login.html" > Login here< / a > < / p >
< / div >
< / div >
<!-- /.modal - content -->
< / form >
< / div >
<!-- /.modal - dialog -->
< / div >
<!-- /.modal -->
<!-- @modal - login modal -->
< div class = "modal fade" id = "login-modal" tabindex = "-1" role = "dialog" aria-hidden = "true" >
< div class = "modal-dialog modal-dialog-centered" >
< div class = "modal-content" >
< div class = "modal-header bg-light" >
< h4 class = "modal-title" >
Login
< / h4 >
< button type = "button" class = "close" data-dismiss = "modal" aria-hidden = "true" > × < / button >
< / div >
< div class = "modal-body" >
< div class = "form-group" >
< label class = "sr-only" for = "login-email" > Email< / label >
< input type = "email" id = "login-email" class = "form-control email" placeholder = "Email" >
< / div >
< div class = "form-group mb-0" >
< label class = "sr-only" for = "login-password" > Password< / label >
< input type = "password" id = "login-password" class = "form-control password mb-1" placeholder = "Password" >
< / div >
< / div >
< div class = "modal-footer bg-light py-3" >
< div class = "d-flex align-items-center" >
< button type = "button" class = "btn btn-primary" > Login< / button >
< button type = "button" class = "btn btn-link ml-1" data-dismiss = "modal" aria-hidden = "true" > Cancel< / button >
< / div >
< p class = "text-xs text-right text-lh-tight op-8 my-0 ml-auto" >
Not a member? < a href = "#" class = "signup" > Sign up now!< / a >
< br / >
< a href = "#" > Forgotten password?< / a >
< / p >
< / div >
<!-- Modal -->
< div class = "modal fade modal-duration" data-modal-duration = "1000" tabindex = "-1" role = "dialog" aria-labelledby = "myModalLabel" aria-hidden = "true" id = "vote-modal" >
< div class = "modal-dialog" role = "document" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" >
感谢:
< / h4 >
< button type = "button" class = "close" data-dismiss = "modal" aria-label = "Close" > < span aria-hidden = "true" > × < / span > < / button >
< / div >
< div class = "modal-body" > 感谢您选择我们的产品! < / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-secondary" data-dismiss = "modal" > Close< / button >
< / div >
< / div >
< / div >
< / div >
< / div >
<!-- /.modal - content -->
< / div >
<!-- /.modal - dialog -->
< / div >
<!-- /.modal -->
< / div >
<!-- jQuery 3.3.1 via CDN -->
< script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" > < / script >
<!-- Popper 1.14.3 via CDN, needed for Bootstrap Tooltips & Popovers -->
< script src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" > < / script >
<!-- Bootstrap v4.1.3 JS via CDN -->
< script src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" > < / script >
<!-- JS plugins required on all pages NOTE: Additional non - required plugins are loaded ondemand as of AppStrap 2.5 To disable this and load plugin assets manually simple add data - plugins - manual=true to the body tag -->
<!-- Custom scripts & AppStrap API integration -->
< script src = "assets/js/custom-script.js" > < / script >
<!-- AppStrap scripts mainly used to trigger libraries/plugins -->
< script src = "assets/js/script.js" > < / script >
< / body >
< / html >
