foundations done

abominalizer · abominalizer · commit ec5f58c1a9f7 · 2022-10-11T15:35:17.000+01:00
diff --git a/foundations/02-class-id-selectors/index.html b/foundations/02-class-id-selectors/index.html
@@ -9,9 +9,9 @@
   </head>
   <body>
     <p>Number 1 - I'm a class!</p>
-    <div>Number 2 - I'm one ID.</div>
-    <p>Number 3 - I'm a class, but cooler!</p>
-    <div>Number 4 - I'm another ID.</div>
+    <div id="two">Number 2 - I'm one ID.</div>
+    <p class="three">Number 3 - I'm a class, but cooler!</p>
+    <div class="four">Number 4 - I'm another ID.</div>
     <p>Number 5 - I'm a class!</p>
   </body>
 </html>
diff --git a/foundations/02-class-id-selectors/style.css b/foundations/02-class-id-selectors/style.css
@@ -0,0 +1,19 @@
+p{
+  background-color: lightcoral;
+  font-family: Verdana, sans-serif;
+}
+#two
+{
+    color:blue;
+    font-size:36px;
+}
+
+.three{
+    font-size: 24px;
+}
+
+.four {
+background-color: lightgreen;
+font-size: 24px;
+font-weight: bold;
+}
diff --git a/foundations/03-grouping-selectors/index.html b/foundations/03-grouping-selectors/index.html
@@ -8,7 +8,7 @@
     <link rel="stylesheet" href="style.css">
   </head>
   <body>
-    <button>Click Me!</button>
-    <button>No, Click Me!</button>
+    <button class="one">Click Me!</button>
+    <button class="two">No, Click Me!</button>
   </body>
 </html>
diff --git a/foundations/03-grouping-selectors/style.css b/foundations/03-grouping-selectors/style.css
@@ -0,0 +1,15 @@
+.one, .two {
+    font-size: 28px;
+    font-family: helvetica, 'Times New Roman', sans-serif;
+}
+
+.one{
+background-color: black;
+color: white;
+}
+
+.two{
+color: yellow;
+
+}
+
diff --git a/foundations/04-chaining-selectors/style.css b/foundations/04-chaining-selectors/style.css
@@ -0,0 +1,10 @@
+.avatar.proportioned{
+    width: 300px;
+    height: auto;
+
+}
+
+.avatar.distorted{
+    width: 200px;
+    height: 400px;
+}
diff --git a/foundations/05-descendant-combinator/style.css b/foundations/05-descendant-combinator/style.css
@@ -0,0 +1,7 @@
+div  p{
+background-color: yellow;
+color: red;
+font-size: 20px;
+text-align: center;
+
+}
diff --git a/foundations/06-cascade-fix/style.css b/foundations/06-cascade-fix/style.css
@@ -2,6 +2,10 @@ body{
   font-family:Arial, Helvetica, sans-serif
 }
 
+.para {
+  font-size: 22px;
+}
+
 .para,
 .small-para {
   color: hsl(0, 0%, 0%);
@@ -13,8 +17,10 @@ body{
   font-weight: 800;
 }
 
-.para {
-  font-size: 22px;
+.button {
+  background-color: rgb(255, 255, 255);
+  color: rgb(0, 0, 0);
+  font-size: 20px;
 }
 
 .confirm {
@@ -23,20 +29,14 @@ body{
   font-weight: bold;
 } 
 
-.button {
-  background-color: rgb(255, 255, 255);
+div.text {
   color: rgb(0, 0, 0);
-  font-size: 20px;
+  font-size: 22px;
+  font-weight: 100;
 }
 
 .child {
   color: rgb(0, 0, 0);
   font-weight: 800;
   font-size: 14px;
 }
-
-div.text {
-  color: rgb(0, 0, 0);
-  font-size: 22px;
-  font-weight: 100;
-}
