conflict resolution: JS with module image on hover(commented)

10/index.html

@@ -30,7 +30,7 @@
 </h1>
 	<a href="#damla_module"><div id="damla_T" class="moduletext"><h1 class="name_T">Carbon</h1></div></a>
 	<h2 class="student">by Damlanur Bilgin</h2>
-		<p>Carbon is a device that translates graphite markings on paper into signals that manipulate sound and visuals. Carbon’s interface is pencil, paper, and an LED screen that reflects the user's marks on paper and translates signals from other modules into light and color.
+		<p class= "p-style">Carbon is a device that translates graphite markings on paper into signals that manipulate sound and visuals. Carbon’s interface is pencil, paper, and an LED screen that reflects the user's marks on paper and translates signals from other modules into light and color.
 	<br>A synthesizer features knobs, sliders and buttons that allow the user to manipulate sound. The opposite ends of a knob or a slider represent two ends of an axis such as slow and fast or low pitch and high pitch, or, in case of buttons, on and off or play and pause. Each of these elements, controlling singular values, combine to form an interface between the musician and sound.
 	<br>On a scale of visible and invisible, the interface of the synthesizer is very visible.
 	<br>It’s difficult to interface with a synth intuitively. The user needs to be knowledgeable about how to make music to experiment or improvise. The interface doesn’t respond to gestures other than turning knobs or dragging sliders. The large number of controls on a synth means these controls need to be arranged in an efficient way. Thus, more important controls which are used more often are more eye catching and easier to reach. While this is important for function, it also creates a bias on ways of interfacing with sound. Some aspect of sound are more important to manipulate while some can be left alone for the most part.
@@ -352,7 +352,7 @@ Being sensibilized, gaining awareness and gradually understanding the structures
 	<br>However, you can also create your own, unique code, to fit your story. You will also find 5 previously written little stories, each exploring different modalities and interests. You just have to copy and paste them in the Loop section of your code, upload your new code on the hardware, and play the story, like a DVD.</p>
 		</div>
 		<div class="links">
-			 <a  class="link_title"href="manual_clara.pdf" target="_blank">Manual</a>
+			 <a class="link_title" href="manual_clara.pdf" target="_blank">Manual</a>
 			 <a class="link_title" href="https://git.xpub.nl/" target="_blank">Git</a>
 			 <a class="link_title" href="https://pzwiki.wdka.nl/mediadesign/User:Claxhanson/methods" target="_blank">Wiki</a>
 			 <a class="link_title" href="https://pzwiki.wdka.nl/mediadesign/User:Peach/issue-10-lfp" target="_blank">Personal Website</a>

10/script.js

@@ -9,23 +9,25 @@ $(document).ready(function(){
 	adjust_height()
 
 /* hidden Manual, Git links until manual as uploaded and git dir are ready */
-$('div.links > a:contains("Manual")').css('display', 'none');
-$('div.links > a:contains("Git")').css('display', 'none');
+// $('div.links > a:contains("Manual")').css('display', 'none');
+// $('div.links > a:contains("Git")').css('display', 'none');
 
+
+// Img of module on mouseenter 
+/*
 $('div.moduleimg img').mouseenter(function(){
 	var modulo_photo = $(this).attr('src').replace('img/pcb_', 'img/photo_').replace('.png','.png');
-	// $(this).attr('src', modulo_photo);
-	// $(this).css('border', '3px solid blue');
+		$(this).attr('src', modulo_photo);
+		$(this).css('border', '3px solid blue');
 
 	});	
 $('div.moduleimg  img').mouseleave(function(){
 	var modulo_pcb = $(this).attr('src').replace('img/photo_', 'img/pcb_').replace('.png','.png');
-	// $(this).attr('src', modulo_pcb);
-	// $(this).css('border', '1px solid red');
+		$(this).attr('src', modulo_pcb);
+		$(this).css('border', '1px solid red');
 	});
-
 })
-
+*/
 $(window).resize(function(){
 	adjust_height();
 })

10/style.css

@@ -103,6 +103,13 @@ div#right {
   background-color: #21632c;
 }
 
+.p-style{
+letter-spacing: 1px;
+margin-left: 1vw;
+margin-right: 1vw;
+}
+
+
 #SPIX {
   max-width: 90%;
   text-align: center;
@@ -218,7 +225,7 @@ div#names {
   max-width: 90%;
   /*! text-align: justify; */
   display: block;
-    margin-left: auto;
+    margin-left: 1vw;
     margin-right: auto;
     font-family: "OCRAStd";
     font-style: "light";
@@ -258,7 +265,7 @@ div#bigpcb{
     margin-left: auto;
     margin-right: auto;
     padding-top: 5%;
-    padding-bottom: 10%;
+    padding-bottom: 0px;
 }
 
 .bigpcb{
@@ -329,7 +336,7 @@ text-transform: uppercase;
 div.links{
 border-bottom:solid black 1px;
 font-family: "Helvetica";
-font: green;
+font-color: green;
 padding: 15px;
 }