secondproj

Student-Adil · Jan 16, 2025 · cfe0d9f · cfe0d9f
commit cfe0d9f
Show file tree

Hide file tree

Showing 7 changed files with 114 additions and 0 deletions.
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Launch Chrome against localhost",
+            "url": "http://localhost:8080",
+            "webRoot": "${workspaceFolder}"
+        }
+    ]
+}
diff --git a/images/active-states.jpg b/images/active-states.jpg
diff --git a/images/favicon-32x32.png b/images/favicon-32x32.png
diff --git a/images/illustration-article.svg b/images/illustration-article.svg
diff --git a/images/image-avatar.webp b/images/image-avatar.webp
diff --git a/ind.css b/ind.css
@@ -0,0 +1,67 @@
+*{
+    padding: 0;
+    margin: 0;
+    box-sizing: border-box;
+font-family:  sans-serif;
+}
+body{
+    background-color:#F5D04E;
+    display: flex;
+    justify-content: center;
+ align-items: center;
+ height: 100vh;
+ width: 100wh;
+
+}
+ .container{
+    padding: 20px;
+    display: flex;
+    background-color: #fff;
+    flex-direction: column;
+ border-radius: 20px;
+ box-shadow: 10px 10px 0px 0px black;
+ row-gap:20px;
+
+
+
+}
+.container > img{
+    width: 100%;
+    height: 40%;
+    border-radius: 10px;
+
+}
+button{
+    background-color:#F5D04E ;
+    color: black;
+    border-radius: 6px;
+    border: none;
+    font-weight: 800;
+    padding: 10px;
+    width: 80px;
+
+}
+p{
+    color: rgba(0, 0, 0, 0.465);
+   line-height: 1.5;
+    font-size: 16px;
+}
+h2{
+    color: #F5D04E;
+}
+.author{
+    display: flex;
+    align-items: center;
+    margin-top: 20px;
+}
+.author img{
+    width: 30px;
+    height: 30px;
+    border-radius: 50%;
+
+}
+.author span{
+    font-size: 12px;
+    font-weight: bold;
+    color:#333;
+} 
diff --git a/inex.html b/inex.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Carsds</title>
+</head>
+<link rel="stylesheet" href="ind.css">
+<body>
+  <div class="container">
+    <img src="images/illustration-article.svg" alt="Img"> <br>
+    <button>Learning</button>
+    <p class="date">Published 21 Dec 2023</p>
+
+ <h2>HTML & CSS foundations </h2>
+ <p>
+    These Languages are the backbone of every <br>
+    website,defiing structure,content,and <br>
+    presentation
+</p>
+<div class="author">
+    <img src="images/image-avatar.webp" alt="imgs" class="auther"> 
+ <span>
+    Gerg Hooper
+ </span>
+</div>
+
+  </div>
+
+</body>
+</html>