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..bd6ec19c 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_2.html @@ -5,5 +5,6 @@ + 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..d0482bec 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..309a78c8 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_4.html @@ -9,7 +9,8 @@ - + + 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..79f3ee89 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_5.html @@ -8,7 +8,8 @@


- +
+ 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..a96ec127 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_6.html @@ -8,7 +8,8 @@


- +
+ 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..b774f44f 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_7.html @@ -8,7 +8,8 @@


- +
+ 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..2c7f3041 100644 --- a/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html +++ b/03_Exercises/03_JavaScript/javascript-basics-01/Step_8.html @@ -7,7 +7,8 @@

- +
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_03.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_03.js new file mode 100644 index 00000000..c8f9a0ec --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_03.js @@ -0,0 +1,6 @@ +var nickname = prompt("Enter your name "); +if (nickname == '') { + alert("wrong format") +} + else + alert("Welcome " +nickname) ; diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_04.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_04.js new file mode 100644 index 00000000..83d217c9 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_04.js @@ -0,0 +1,7 @@ + +function person(){ +const name1 = document.getElementById('name').value; +const surname = document.getElementById('surname').value; +const city = document.getElementById('city').value; +alert("name :" + name1 +"\n" + "surname :" + surname + "\n" + "city :" +city) ; +} diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_05.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_05.js new file mode 100644 index 00000000..20515092 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_05.js @@ -0,0 +1,9 @@ + + + + function muiltiply(){ + var x = document.getElementById('first_number').value; + var y = document.getElementById('second_number').value; + var result = x*y + alert("The final answer is :" +result) ; + } \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_06.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_06.js new file mode 100644 index 00000000..24bfda52 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_06.js @@ -0,0 +1,7 @@ + + function Division(){ + var x = document.getElementById('first_number').value; + var y = document.getElementById('second_number').value; + var remainder = x%y + alert("The final answer is :" +remainder) ; + } \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_07.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_07.js new file mode 100644 index 00000000..229f8560 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_07.js @@ -0,0 +1,5 @@ + function fxn(){ + var shoe_size = document.getElementById('shoe_size').value; + var year = document.getElementById('year').value; + var result = (shoe_size *2) +5 * 50 - year + 1766 ; + alert("the result is " +result); } \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-01/step_08.js b/03_Exercises/03_JavaScript/javascript-basics-01/step_08.js new file mode 100644 index 00000000..b5535614 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_08.js @@ -0,0 +1,8 @@ +function numb() +{ + var num1 = document.getElementById("age").value; + if(num1 > 18){ + alert("you are over 18") } + else + alert("you are under 18") ; +} \ 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..73f66e77 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_1.js @@ -0,0 +1,2 @@ +var name1 ; +alert(name1); \ No newline at end of file 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..112076f9 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-01/step_2.js @@ -0,0 +1,5 @@ +var name1 = 'Kanj' +var surname = 'Hasan' +var city = 'beirut' + +alert("name :" +name1 +"\n" + "surname :" + surname + "\n" + "city :" +city) \ 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..05304be7 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 @@ -5,6 +5,7 @@ Step 1 - + + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step1.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step1.js new file mode 100644 index 00000000..cd8a8b31 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 1/step1.js @@ -0,0 +1,5 @@ +var image1 ; + +function mouseover() { + image1 = document.querySelector('img').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..9ec785a6 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 @@ -7,6 +7,8 @@
-
+ + + 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..d597784e --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 2/step_2.js @@ -0,0 +1,4 @@ +var x = document.querySelector('input'); +x.onblur = function(){ + 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..2102764d 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 @@ -8,5 +8,7 @@
+
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_03.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_03.js new file mode 100644 index 00000000..42f5b690 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 3/step_03.js @@ -0,0 +1,7 @@ +let input = document.getElementById('name'); +let out = document.getElementById('out'); + +input.onkeyup = function() { + out.innerHTML = input.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..71b0c159 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 @@ -9,7 +9,8 @@ - + + diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_04.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_04.js new file mode 100644 index 00000000..cb5d5d09 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 4/step_04.js @@ -0,0 +1,14 @@ + +let btnclear = document.querySelector('button') ; +let input = document.querySelectorAll('input'); + +function promptMe() { + var confirmAction = confirm("Are you sure to execute this action?"); + if (confirmAction) + btnclear.addEventListener('click' , () =>{ + input.forEach(input => input.value= '' ); + }); + else { + alert("Action canceled"); + } +} 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..a13e9c15 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 @@ -6,11 +6,12 @@
- - - - - + + + + +
+ diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_05.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_05.js new file mode 100644 index 00000000..689802d0 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 5/step_05.js @@ -0,0 +1,8 @@ + +function mouseover() { + image1 = document.querySelector('#image1').src = "images/image2.jpg"; + image2 = document.querySelector('#image2').src = "images/image3.jpg"; + image3 = document.querySelector('#image3').src = "images/image4.jpg"; + image4 = document.querySelector('#image4').src = "images/image5.jpg"; + image5 = document.querySelector('#image5').src = "images/image1.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..d2fdcadb 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 @@ -5,10 +5,11 @@ Step 6 - - - - - - + + + + + + > + > diff --git a/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_06.js b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_06.js new file mode 100644 index 00000000..e86a12f7 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-02/step 6/step_06.js @@ -0,0 +1,8 @@ + +function mouseout() { + image1 = document.querySelector('#image1').src = "images/image2.jpg"; + image2 = document.querySelector('#image2').src = "images/image3.jpg"; + image3 = document.querySelector('#image3').src = "images/image4.jpg"; + image4 = document.querySelector('#image4').src = "images/image5.jpg"; + image5 = document.querySelector('#image5').src = "images/image1.jpg"; +} 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..dbc55226 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 @@ -7,4 +7,5 @@ + diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step01.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step01.js new file mode 100644 index 00000000..a8475e50 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 1/step01.js @@ -0,0 +1,5 @@ +var img = document.getElementById('image1') + +img.addEventListener('mouseover', function () { + img.style = 'border: 3px solid red'; + }); 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..b2e50d0f 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/step02.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/step02.js new file mode 100644 index 00000000..3cb3427d --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 2/step02.js @@ -0,0 +1,8 @@ +function showhide(x){ + if(x==0) + { + document.querySelector('p').style.display = "block" + }else if (x==1) { + document.querySelector('p').style.display = "none" + } +} \ No newline at end of file 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..b6338237 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/step03.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/step03.js new file mode 100644 index 00000000..b03f36d1 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 3/step03.js @@ -0,0 +1,10 @@ +var texts=document.getElementById('text'); + + function G() { + document.getElementById("text").style.color = "green";} + + function R() { + document.getElementById("text").style.color = "red"; } + + function B () { + document.getElementById("text").style.color = "blue"; } \ No newline at end of file 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..b5db8dd3 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 @@
- +
+ - + \ No newline at end of file diff --git a/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step04.js b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step04.js new file mode 100644 index 00000000..ec200e39 --- /dev/null +++ b/03_Exercises/03_JavaScript/javascript-basics-03/step 4/step04.js @@ -0,0 +1,14 @@ +var pass =document.getElementById('password'); +var conf =document.getElementById('confirmation'); + +function Test(){ + if(pass.value==conf.value){ + alert("correct"); + } + else{ + conf.style ='border:1px solid red'; + pass.style='border:1px solid red'; + + } + +} \ No newline at end of file diff --git a/04_Challenges/cv-styling-master/public/style1/index.html b/04_Challenges/cv-styling-master/public/style1/index.html index c40c1144..286575ba 100644 --- a/04_Challenges/cv-styling-master/public/style1/index.html +++ b/04_Challenges/cv-styling-master/public/style1/index.html @@ -11,17 +11,18 @@ JStudent | CV + -
+
-

Student Name

-

Codes and Sleeps

+

Hasan Kanj

+

Computer Scientest

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

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. -

-
+ Recent Graduate of LIU University aiming to launch web dev career. + I am Looking to establish a career in the field of Information Technology, + I wish to work in a growth-oriented company and contribute to the development of the organization while upgrading my skill set and knowledge.

Competencies

@@ -64,98 +65,99 @@

Competencies

Experiences

- Man2ouche Seller + Call Center Agent Snack Edouard

- Paris + Achrafieh 30 / - 12 + 6 / - 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. -

+ Inbound call activity: Rquest to amend or withdraw personal data.
+ Outbound call activity: Sensitization and mass information campaigns.

- Man2ouche Seller - Snack Edouard + Mobile Software and Hardware Technician + PUK

Paris - 30 + 1 / - 12 + 4 / - 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. -

+ Repaired hardware and software problems on cell phones. + Customers throughout the whole process, from empathized + with their problem to explain the repair.

Education

- Web Stack Training - Codi + Bachelor's degree in Computer Science. + LIU

Beirut - 30 + 1 / - 12 + 6 / - 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. -

+ Graduated with GPA 3.13.

- Man2ouche Seller - Snack Edouard + M.C.S + SE Student

- Paris + Beirut - 30 + 6 / - 12 + 6 / - 1995 + 2019

- 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. -

+ During my time in high school I had it really good moments, + but my best moments that I’ve experienced are in a particular class during my senior year, in Sacramento, Calif. + So I was basically a new student in these kind of classes .

Hobbies

    -
  • Watching Youtube
    • -
  • Sleeping
    • -
  • Writing CVs
    • +
  • Watching Movies
    • +
  • Playing Football
    • +
  • Reading
@@ -164,29 +166,29 @@

Contact

Email
- student@codi.tech + hasankanj4@gmail.com
Skype
-
first-last
+
hasankanj
Phone/Whatsapp
- +9613123123 + +961 71900468
Github
- UserName + Hasankanj
Facebook
- Profile Name + Hasan Kanj
@@ -194,4 +196,4 @@

Contact

- + \ No newline at end of file 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..569a5ebd --- /dev/null +++ b/04_Challenges/cv-styling-master/public/style1/style.css @@ -0,0 +1,366 @@ + +header{ + background-color: silver; + display: flex; + flex-direction: row; + align-items: row; + padding:30px 0px ; + } + + h1,h2{ font-size: 26px; + color: red; + font-weight: bold; } + + h4 { color: red; } + + hgroup { margin-left: 400px; } + + figure{ margin:-120px 0px 0px 650px !important; } + + .content{ + + grid-template-columns: 50% 50% ; + + padding: 50px 300px 50px 300px; + + display: inline-grid; + + } + section > h3{ + + border-bottom: 1px solid black; + + } + + + + section>h3::before{ + + content:' '; + + margin-right:8px; + + display:inline-block; /*understand well */ + + width: 20px; + + height: 20px; + + border-radius: 50%; + + background-color: red; + + } + + + + .experience-location::before + + {content: "In";} + + + + .day::before + + {content: "on ";} + + + + .experience-details{ + + opacity: 0.5; + + } + + + + .experience-institution::before{ + + content: '@ '; + + } + + + + .experience-date-separator{ + + color: red; + + } + + + + .skills-primary, .skills-secondary { + + padding-top: 10px; + + display: flex; + + flex-direction: column; + + justify-content: space-between; + + height: 130px; + + } + + + + .skills-primary{ + + margin-top: 35px; + + } + + + + .skills-secondary { + + margin-top: 20px; + + } + + .skills-primary::after{ + + display: block; + + content: 'Main'; + + position: absolute; + + margin-top: -20px; + + } + + + + .skills-secondary::after{ + + display: block; + + content: 'Other'; + + position: absolute; + + margin-top: -20px; + + } + + .skill { + + height: 38px; + + display: flex; + + align-items: center; + + background-color: gray + + } + + .skill span { + + align-items: center; + + margin-left: 10px; + + position: relative; + + z-index: 1; + + color: white; + + z-index: 1; + + width: 90%; + + height: 28px; + + margin-left: 10px; + + display: flex; + + } + + + .skill span::after{ + + position: absolute; + + content: ''; + + height: 30px; + + background-color: red; + + z-index: -1; + + margin-left: -7px; + + } + + + + [data-skill="1"] span::after { + + width: 8%; + + } + + [data-skill="3"] span::after { + + width: 32%; + + } + + [data-skill="5"] span::after { + + width: 50%; + + + + } + + [data-skill="7"] span::after { + + width: 73%; + + opacity: 0.5 + + ;} + + + + [data-skill="9"] span::after { + + width: 93%; + + opacity: 0.5; + + } + + + + .contact{ + + display: flex; + + flex-direction: row; + + margin:0px; + + } + + .contact-type{ + + width: 17%; + + background-color: red; + + color: white; + + padding:5px 5px 5px 5px; + + } + + .contact-value{ + + width: 83%; + + padding:10px 0x 10px 0px; + + margin: 0px; + + background-color: rgb(0, 0, 0); + + color: red; + + } + + a{ + + color:red; + + text-decoration: none; + + } + + #contact > h3{ + + display: none; + + } + + + + .contacts{ + + margin-top: -1030px; + + } + + + + + + @media only screen and (max-width: 600px) { + + header>div { + + display: inline-block; + + margin: 30px; + + + + } + + hgroup{ + + + + margin: 0px; + + } + + + + figure{ + + + + margin:15px !important; + + } + .content{ + + display: block; + + padding:10px; + + } + .contacts{ + + margin-top:10px; + + } + .contact-type{ + + width:30%; + + } + + + + .contact-value{ + + width:70%; + + background-color:white; + + } + + #contact > div > dl.contact.contact-skype > dd{ + + color:black; }} + \ No newline at end of file diff --git a/ad b/ad new file mode 100644 index 00000000..7ad3fa15 --- /dev/null +++ b/ad @@ -0,0 +1,8 @@ + cv-styling1 + cv-styling2 + cv_styling1 + javascript-03 + js_bs02 +* js_bs03 + js_bs04 + master