Advertisement
Guest User

Untitled

a guest
May 23rd, 2019
89
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 25.24 KB | None | 0 0
  1. <div ng-controller="GuideController" class="purchase-guide">
  2.   <!--Back and close top bar start-->
  3.   <div class="purchase-guide-topbar">
  4.     <div class="purchase-guide-topbar-left">
  5.       <h2 ng-show="previousStep || is('gender')" ng-class="{disabled: is('gender')}"></h2>
  6.     </div>
  7.     <div class="purchase-guide-topbar-right">
  8.       <h2><a href="{{store url=}}"><img src="{{skin url='img/close.png'}}"  ></a></h2>
  9.     </div>
  10.   </div>
  11.   <div ng-show="is('gender')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('gender')}">
  12.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg.png'}})" >
  13.       <div class="your-perfect-match">
  14.         <div class="main-your-perfect">
  15.           <div class="inner-your-perfect">
  16.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  17.           </div>
  18.           <div class="inner-your-perfect">
  19.             <div class="inner-your-perfect-content cykel-img">
  20.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  21.                 <div class="carousel-inner" role="listbox">
  22.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  23.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  24.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  25.                 </div>
  26.               </div>
  27.             </div>
  28.           </div>
  29.           <div class="inner-your-perfect">
  30.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  31.           </div>
  32.         </div>
  33.       </div>
  34.     </div>
  35.     <div class="purchase-guide-slide-content">
  36.       <div class="purchase-guide-slide-content-outer">
  37.         <div class="purchase-guide-slide-content-middle">
  38.           <div class="purchase-guide-slide-content-inner">
  39.             <h2 class="h1">Vilken cykeltyp föredrar du?</h2>
  40.             <p class="sub-title">För att kunna hjälpa dig på bästa sätt behöver vi först få reda på vilken typ av cykel du eller den du köper till föredrar.</p>
  41.             <div class="group-purchase-guide-choice">
  42.               <!-- Radio button start -->
  43.               <p class="next" ng-click="set('gender', '928'); go('height')">
  44.                 <input type="radio" id="radio1" name="radio-group">
  45.                 <label for="radio1">Herr</label>
  46.               </p>
  47.               <p class="next" ng-click="set('gender', '929'); go('height')">
  48.                 <input type="radio" id="radio2" name="radio-group">
  49.                 <label for="radio2">Dam</label>
  50.               </p>
  51.               <p >
  52.                 <label class="junior-link"> <a class="purchase-guide-choice" href="https://cykelkraft.se/barncykelguiden"> Barn/Junior </a></label>
  53.               </p>
  54.               <!-- Radio button end -->
  55.             </div>
  56.           </div>
  57.         </div>
  58.       </div>
  59.       <div class="step-progress">
  60.         <div class="progress">
  61.           <span class="progress-count"><span class="skill" data-count="15">0</span>%</span>
  62.           <div class="progress-bar" role="progressbar" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100">            
  63.           </div>
  64.         </div>
  65.       </div>
  66.     </div>
  67.   </div>
  68.   <!--1 Step Gender end-->
  69.   <!--2 Step height start-->
  70.   <div ng-show="is('height')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('height')}">
  71.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg2.png'}})" >
  72.       <div class="your-perfect-match">
  73.         <div class="main-your-perfect">
  74.           <div class="inner-your-perfect">
  75.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  76.           </div>
  77.           <div class="inner-your-perfect">
  78.             <div class="inner-your-perfect-content cykel-img">
  79.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  80.                 <div class="carousel-inner" role="listbox">
  81.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  82.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  83.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  84.                 </div>
  85.               </div>
  86.             </div>
  87.           </div>
  88.           <div class="inner-your-perfect">
  89.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  90.           </div>
  91.         </div>
  92.       </div>
  93.     </div>
  94.     <div class="purchase-guide-slide-content">
  95.       <div class="purchase-guide-slide-content-outer">
  96.         <div class="purchase-guide-slide-content-middle">
  97.           <div class="purchase-guide-slide-content-inner">
  98.             <h2 class="h1">Hur lång är du?</h2>
  99.             <p class="sub-title">Storleken på cykeln är helt beroende på hur lång du är, för att du ska kunna cykla bekvämt är det bra om du snabbt springer och mäter dig om du inte redan vet hur lång du är.</p>
  100.             <div class="purchase-guide-input-wrapper">
  101.               <form ng-submit="set('person-height', height); go('bikeType')">
  102.                 <div class="input-group">
  103.                   <input type="text" ng-model="height" class="form-control purchase-guide-input-choice " >
  104.                   <div class="input-group-append"> <span class="input-group-text" id="basic-addon2">cm</span> </div>
  105.                 </div>
  106.               </form>
  107.             </div>
  108.             <div class="purchase-guide-height-next-btn">
  109.               <button ng-disabled="!height" class="purchase-guide-input-icon" ng-click="set('person-height', height); go('bikeType')"><span>Nästa</span> <i class="icon icon-right"></i></button>
  110.             </div>
  111.           </div>
  112.         </div>
  113.       </div>
  114.       <div class="step-progress">
  115.         <div class="progress">
  116.           <span class="progress-count"><span class="skill" data-count="30">0</span>%</span>
  117.           <div class="progress-bar" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100">            
  118.           </div>
  119.         </div>
  120.       </div>
  121.     </div>
  122.   </div>
  123.   <!--2 Step height end-->
  124.   <!--3 Step bikeType start-->
  125.   <div ng-show="is('bikeType')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('bikeType')}">
  126.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg3.png'}})" >
  127.       <div class="your-perfect-match">
  128.         <div class="main-your-perfect">
  129.           <div class="inner-your-perfect">
  130.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  131.           </div>
  132.           <div class="inner-your-perfect">
  133.             <div class="inner-your-perfect-content cykel-img">
  134.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  135.                 <div class="carousel-inner" role="listbox">
  136.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  137.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  138.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  139.                 </div>
  140.               </div>
  141.             </div>
  142.           </div>
  143.           <div class="inner-your-perfect">
  144.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  145.           </div>
  146.         </div>
  147.       </div>
  148.     </div>
  149.     <div class="purchase-guide-slide-content">
  150.       <div class="purchase-guide-slide-content-outer">
  151.         <div class="purchase-guide-slide-content-middle">
  152.           <div class="purchase-guide-slide-content-inner">
  153.             <h2 class="h1">Hur ska du cykla?</h2>
  154.             <p class="sub-title">Med ett stort utbud av olika cykelmodeller kan det vara svårt att veta hur cykeln bör se ut för tillmötesgå dina behov. Vi hjälper dig!</p>
  155.             <div class="purchase-guide-choice-wrapper">
  156.               <div class="group-purchase-guide-choice">
  157.                 <!-- Radio button start -->
  158.                 <p ng-click="go('commutingType')">
  159.                   <input type="radio" id="radio4" name="radio-group">
  160.                   <label for="radio4">Pendla</label>
  161.                 </p>
  162.                 <p ng-click="set('cat', '7'); set('e_bikes', '5426'); set('price', '5000-'); go('mtbTypeExtra')">
  163.                   <input type="radio" id="radio5" name="radio-group">
  164.                   <label for="radio5">I skogen</label>
  165.                 </p>
  166.                 <p ng-click="set('cat', '26'); post()">
  167.                   <input type="radio" id="radio6" name="radio-group">
  168.                   <label for="radio6">Vardagscykling</label>
  169.                 </p>
  170.                 <p ng-click="set('cat', '21'); post()">
  171.                   <input type="radio" id="radio7" name="radio-group">
  172.                   <label for="radio7">Maximal komfort</label>
  173.                 </p>
  174.                 <p ng-click="set('cat', '23'); set('price', '5000-'); go('frameMaterial')">
  175.                   <input type="radio" id="radio8" name="radio-group">
  176.                   <label for="radio8">Landsväg</label>
  177.                 </p>
  178.                 <p ng-click="set('cat', '711'); set('price', '5000-'); go('frameMaterial')">
  179.                   <input type="radio" id="radio9" name="radio-group">
  180.                   <label for="radio9">Grusvägar och lättare terräng</label>
  181.                 </p>
  182.                 <!-- Radio button end -->
  183.               </div>
  184.             </div>
  185.           </div>
  186.         </div>
  187.       </div>
  188.       <div class="step-progress">
  189.         <div class="progress">
  190.           <span class="progress-count"><span class="skill" data-count="45">0</span>%</span>
  191.           <div class="progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100">            
  192.           </div>
  193.         </div>
  194.       </div>
  195.     </div>
  196.   </div>
  197.   <!--3 Step bikeType end-->
  198.   <!--4 Step commutingType start-->
  199.   <div ng-show="is('commutingType')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('commutingType')}">
  200.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg4.png'}})" >
  201.       <div class="your-perfect-match">
  202.         <div class="main-your-perfect">
  203.           <div class="inner-your-perfect">
  204.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  205.           </div>
  206.           <div class="inner-your-perfect">
  207.             <div class="inner-your-perfect-content cykel-img">
  208.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  209.                 <div class="carousel-inner" role="listbox">
  210.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  211.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  212.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  213.                 </div>
  214.               </div>
  215.             </div>
  216.           </div>
  217.           <div class="inner-your-perfect">
  218.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  219.           </div>
  220.         </div>
  221.       </div>
  222.     </div>
  223.     <div class="purchase-guide-slide-content">
  224.       <div class="purchase-guide-slide-content-outer">
  225.         <div class="purchase-guide-slide-content-middle">
  226.           <div class="purchase-guide-slide-content-inner">
  227.             <h2 class="h1">Hur ska du pendla?</h2>
  228.             <p class="sub-title">En cityhybrid är en mångsidig och praktisk cykel. En racerhybrid är snabb, rolig och lättrullad. En crosshybrid orkar med dom flesta underlagen. Nu ska vi hitta vilken som passar dig.</p>
  229.             <div class="purchase-guide-choice-wrapper">
  230.               <div class="group-purchase-guide-choice">
  231.                 <!-- Radio button start -->
  232.                 <p ng-click="set('cat', '401'); post();">
  233.                   <input type="radio" id="radio9" name="radio-group">
  234.                   <label for="radio9">I stan</label>
  235.                 </p>
  236.                 <p ng-click="set('cat', '400'); post();">
  237.                   <input type="radio" id="radio10" name="radio-group">
  238.                   <label for="radio10">Fina undelag och långa sträckor</label>
  239.                 </p>
  240.                 <p ng-click="set('cat', '400,401'); post();">
  241.                   <input type="radio" id="radio11" name="radio-group">
  242.                   <label for="radio11">Fina underlag och kortare sträckor</label>
  243.                 </p>
  244.                 <p ng-click="set('cat', '399'); post();">
  245.                   <input type="radio" id="radio12" name="radio-group">
  246.                   <label for="radio12">Grusvägar, skogsstiga och andra tuffa underlag</label>
  247.                 </p>
  248.                 <!-- Radio button end -->
  249.               </div>
  250.             </div>
  251.           </div>
  252.         </div>
  253.       </div>
  254.       <div class="step-progress">
  255.         <div class="progress">
  256.           <span class="progress-count"><span class="skill" data-count="60">0</span>%</span>
  257.           <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">            
  258.           </div>
  259.         </div>
  260.       </div>
  261.     </div>
  262.   </div>
  263.   <!--4 Step commutingType end-->
  264.   <!--5 Step mtbTypeExtra start-->
  265.   <div ng-show="is('mtbTypeExtra')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('mtbTypeExtra')}">
  266.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg.png'}})" >
  267.       <div class="your-perfect-match">
  268.         <div class="main-your-perfect">
  269.           <div class="inner-your-perfect">
  270.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  271.           </div>
  272.           <div class="inner-your-perfect">
  273.             <div class="inner-your-perfect-content cykel-img">
  274.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  275.                 <div class="carousel-inner" role="listbox">
  276.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  277.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  278.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  279.                 </div>
  280.               </div>
  281.             </div>
  282.           </div>
  283.           <div class="inner-your-perfect">
  284.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  285.           </div>
  286.         </div>
  287.       </div>
  288.     </div>
  289.     <div class="purchase-guide-slide-content">
  290.       <div class="purchase-guide-slide-content-outer">
  291.         <div class="purchase-guide-slide-content-middle">
  292.           <div class="purchase-guide-slide-content-inner">
  293.             <h2 class="h1">Vilken typ av terräng tänkte du cykla i?</h2></h2>
  294.             <div class="purchase-guide-choice-wrapper">
  295.               <div class="group-purchase-guide-choice">
  296.                 <!-- Radio button start -->
  297.                 <p ng-click="set('cat', '701'); go('mtbType')">
  298.                   <input type="radio" id="radio20" name="radio-group">
  299.                   <label for="radio20">Crosscountry, det vill säga på enklare stigar med högre fart och få hinder</label>
  300.                 </p>
  301.                 <p ng-click="set('cat', '703'); go('mtbType')">
  302.                   <input type="radio" id="radio21" name="radio-group">
  303.                   <label for="radio21">Enduro, för dig som vill kunna cykla obegränsat i skogen och i downhill-backarna</label>
  304.                 </p>
  305.                  <p ng-click="set('cat', '702'); go('mtbType')">
  306.                   <input type="radio" id="radio22" name="radio-group">
  307.                   <label for="radio22">Gravity/Downhill, när du vill ta liften upp för backen och cykla ner</label>
  308.                 </p>
  309.                     <p ng-click="set('cat', '704'); go('mtbType')">
  310.                   <input type="radio" id="radio23" name="radio-group">
  311.                   <label for="radio23">Trail, för dig som vill cykla snabbt genom skogen med måttliga hinder och mindre hopp</label>
  312.                 </p>
  313.                 <!-- Radio button end -->
  314.               </div>
  315.             </div>
  316.           </div>
  317.         </div>
  318.       </div>
  319.       <div class="step-progress">
  320.         <div class="progress">
  321.           <span class="progress-count"><span class="skill" data-count="65">0</span>%</span>
  322.           <div class="progress-bar" role="progressbar" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100">            
  323.           </div>
  324.         </div>
  325.       </div>
  326.     </div>
  327.   </div>
  328.   <!--7 Step mtbType end-->
  329.   <!--5 Step mtbwheelType start-->
  330.   <div ng-show="is('mtbType')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('mtbType')}">
  331.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg.png'}})" >
  332.       <div class="your-perfect-match">
  333.         <div class="main-your-perfect">
  334.           <div class="inner-your-perfect">
  335.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  336.           </div>
  337.           <div class="inner-your-perfect">
  338.             <div class="inner-your-perfect-content cykel-img">
  339.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  340.                 <div class="carousel-inner" role="listbox">
  341.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  342.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  343.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  344.                 </div>
  345.               </div>
  346.             </div>
  347.           </div>
  348.           <div class="inner-your-perfect">
  349.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  350.           </div>
  351.         </div>
  352.       </div>
  353.     </div>
  354.     <div class="purchase-guide-slide-content">
  355.       <div class="purchase-guide-slide-content-outer">
  356.         <div class="purchase-guide-slide-content-middle">
  357.           <div class="purchase-guide-slide-content-inner">
  358.             <h2 class="h1">Har du några preferenser kring hjulstorlek?</h2>
  359.             <div class="purchase-guide-choice-wrapper">
  360.               <div class="group-purchase-guide-choice">
  361.                 <!-- Radio button start -->
  362.                 <p ng-click="set('wheel_size', '1059');  go('mtbDampeningType');">
  363.                   <input type="radio" id="radio13" name="radio-group">
  364.                   <label for="radio13">Ja - 27,5"!</label>
  365.                 </p>
  366.                 <p ng-click="set('wheel_size', '962'); go('mtbDampeningType');">
  367.                   <input type="radio" id="radio14" name="radio-group">
  368.                   <label for="radio14">Ja - 29"!</label>
  369.                 </p>
  370.                 <p ng-click="go('mtbDampeningType')">
  371.                   <input type="radio" id="radio19" name="radio-group">
  372.                   <label for="radio19">Nej</label>
  373.                 </p>
  374.                 <!-- Radio button end -->
  375.               </div>
  376.             </div>
  377.           </div>
  378.         </div>
  379.       </div>
  380.       <div class="step-progress">
  381.         <div class="progress">
  382.           <span class="progress-count"><span class="skill" data-count="75">0</span>%</span>
  383.           <div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">            
  384.           </div>
  385.         </div>
  386.       </div>
  387.     </div>
  388.   </div>
  389.   <!--5 Step mtbwheelType end-->
  390.   <!--6 Step frameMaterial start-->
  391.   <div ng-show="is('frameMaterial')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('frameMaterial')}">
  392.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg.png'}})" >
  393.       <div class="your-perfect-match">
  394.         <div class="main-your-perfect">
  395.           <div class="inner-your-perfect">
  396.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  397.           </div>
  398.           <div class="inner-your-perfect">
  399.             <div class="inner-your-perfect-content cykel-img">
  400.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  401.                 <div class="carousel-inner" role="listbox">
  402.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  403.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  404.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  405.                 </div>
  406.               </div>
  407.             </div>
  408.           </div>
  409.           <div class="inner-your-perfect">
  410.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  411.           </div>
  412.         </div>
  413.       </div>
  414.     </div>
  415.     <div class="purchase-guide-slide-content">
  416.       <div class="purchase-guide-slide-content-outer">
  417.         <div class="purchase-guide-slide-content-middle">
  418.           <div class="purchase-guide-slide-content-inner">
  419.             <h2 class="h1">Vad är viktigast för dig?</h2>
  420.             <div class="purchase-guide-choice-wrapper">
  421.               <div class="group-purchase-guide-choice">
  422.                 <!-- Radio button start -->
  423.                 <p ng-click="set('frame_type', '1993'); post();">
  424.                   <input type="radio" id="radio15" name="radio-group">
  425.                   <label for="radio15">Pris</label>
  426.                 </p>
  427.                 <p ng-click="set('frame_type', '1991'); set('price', '10000-'); post();">
  428.                   <input type="radio" id="radio16" name="radio-group">
  429.                   <label for="radio16">Prestanda</label>
  430.                 </p>
  431.                 <!-- Radio button end -->
  432.               </div>
  433.             </div>
  434.           </div>
  435.         </div>
  436.       </div>
  437.       <div class="step-progress">
  438.         <div class="progress">
  439.           <span class="progress-count"><span class="skill" data-count="95">0</span>%</span>
  440.           <div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100">            
  441.           </div>
  442.         </div>
  443.       </div>
  444.     </div>
  445.   </div>
  446.   <!--6 Step frameMaterial end-->
  447.   <!--7 Step mtbDampeningType start-->
  448.   <div ng-show="is('mtbDampeningType')" class="purchase-guide-slide" ng-class="{'animated fadeIn': is('mtbDampeningType')}">
  449.     <div class="purchase-guide-slide-image" style="background-image: url({{skin url='img/valj-cykel-bg.png'}})" >
  450.       <div class="your-perfect-match">
  451.         <div class="main-your-perfect">
  452.           <div class="inner-your-perfect">
  453.             <div class="inner-your-perfect-content text-perfect">Perfect match </div>
  454.           </div>
  455.           <div class="inner-your-perfect">
  456.             <div class="inner-your-perfect-content cykel-img">
  457.               <div id="perfectMatchCarousel" class="carousel slide" data-ride="carousel">
  458.                 <div class="carousel-inner" role="listbox">
  459.                   <div class="item active"> <img src="{{skin url='img/cykel-img.svg'}}"  > </div>
  460.                   <div class="item"> <img src="{{skin url='img/cykel-img2.svg'}}" > </div>
  461.                   <div class="item"> <img src="{{skin url='img/cykel-img3.svg'}}"> </div>
  462.                 </div>
  463.               </div>
  464.             </div>
  465.           </div>
  466.           <div class="inner-your-perfect">
  467.             <div class="inner-your-perfect-content"><img src="{{skin url='img/white-small-logo.svg'}}" > </div>
  468.           </div>
  469.         </div>
  470.       </div>
  471.     </div>
  472.     <div class="purchase-guide-slide-content">
  473.       <div class="purchase-guide-slide-content-outer">
  474.         <div class="purchase-guide-slide-content-middle">
  475.           <div class="purchase-guide-slide-content-inner">
  476.             <h2 class="h1">Hårt eller mjukt?</h2>
  477.             <div class="purchase-guide-choice-wrapper">
  478.               <div class="group-purchase-guide-choice">
  479.                 <!-- Radio button start -->
  480.                 <p ng-click="set('rear_fork','16996'); go('frameMaterial')">
  481.                   <input type="radio" id="radio17" name="radio-group">
  482.                   <label for="radio17">Hardtail</label>
  483.                 </p>
  484.                 <p ng-click="set('rear_fork','16997'); go('frameMaterial')">
  485.                   <input type="radio" id="radio18" name="radio-group">
  486.                   <label for="radio18">Heldämpat</label>
  487.                 </p>
  488.                 <!-- Radio button end -->
  489.               </div>
  490.             </div>
  491.           </div>
  492.         </div>
  493.       </div>
  494.       <div class="step-progress">
  495.         <div class="progress">
  496.           <span class="progress-count"><span class="skill" data-count="90">0</span>%</span>
  497.           <div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100">            
  498.           </div>
  499.         </div>
  500.       </div>
  501.     </div>
  502.   </div>
  503.   <!--7 Step mtbDampeningType end-->
  504. </div>
  505. <script>
  506.  
  507.   jQuery('#perfectMatchCarousel').carousel({
  508.    interval: 2000
  509.   });
  510.  </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement