diff --git a/2-terrarium/solution.md b/2-terrarium/solution.md new file mode 100644 index 0000000..33e3fe8 --- /dev/null +++ b/2-terrarium/solution.md @@ -0,0 +1,101 @@ +# My Terrarium +## Subtopic 1: Intro to HTML + +### Assignment +``` + +

My terrarium

+
+``` +### Challenge +``` + + + + + + My Website + + +

Info about me

+
+
+

Name

+

P.Mihir

+
+
+

Bday/p> +

02-09-2005

+
+
+

Gender

+

Male

+
+
+

Address

+

Narsapur,W.G District,A.P

+
+

Education

+
+

College

+

Amrita

+
+
+

Branch

+

CSE

+
+
+

Semisterr

+

3

+
+
+ + +``` +--- + +## Subtopic-2: Intro to CSS +## Assignment +![image](https://github.com/user-attachments/assets/4e0672d3-a5a1-459a-9e2d-7b985df4a5d7) + +## Challenge +``` +.jar-glossy-long{ + width: 4%; + height: 25%; + background:#eee; + border-radius: 1rem; + position: absolute; + bottom: 18%; + left: 5%; +} +.jar-glossy-short{ + width: 4%; + height: 7%; + background: white; + border-radius: 1rem; + position: absolute; + bottom: 48%; + left: 5%; +} +``` +--- + +## Subtopic-3: Intro to DOM and Closures +## ASsignment +Event Interface (DOM Element) +Event Interfae is one of the central part of DOM and it represents an event that takes place on event target. It can be triggered by clicking the mouse button, keys on the keyboard, or network change. +we might find that event used in most of websites for capturing and responding to user interactions. It is also commonly used in our daily tasks of designing and developing websites. + +A classic example of where Event interface is used is in Google's Homepage. When you start searching for something the 'input' Event triggers and it will start showing some suggestion regarding the search content. + +## Challenge +``` +terrariumElement.addEventListener("dblclick", (event) => { + let highlightColor = "#FFD700"; + terrariumElement.style.border = "solid black 2px"; + terrariumElement.style.maxWidth = "85%"; + terrariumElement.style.background = highlightColor; + }); +} +``` \ No newline at end of file