Einar

Scripts/einar-script.js

@@ -27,7 +27,16 @@ function hovimg(event) {
     option.style.transform = 'translateY(-2px) translateX(+2px) scale(1.1)';
     option.style.transition = '0.5s';
     option.style.borderRadius = '15px';
+<<<<<<< HEAD
     option.style.border = '5px solid #FF00E6';
+=======
+    option.style.border = '5px solid black';
+}
+
+function changeimg(event) {
+    option = event.target;
+    option.style.border = '8px solid #FFB300';
+>>>>>>> afe277aa39de45a30a25ab05d9293b6d353cb832
 }
 
 function changeimg(event) {

Scripts/jon-script.js

@@ -1,6 +1,9 @@
 var imagArry=document.querySelectorAll('main.main section.jon_slide div input');
 var imagenFinish=document.querySelector('section.finish div.izq img')
+<<<<<<< HEAD
+=======
 
+>>>>>>> master
 imagArry.forEach(function(elem){
     elem.addEventListener('mouseover',hov)
     elem.addEventListener('mouseleave',no_hov)
@@ -29,6 +32,7 @@ function run(){
     forth.classList='tres';
     five.classList='cuatr';
     document.querySelector('main section.blackgrnd').style.backgroundImage=back;
+    document.setAttribute('section.finish div.izq img').style.backgroundImage=back;
     document.querySelector('main section.blackgrnd').style.opacity='0';
 
     document.querySelector('main section.blackgrnd').style.opacity='1';
@@ -69,12 +73,22 @@ function change(event){
     total_cont.insertBefore(container, total_cont.firstChild);
     frst_picture.classList=container.classList;
     container.classList='uno';
+    //La imagen del slide que recive el click , se coloca como backgroundImg.
+
     document.querySelector('main section.blackgrnd').style.backgroundImage=back;
     document.querySelector('main section.blackgrnd').style.opacity='0';
+<<<<<<< HEAD
+    document.querySelector('main section.blackgrnd').style.opacity='1';
+
+    //esa misma imagen la mando a la ultima pagina.  
+
+    imagenFinish.setAttribute("src",imag.getAttribute('src')) 
+=======
 
     document.querySelector('main section.blackgrnd').style.opacity='1';
 
     //esa misma imagen la mando a la ultima pagina.
     imagenFinish.setAttribute("src",imag.getAttribute('src'))
+>>>>>>> master
 
 }

Styles/einar-style.css

@@ -162,5 +162,9 @@ Selector price menu
 }
 
 .asideImgContainerClassEinar {
+<<<<<<< HEAD
     background-color: var(--main-background);
+=======
+    background-color: rgb(255, 255, 255);
+>>>>>>> afe277aa39de45a30a25ab05d9293b6d353cb832
 }

Styles/jon-style.css

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 main.main section div{
     position: absolute;
     transition: 0.5s;
@@ -12,6 +13,15 @@ main section.blackgrnd{
    width: 100%;
    transition: 2s;
    transform: translateX(100px);
+=======
+
+    background-image: url("../Resources/images/product-images/aether_air_purifying_bike_1.jpg");
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-position: center;
+    width: 100%;
+    transition: 2s;
+>>>>>>> afe277aa39de45a30a25ab05d9293b6d353cb832
 }
 main.main section.jon_slide{
    position: relative;

index.html

@@ -544,6 +544,7 @@ <h1>Your order</h1>
         </div>
         <div class='cinc'>
 
+<<<<<<< HEAD
             <input type='image' src="Resources/images/product-images/aether_air_purifying_bike_8.jpg" alt="">
         </div>
     </section>
@@ -572,6 +573,31 @@ <h1 class="glitch"><span class="glitch-span" aria-hidden="true">Nymbus 3000</spa
               <option class="priceOptionEinar" value="6.500 €">MAMBA BLACK</option>
               </select>
           </div>
+=======
+            <section class='jon_text'>
+                <h1 class="glitch"><span class="glitch-span" aria-hidden="true">Nymbus 3000</span>Nymbus 3000<span class="glitch-span" aria-hidden="true">Nymbus 3000</span></h1>
+
+                <p>This ambitious electric motorcycle concept<br>has filteredintakes that can purify the air as you drive</p>
+                <!-- </section>
+            <section class='einarMain'> -->
+
+                <div id="allBikeDataInContainer" class="allBikeDataInContainerClass">
+                    <p>Price:&nbsp; &nbsp; &nbsp;
+                        <span id="finalPriceEinar" class="finalPriceEinarClass"></span><br>
+                        <span id="finalColorEinar" class="finalColorEinarClass"></span><br>
+                        <span><input type="color" id="head" name="head" value="#e66465">
+                        <label for="head"></label></span>
+                    </p>
+                    <div class="customSelectEinarDiv" style="width:400px;">
+                        <select id="priceSelectorEinar" class="priceSelectorEinarClass">
+      <option class="priceOptionEinar" value="Select your dream bike!!" >select a bike:</option>
+      <option class="priceOptionEinar" value="4.500 €" >MANDRAGORA</option>
+      <option class="priceOptionEinar" value="5.300 €">STYLUS FIRE</option>
+      <option class="priceOptionEinar" value="6.000 €">ZEBRYTA</option>
+      <option class="priceOptionEinar" value="6.500 €">MAMBA BLACK</option>
+    </select>
+                    </div>
+>>>>>>> afe277aa39de45a30a25ab05d9293b6d353cb832
 
           <p>Price:&nbsp; &nbsp; &nbsp;<span id="finalColorEinar" class="finalColorEinarClass">PRICE</span></p>
           <div class="customSelectColorEinarDiv">
@@ -606,7 +632,11 @@ <h1 class="glitch"><span class="glitch-span" aria-hidden="true">Nymbus 3000</spa
                         </div>
                     </div>
 
+<<<<<<< HEAD
                     <div id="main-footer-picture"><img src="./Resources/images/product-images/motor.png" alt="moto"></div>
+=======
+                    <!-- <div id="main-footer-picture"><img src="./Resources/images/product-images/sedov_b2_bike_7.jpg" alt="moto" style="width: 100%; height: 100%;"></div> -->
+>>>>>>> afe277aa39de45a30a25ab05d9293b6d353cb832
                     <div id="main-footer-disc">
                         <p>Think about it. What if, instead of emitting carbon monoxide, your motorcycle could do the absolute opposite? <br> What if, instead of relying on a fuel-powered engine, your motorcycle could be powered by cleaner energy while also
                             cleaning the air around you as you drive down the roads? <br> It’s an ambitious idea that Lin Yu Cheng is working on through his concept motorcycle Aether.