diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_1.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_1.html index de81630e..edeb7451 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_1.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_1.html @@ -5,5 +5,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html index a2147206..11d354c1 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html @@ -4,6 +4,7 @@ Step 2 - + + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_3.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_3.html index 20b2a198..120d1264 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_3.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_3.html @@ -5,5 +5,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html index 12c89425..4c989603 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html @@ -11,5 +11,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html index 60479f28..b8b65663 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html @@ -10,5 +10,6 @@
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html index b019dccd..f6ce079f 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html @@ -10,5 +10,6 @@
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html index 05ff5834..54fe30f5 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html @@ -10,5 +10,6 @@
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html b/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html index 75804e8b..d3fd5939 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html @@ -9,5 +9,6 @@
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step-8.js b/03_Exercises/03_JavaScript/javascript-basics-01/step-8.js new file mode 100644 index 00000000..fcffe5d3 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step-8.js @@ -0,0 +1,12 @@ +function ageFunction() { + var age = prompt("What is your age"); + document.getElementById("age").value = age; + if (age > 18) { + alert("you are over 18"); + } + else { + alert("You are under 18"); + } + +} +ageFunction(); \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_1.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_1.js new file mode 100644 index 00000000..50101b59 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_1.js @@ -0,0 +1,4 @@ + +var name= "Maya"; + +alert('I am ' + name); diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_2.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_2.js new file mode 100644 index 00000000..258844dd --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_2.js @@ -0,0 +1,6 @@ + + var name="Maya"; + var surname="Atiah" ; + var city="Aramoun" ; + alert("Name: "+name+"\nSurname:"+surname+"\ncity:"+city); + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_3.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_3.js new file mode 100644 index 00000000..8208cd3c --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_3.js @@ -0,0 +1,7 @@ +function getconfirmation(){ + let person = prompt("Please enter your name"); + alert("Hello "+person); + + +} +getconfirmation(); diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_4.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_4.js new file mode 100644 index 00000000..811e808d --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_4.js @@ -0,0 +1,9 @@ +var username=prompt("Please enter your name"); +document.getElementById("name").value = username; +var lastName=prompt("please enter your surname"); +document.getElementById("surname").value = lastName; +var cityn=prompt("Please enter your city"); +document.getElementById("city").value = cityn; + + +alert("Name: "+username+"\nSurname:"+lastName+"\ncity:"+cityn); \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_5.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_5.js new file mode 100644 index 00000000..5ca07242 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_5.js @@ -0,0 +1,5 @@ +var numberOne=prompt("type the first number"); +document.getElementById("first_number").value=numberOne; +var numberTwo=prompt("type the second number"); +document.getElementById("second_number").value=numberTwo; +alert(numberOne*numberTwo); \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_6.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_6.js new file mode 100644 index 00000000..4098f1bb --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_6.js @@ -0,0 +1,6 @@ +var numberOne=prompt("Type the first number"); +document.getElementById("first_number").value=numberOne; +var numberTwo=prompt("Type the second number"); +document.getElementById("second_number").value=numberTwo; +alert("the remainder of "+numberOne+" and "+numberTwo+" is "+numberOne/numberTwo); + diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_7.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_7.js new file mode 100644 index 00000000..7c7b5a50 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_7.js @@ -0,0 +1,21 @@ + + + +function someCalculations(){ + var shoeNumber=prompt("Write your shoe number"); +document.getElementById("shoe_size").value=shoeNumber; +var birthYear=prompt("Write your birth year"); +document.getElementById("year").value=birthYear; + alert(shoeNumber*2+5-birthYear+1766); + +} +someCalculations(); + + +// Multiplies the shoe size by 2 +// Adds 5 +// Multiplies by 50 +// Subtracts the birth year +// Adds 1766 +// Shows the result to the user +// Commit \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 1/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/index.html index 5ad09a67..2f21aa06 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 1/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/index.html @@ -6,5 +6,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step_1.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step_1.js new file mode 100644 index 00000000..1ac8f063 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step_1.js @@ -0,0 +1,6 @@ +var image; +image=document.querySelector("#image1"); +image.addEventListener("mouseover",function(){ + image.src="images/image1_2.jpg"; +}); + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 2/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 2/index.html index cf257909..bcb9392e 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 2/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 2/index.html @@ -8,5 +8,6 @@
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 2/step_2.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 2/step_2.js new file mode 100644 index 00000000..db7efb66 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 2/step_2.js @@ -0,0 +1,8 @@ +text=document.querySelector("#name"); + +text.addEventListener("focusout", myFunction); + + +function myFunction() { + alert("thank you for participating!"); +} \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 3/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/index.html index 308c0b89..b1d88a82 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 3/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/index.html @@ -7,6 +7,10 @@
+
+ +
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_3.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_3.js new file mode 100644 index 00000000..edb83a90 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_3.js @@ -0,0 +1,15 @@ +const text=document.querySelector('input'); +const value=document.getElementById('value'); + +text.addEventListener('input', updateValue); + + +function updateValue(a){ +value.textContent=a.target.value; + +} + + + + + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 4/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/index.html index f5086dfb..2db2f459 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 4/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/index.html @@ -5,11 +5,12 @@ Step 4 -
+ - +
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_4.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_4.js new file mode 100644 index 00000000..ca8900fd --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_4.js @@ -0,0 +1,7 @@ +document.querySelector("#buttn").addEventListener("click", function () { + if (confirm("Are you sure u want to reset?")) { + document.querySelector("#name").value = ""; + document.querySelector("#city").value = ""; + document.querySelector("#surname").value = ""; + } + }); \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 5/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/index.html index fe14eb95..91a053da 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 5/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/index.html @@ -12,5 +12,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_5.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_5.js new file mode 100644 index 00000000..4593e53a --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_5.js @@ -0,0 +1,7 @@ + document.addEventListener("mouseover",function(){ + document.getElementById("image1").src = "images/image1_2.jpg"; + document.getElementById("image2").src = "images/image2_2.jpg"; + document.getElementById("image3").src = "images/image3_2.jbg"; + document.getElementById("image4").src = "images/image4_2.jpg"; + document.getElementById("image5").src = "images/image5_2.jpg"; +}) diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 6/index.html b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/index.html index 2eecf4f9..31159478 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-02/step 6/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/index.html @@ -10,5 +10,6 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_6.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_6.js new file mode 100644 index 00000000..036f3847 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_6.js @@ -0,0 +1,55 @@ +document.addEventListener('DOMContentLoaded', init); +function init(){ + const img1=document.querySelector("#image1"); + const img2=document.querySelector("#image2"); + const img3=document.querySelector("#image3"); + const img4=document.querySelector("#image4"); + const img5=document.querySelector("#image5"); + changeImg(img1); + changeImg(img2); + changeImg(img3); + changeImg(img4); + changeImg(img5); + function changeImg(image){ + if(image.id==img1.id){ + image.onmouseover=() =>{ + img1.src="images/image1_2.jpg"; + }; + image.onmouseout=() =>{ + img1.src="images/image1.jpg"; + }; + } + else if(image.id==img2.id){ + image.onmouseover=() =>{ + img2.src="images/image2_2.jpg"; + }; + image.onmouseout=() =>{ + img2.src="images/image2.jpg"; + }; + } + else if(image.id==img3.id){ + image.onmouseover=() =>{ + img3.src="images/image3_2.jpg"; + }; + image.onmouseout=() =>{ + img3.src="images/image3.jpg"; + }; + } + else if(image.id==img4.id){ + image.onmouseover=() =>{ + img4.src="images/image4_2.jpg"; + }; + image.onmouseout=() =>{ + img4.src="images/image4.jpg"; + }; + } + else if(image.id==img5.id){ + image.onmouseover=() =>{ + img5.src="images/image5_2.jpg"; + }; + image.onmouseout=() =>{ + img5.src="images/image5.jpg"; + }; + } + } +} \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 1/index.html b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/index.html index eb4909df..d00b8a51 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-03/step 1/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/index.html @@ -5,6 +5,8 @@ Step 1 - + + + diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step_1.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step_1.js new file mode 100644 index 00000000..c24ce8be --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step_1.js @@ -0,0 +1,15 @@ +var img=document.querySelector("#image1") + + +function setBorder(){ + img.style.border="3px solid red"; + + +} + + +function removeBorder(){ + img.style.border="none"; + + +} \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 2/index.html b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/index.html index aeff7fa1..d56ed658 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-03/step 2/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/index.html @@ -5,10 +5,11 @@ Step 2 -Show -Hide +Show +Hide

Joseph Dacre Carlyle (Carlisle, 4 juin 1758 - Newcastle upon Tyne, 12 avril 1804) est un orientaliste anglais.Après ses études à l'université de Cambridge, il y devint professeur d'arabe. En 1799, il fut attaché par le gouvernement britannique à l'ambassade de Lord Elgin dans l'Empire ottoman. Il était chargé d'explorer les bibliothèques de la région (principalement celle du Sérail) pour y découvrir (et y acquérir) des manuscrits inédits de textes antiques. Il se rendit aussi en Égypte, en Terre sainte et au mont Athos. Sa mission fut, de son point de vue, un échec. Il acheta quelques centaines d'ouvrages, principalement dans les bazars de Constantinople, mais aucun ne contenait de texte inédit. Cependant, la façon dont certains manuscrits avaient été acquis, principalement ceux du patriarche de Jérusalem Anthème Ier, ainsi que la querelle entamée sur la plaine de Troie entre Carlyle et un autre professeur de Cambridge, Edward Daniel Clarke, allaient être utilisées, après la mort de Carlyle, contre Lord Elgin, dans les controverses autour de l'acquisition des « marbres d'Elgin ».De retour en Grande-Bretagne à l'automne 1801, Joseph Dacre Carlyle entama une traduction en arabe de la Bible. Sa mort en avril 1804 coupa court à ce travail.

+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 2/step_2.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/step_2.js new file mode 100644 index 00000000..4142d387 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/step_2.js @@ -0,0 +1,35 @@ + + +// document.addEventListener("DOMContentLoaded",myFunction) + + +// function myFunction(){ + +// if(document.getElementById("show").onclick ){ +// document.querySelector("p").style.visibility="visible"; +// } + +// else if(document.getElementById("hide").onclick ){ +// document.querySelector("p").style.visibility="hidden"; +// } + +// } +// myFunction(); + + function showObj() +{ + document.querySelector("p").style.display="block"; +} + +function hideObj(){ + document.querySelector("p").style.display="none"; +} + +// document.getElementById("show").onclick = function() { +// document.getElementById("texte").style.display = "unset"; +// } + +// document.getElementById("hide").onclick = function() { +// document.getElementById("texte").style.display = "none"; +// } + diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 3/index.html b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/index.html index 0db3888c..a6fb1956 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-03/step 3/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/index.html @@ -10,9 +10,10 @@

Tara, originellement nommée Antarctica puis Seamaster, est une goélette française destinée à la fois à l'exploration et à la défense de l'environnement. Dans le cadre de l'Année polaire internationale, en 2007-2008, ce voilier est utilisé en Arctique par l'expédition Tara Arctic dans le but de faire des relevés permettant de mieux comprendre les changements climatiques qui s'opèrent en Arctique. En 2009, dans le cadre de l'expédition Tara Oceans, Tara parcourt les mers et les océans dans une circumnavigation de trois ans afin d'étudier le piégeage des molécules de gaz carbonique (CO2) par les micro-organismes marins comme le plancton. En avril 2016, une nouvelle expédition est montée Tara Pacific dont l'objectif est de comprendre le corail, menacé par des facteurs humains et climatiques1.

-
+
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 3/step_3.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/step_3.js new file mode 100644 index 00000000..5c6c82fd --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/step_3.js @@ -0,0 +1,19 @@ + +const btn = document.querySelectorAll('.color'); +const text = document.getElementById("text"); + +btn.forEach(function (p) { + console.log("PPPP", p) + p.addEventListener('click', function () { + if (p.className === "color green") { + text.style.color = "green"; + } + else if (p.className === "color red") { + text.style.color = "red"; + + } + else if (p.className === "color blue") { + text.style.color = "blue"; + } + }) +}) diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 4/index.html b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/index.html index cab276b0..9edcc4ec 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-03/step 4/index.html +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/index.html @@ -8,7 +8,8 @@
- +
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step_4.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step_4.js new file mode 100644 index 00000000..716a5dc9 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step_4.js @@ -0,0 +1,16 @@ +function validate(){ + let input1=document.getElementById('password').value ; + let input2=document.getElementById('confirmation').value; + + if(input1!==input2){ + document.getElementById('password').style.border="2px solid red"; + document.getElementById('confirmation').style.border="2px solid red"; + + } + else { + document.getElementById('password').style.border="2px solid black"; + document.getElementById('confirmation').style.border="2px solid black"; + } + } + + \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-04-tdd/questions.js b/03_Exercises/03_JavaScript/javascript-basics-04-tdd/questions.js index d56a923d..bf85d9a0 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-04-tdd/questions.js +++ b/03_Exercises/03_JavaScript/javascript-basics-04-tdd/questions.js @@ -1,101 +1,117 @@ const stringSize = (text) => { + return text.length; } const replaceCharacterE = (text) => { - +return text.replace("e"," "); } const concatString = (text1, text2) => { - +return text1.concat(text2); } const showChar5 = (text) => { - + return text.charAt(4); } const showChar9 = (text) => { - + return text.slice(0,9); } const toCapitals = (text) => { - +return text.toUpperCase(); } const toLowerCase = (text) => { - +return text.toLowerCase(); } const removeSpaces = (text) => { - +return text.trim() } const IsString = (text) => { - +return typeof text == 'string'; } const getExtension = (text) => { - +return text.split(".").pop(); } const countSpaces = (text) => { - + return text.split(" ").length - 1; } const InverseString = (text) => { - + return text + .split("") + .reverse() + .join(""); } const power = (x, y) => { - + return Math.pow(x, y); } const absoluteValue = (num) => { - -} -const absoluteValueArray = (array) => { - -} -const circleSurface = (radius) => { - -} -const hypothenuse = (ab, ac) => { - -} -const BMI = (weight, height) => { - -} - -const createLanguagesArray = () => { - -} - -const createNumbersArray = () => { - -} - -const replaceElement = (languages) => { - -} - -const addElement = (languages) => { - -} - -const addNumberElement = (numbers) => { - -} - -const removeFirst = (languages) => { - -} - -const removeLast = (languages) => { - -} - -const convertStrToArr = (social_arr) => { - -} - -const convertArrToStr = (languages) => { - -} - -const sortArr = (social_arr) => { - -} - -const invertArr = (social_arr) => { - -} \ No newline at end of file + return Math.abs(num); +} +const absoluteValueArray = array => { + return array.map(Math.abs); + }; + const circleSurface = radius => { + return Math.round(Math.PI * radius * radius); + }; + const hypothenuse = (ab, ac) => { + return Math.hypot(ab, ac); + }; + const BMI = (weight, height) => { + return parseFloat((weight / (height * height)).toFixed(2)); + }; + + const createLanguagesArray = () => { + const languages = ["Html", "CSS", "Java", "PHP"]; + return languages; + }; + + const createNumbersArray = () => { + const numbers = [0, 1, 2, 3, 4, 5]; + return numbers; + }; + + const replaceElement = languages => { + languages[2] = "Javascript"; + return languages; + }; + + const addElement = languages => { + languages.push("Ruby", "Python"); + return languages; + }; + + const addNumberElement = numbers => { + numbers.unshift(-2, -1); + return numbers; + }; + + const removeFirst = languages => { + languages.shift(); + return languages; + }; + + const removeLast = languages => { + languages.pop(); + return languages; + }; + + const convertStrToArr = social_arr => { + const tableau = social_arr.split(","); + return tableau; + }; + + const convertArrToStr = languages => { + const str = languages.join(); + return str; + }; + + const sortArr = social_arr => { + social_arr.sort(); + return social_arr; + }; + + const invertArr = function(social_arr) { + social_arr.reverse(); + return social_arr; + }; + \ No newline at end of file diff --git a/04_Challenges/cv-styling-master/public/style1/.vscode/settings.json b/04_Challenges/cv-styling-master/public/style1/.vscode/settings.json new file mode 100644 index 00000000..6f3a2913 --- /dev/null +++ b/04_Challenges/cv-styling-master/public/style1/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/04_Challenges/cv-styling-master/public/style1/image1.jpeg b/04_Challenges/cv-styling-master/public/style1/image1.jpeg new file mode 100644 index 00000000..08587e3b Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style1/image1.jpeg differ diff --git a/04_Challenges/cv-styling-master/public/style1/index.html b/04_Challenges/cv-styling-master/public/style1/index.html index c40c1144..cf40a0a7 100644 --- a/04_Challenges/cv-styling-master/public/style1/index.html +++ b/04_Challenges/cv-styling-master/public/style1/index.html @@ -12,6 +12,7 @@ + @@ -20,11 +21,11 @@
-

Student Name

-

Codes and Sleeps

+

Maya Atiah

+

Statistician

- Student Name + Student Name
@@ -32,7 +33,7 @@

Codes and Sleeps

About

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. + Willing to work as strong part of your team with my ability to completely use my statistical knowledge and other skillss in organiational development and to expand my statisticalwork experience.

@@ -43,20 +44,20 @@

Competencies

CSS -
+
Javascript
- HTML + R-programing
- CSS + SAS programing
- Javascript + SPSS
@@ -64,44 +65,44 @@

Competencies

Experiences

- Man2ouche Seller - Snack Edouard + Mathematics Teacher + At SPecial case department

- Paris + Aramoun 30 / 12 / - 1995 + 2021

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. + I worked as a mathematics teacher at the Eoropean Lebanese School.

- Man2ouche Seller - Snack Edouard + Math Tutor + at home

- Paris + Aramoun 30 / - 12 + 8 / - 1995 + 2018

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. + I have been teaching mathematics for cycle2, cycle3, and high school students.

@@ -109,53 +110,53 @@

Education

- Web Stack Training - Codi + Master in Statistics + at Lebanese University

- Beirut + Hadath - 30 + 5 / - 12 + 11 / - 1995 + 2022

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. + I took an advanced courses in SAS programing, database, categorical data analysis, and univariate data analysis.

- Man2ouche Seller - Snack Edouard + Bachelor in Applied mathematics + at Lebanese University

- Paris + Hadath - 30 + 5 / - 12 + 8 / - 1995 + 2021

- Pellentesque nec nisi at sapien sagittis sagittis. Aliquam eu condimentum mauris. Proin accumsan enim at risus hendrerit lobortis. Nunc sollicitudin sodales lectus, et rhoncus mi molestie hendrerit. Vestibulum velit lorem, rhoncus a congue ultricies, faucibus facilisis risus. Mauris turpis ante, aliquet ac venenatis at, ornare ut velit. Duis ut erat neque, eget consectetur tellus. -

+ I took an advanced courses in R-programing, regression of model and variance analysis, syrvey and techniques of sampling and techniques of insurance. +

Hobbies

@@ -164,29 +165,29 @@

Contact

Email
- student@codi.tech + maya.atia.99@outlook.com
Skype
-
first-last
+
Maya-Atiah
Phone/Whatsapp
- +9613123123 + +96103096433
Github
- UserName + Maya-Atiah
Facebook
- Profile Name + maya-atiah.99
diff --git a/04_Challenges/cv-styling-master/public/style1/style.css b/04_Challenges/cv-styling-master/public/style1/style.css new file mode 100644 index 00000000..00929a07 --- /dev/null +++ b/04_Challenges/cv-styling-master/public/style1/style.css @@ -0,0 +1,277 @@ +.content { + display: grid; + grid-template-columns: auto auto; + grid-gap: 10px; + justify-content: center; + column-gap: 100px; + grid-gap: 50px; +} + + +img { + margin-left: 50px; + margin-top: 50px; + height: 100px; +} + +body { + font-size: 15px; + color: black +} + +hgroup { + color: rgb(255, 38, 0); +} + +h1 { + + font-size: 50px; +} + +h2 { + font-size: 30px; +} + + +hgroup { + float: left; + +} + +figure { + height: 10px; +} + +header { + display: flex; + flex-direction: column; + background-color: gray; + +} + +h3 { + font-size: 20px; + border-bottom: 1px solid rgb(218, 217, 217); +} + +h3::before { + content: " "; + height: 15px; + width: 15px; + background-color: red; + border-radius: 50%; + display: inline-block; +} + +.experience-type, +.experience-date-separator { + color: rgb(255, 38, 0); +} + +.experience-institution { + color: rgba(240, 42, 75, 0.925); +} + +.experience-location, +.day, +.month, +.year { + color: gray; +} + +.contact-type { + color: white; + background-color: rgb(255, 38, 0); + margin-left: 20px; +} + +.contact-value { + color: rgb(255, 38, 0); + background-color: black; + margin-left: 20px; +} + +a:link { + color: rgb(255, 38, 0); + text-decoration: none; +} + +.contact-email, +.contact-skype, +.contact-phone, +.contact-github, +.contact-facebook { + display: grid; + grid-template-columns: 200px 300px; + grid-gap: 0; + margin: 0; + padding: 0; +} + +#contact { + position: absolute; + top: 1px; + right: 150px; + width: 400px; + height: 50px; + margin-right: 300px; +} + +.contents { + background-color: red; +} + +div.skill { + box-sizing: border-box; + margin: 10px; + padding: 10px; + background-color: gray; + color: white; + width: 100%; +} + + +#contact>h3 { + display: none; +} + +#contact>div>dl.contact.contact-email { + margin-top: 50px; + +} + + +.contact-value { + margin-left: -2px; +} + + + +.skills-primary .skill:first-child { + background-color: red; + width: 20%; + +} + +.skills-primary .skill:nth-child(2) { + background-color: red; + width: 5%; + +} + +.skills-primary .skill:nth-child(3) { + background-color: red; + width: 1%; + +} + +.skills-secondary .skill:nth-child(1) { + background-color: rgb(241, 70, 70); + width: 60%; + +} + +.skills-secondary .skill:nth-child(2) { + background-color: rgb(241, 70, 70); + width: 60%; + +} + +.skills-secondary .skill:nth-child(3) { + background-color: rgb(241, 70, 70); + width: 70%; + +} + +.experience-location::before { + content: "In" +} + +.skills-primary::before { + content: "Main"; +} + +.skills-secondary::before { + content: "Other"; +} + +@media only screen and (max-width: 1660) { + + #contact { + display: block; + } + .contact-value { + margin-left: 0; + } + .contact-value{ + background-color: white; + } + + +} + + +@media screen and (max-width: 1500px) { + + + .content { + display: block; + width: 90%; + margin: 0 auto; + } + + + header { + width: 100%; + + } + + hgroup { + float: none; + width: 90%; + margin-left: 40px; + + } + + figure { + display: none; + } + + #contact { + position: static; + margin-left: -37px; + } + +} + +.skill::before { + position: absolute; + display: block; + content: ''; + height: 50px; + width: 90%; + background-color: gray; + z-index: -1; + margin-top: -18px; + margin-left: -17px; + border: 3px solid white; +} + +@media all and (min-width:900px) { + .skill::before { + position: absolute; + display: block; + content: ''; + height: 50px; + width: 45%; + background-color: gray; + z-index: -1; + margin-top: -18px; + margin-left: -17px; + border: 3px solid white; + +} +.contact-value{ + background-color: white; +} +} \ No newline at end of file diff --git a/04_Challenges/cv-styling-master/public/style2/110x110.png b/04_Challenges/cv-styling-master/public/style2/110x110.png new file mode 100644 index 00000000..c58f2234 Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/110x110.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/90x90.png b/04_Challenges/cv-styling-master/public/style2/90x90.png new file mode 100644 index 00000000..4d546f13 Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/90x90.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/email.png b/04_Challenges/cv-styling-master/public/style2/email.png new file mode 100644 index 00000000..7a2e12dc Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/email.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/facebook.png b/04_Challenges/cv-styling-master/public/style2/facebook.png new file mode 100644 index 00000000..c0e4d382 Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/facebook.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/github.png b/04_Challenges/cv-styling-master/public/style2/github.png new file mode 100644 index 00000000..92d3c954 Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/github.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/image1.jpeg b/04_Challenges/cv-styling-master/public/style2/image1.jpeg new file mode 100644 index 00000000..08587e3b Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/image1.jpeg differ diff --git a/04_Challenges/cv-styling-master/public/style2/index.html b/04_Challenges/cv-styling-master/public/style2/index.html new file mode 100644 index 00000000..a1d6e166 --- /dev/null +++ b/04_Challenges/cv-styling-master/public/style2/index.html @@ -0,0 +1,198 @@ + + + + + + + + + + + JStudent | CV + + + + + + + + +
+
+
+
+

Maya Atiah

+

Statistician

+
+
+ Student Name +
+
+
+
+
+

About

+

+ Willing to work as strong part of your team with my ability to completely use my statistical knowledge and other skillss in organiational development and to expand my statisticalwork experience. +

+
+
+

Competencies

+
+
+ HTML +
+
+ CSS +
+
+ Javascript +
+
+
+
+ R-programing +
+
+ SAS programing +
+
+ SPSS +
+
+
+
+

Experiences

+
+

+ Mathematics Teacher + At SPecial case department +

+
+ + Aramoun + + + 30 + / + 12 + / + 2021 + +
+

+ I worked as a mathematics teacher at the Eoropean Lebanese School. +

+
+
+

+ Math Tutor + at home +

+
+ + Aramoun + + + 30 + / + 8 + / + 2018 + +
+

+ I have been teaching mathematics for cycle2, cycle3, and high school students. +

+
+
+
+

Education

+
+

+ Master in Statistics + at Lebanese University +

+
+ + Hadath + + + 5 + / + 11 + / + 2022 + +
+

+ I took an advanced courses in SAS programing, database, categorical data analysis, and univariate data analysis. +

+
+
+

+ Bachelor in Applied mathematics + at Lebanese University +

+
+ + Hadath + + + 5 + / + 8 + / + 2021 + +
+

+ I took an advanced courses in R-programing, regression of model and variance analysis, syrvey and techniques of sampling and techniques of insurance. +

+
+
+
+

Hobbies

+
    +
  • Drawing
    • +
  • Walking
    • +
  • Doodling
    • +
+
+
+

Contact

+
+
+
Email
+
+ maya.atia.99@outlook.com +
+
+
+
Skype
+
Maya-Atiah
+
+
+
Phone/Whatsapp
+
+ +96103096433 +
+
+
+
Github
+
+ Maya-Atiah +
+
+
+
Facebook
+
+ maya-atiah.99 +
+
+
+
+
+
+ + diff --git a/04_Challenges/cv-styling-master/public/style2/phone.png b/04_Challenges/cv-styling-master/public/style2/phone.png new file mode 100644 index 00000000..b60d57be Binary files /dev/null and b/04_Challenges/cv-styling-master/public/style2/phone.png differ diff --git a/04_Challenges/cv-styling-master/public/style2/style2.css b/04_Challenges/cv-styling-master/public/style2/style2.css new file mode 100644 index 00000000..fa5b7863 --- /dev/null +++ b/04_Challenges/cv-styling-master/public/style2/style2.css @@ -0,0 +1,261 @@ + +header{ + margin-bottom :20px;; +} +figure{ + float: right; + transform: rotate(-20deg); + position: absolute; + margin-left: 45%; + top: 1px; + +} +img{ + margin-top: 5px; + width: 30%; +} +#about p{ + color:rgb(155, 154, 154); +} +#about h3{ + display: none; +} +hgroup h2{ + display: none; +} +#about{ + margin-right: 40%; +} + + +.experience{ + display:flex; + flex-direction: column; +} +body{ margin-left: 400px; +margin-right: 400px;} +header{ + display: block; +} + + +hgroup{ + border-bottom: 1px solid rgb(172, 212, 218); +} +.experience-location,.day,.year,.month{ + color:lightgrey; + text-align: right; +} +.experience-type{ + color:rgb(64, 141, 115); +} + +.skills-primary{ + display: flex; + flex-direction: row; +} +.skills-secondary{ + display: flex; + flex-direction: row; +} + +#contact h3{ + display: none; +} + + +div.skill{ + box-sizing: border-box; + margin:10px; + padding:10px; + background-color: rgb(57, 136, 148); + color:white; + width:20%; + + } + +#competencies{ + display:grid; + grid-template-columns: 20% auto; + grid-template-rows: auto auto; +align-items: center; +align-items: start;} + +.skills-secondary{ + grid-area: 2 / 2 / 3 / 3; + +} + +#experiences{ + display:grid; + grid-template-columns: 20% auto; + grid-template-rows: auto auto; +align-items: center; +align-items: start;} + +.experience:nth-child(2){ + grid-area: 2 / 2 / 3 / 3; + +} + +#education{ + display:grid; + grid-template-columns: 20% auto; + grid-template-rows: auto auto; +align-items: center; +align-items: start;} + +.experience:nth-child(4){ + grid-area: 2 / 2 / 3 / 3; + +} +.experience:nth-child(3){ + grid-area: 1 / 2 / 2 / 3; + +} + +ul{ margin-left: 18%;} + +/*Contacts*/ + +.contacts{ + display: flex; + flex-direction: row; + + +} +.contact-type, .contact-value{ + visibility: hidden; +} + +.contact-skype { +display: none; +} + + +.contact-email .contact-value::after{ + visibility: visible; + content:""; + background-image: url( email.png ); + background-size:cover; + background-repeat: no-repeat; + display: inline-block; + width: 50px; + height:50px; +} + +.contact-facebook .contact-value::after{ + visibility: visible; + content:""; + background-image: url( facebook.png ); + background-size:cover; + background-repeat: no-repeat; + display: inline-block; + width: 50px; + height:50px; +} +.contact-phone .contact-value::after{ + visibility: visible; + content:""; + background-image: url( phone.png ); + background-size:cover; + background-repeat: no-repeat; + display: inline-block; + width: 50px; + height:50px; +} +.contact-github .contact-value::after{ + visibility: visible; + content:""; + background-image: url( github.png ); + background-size:cover; + background-repeat: no-repeat; + display: inline-block; + width: 50px; + height:50px; +} + +#competencies h3{ + border-right: 1px solid rgb(57, 136, 148); + height:100%; +} + +#experiences h3{ + border-right: 1px solid rgb(57, 136, 148); + height:100%; +} +#education h3{ + border-right: 1px solid rgb(57, 136, 148); + height:100%; +} + + + + +#hobbies h3{ + border-right: 1px solid rgb(57, 136, 148); + height:100%; +} + +.skills-primary [data-skill~="5"]::after{ + content:"★"; +} +.skills-primary [data-skill~="3"]::after{ + content:"★ ★"; +} +.skills-primary [data-skill~="1"]::after{ + content:"★"; +} +.skills-secondary [data-skill~="9"]::after{ + content:"★ ★ ★ ★ ★"; +} +.skills-secondary [data-skill~="5"]::after{ + content:"★ ★ ★ "; +} +.skills-secondary [data-skill~="7"]::after{ + content:"★ ★ ★ ★ "; +} + +.skills-secondary{ + font-size: 10px; +} + + +/*media query*/ + + + +@media only screen and (max-width: 1300px) { + + #about{ +margin-bottom: 70px; + } +body{ margin-left: auto; + margin-right: auto; + margin: 0 auto; + width: 95%;} + + figure{ + display: none; + + } + + .skills-primary, .skills-secondary{ + width:100%; + } + + div.skill{width:100%} + #competencies, #experiences, #education{ + display:block; + width:100%; + } + #about { + width:100%; + + } + + h3{ + border-bottom: 1px solid rgb(57, 136, 148); + } + +} \ No newline at end of file