Skip to content

Practice #85

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 9 commits into from
Closed

Practice #85

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
0f87ca9
Updated Exercise 15
nafisadmankhan Aug 10, 2024
c793a2a
Update practice.css
nafisadmankhan Aug 10, 2024
066d6f1
Updated practice files
nafisadmankhan Aug 10, 2024
cce83f5
Updated
nafisadmankhan Aug 10, 2024
f2f298c
Updated
nafisadmankhan Aug 10, 2024
be377e1
Updated
nafisadmankhan Aug 10, 2024
14d3949
Updated
nafisadmankhan Aug 10, 2024
5c4081e
Updated
nafisadmankhan Aug 12, 2024
864788c
Updated
nafisadmankhan Aug 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 0 additions & 11 deletions 1-exercise-solutions/lesson-14/14a.css
View file
Open in desktop

This file was deleted.

9 changes: 7 additions & 2 deletions 1-exercise-solutions/lesson-14/14a.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
<html>
<head>
<link rel="stylesheet" href="14a.css">
<title>14a.html</title>
</head>
<body>
<div class="bottom-right">
<!-- bottom-right -->
<div style="background-color: black;
color: white;
position: fixed;
bottom: 20px;
right: 20px;">
bottom-right
</div>
</body>
Expand Down
13 changes: 0 additions & 13 deletions 1-exercise-solutions/lesson-14/14b.css
View file
Open in desktop

This file was deleted.

11 changes: 9 additions & 2 deletions 1-exercise-solutions/lesson-14/14b.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,16 @@
<html>
<head>
<link rel="stylesheet" href="14b.css">
<title>14b.html</title>
</head>
<body>
<div class="right-sidebar">
<!-- right-sidebar -->
<div style="background-color: green;
color: white;
position: fixed;
width: 100px;
right: 0;
bottom: 0;
top: 0;">
right sidebar
</div>
</body>
Expand Down
12 changes: 0 additions & 12 deletions 1-exercise-solutions/lesson-14/14c.css
View file
Open in desktop

This file was deleted.

10 changes: 8 additions & 2 deletions 1-exercise-solutions/lesson-14/14c.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,14 @@
<html>
<head>
<link rel="stylesheet" href="14c.css">
<title>14c.html</title>
</head>
<body>
<div class="cover"></div>
<!-- cover -->
<div style="background-color: black;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;"></div>
</body>
</html>
47 changes: 0 additions & 47 deletions 1-exercise-solutions/lesson-14/14d.css
View file
Open in desktop

This file was deleted.

55 changes: 52 additions & 3 deletions 1-exercise-solutions/lesson-14/14d.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,62 @@
<html>
<head>
<link rel="stylesheet" href="14d.css">
<title>14d.html</title>
<style>
body {
height: 3000px;
}

div {
font-family: Arial;
}

.right-sidebar {
background-color: green;
color: white;
position: fixed;
width: 100px;
right: 0;
bottom: 0;
top: 0;
}

.modal {
background-color: white;
width: 300px;
padding-top: 15px;
padding-bottom: 15px;
padding-left: 15px;
padding-right: 15px;
border-radius: 5px;
}

.modal-title {
font-family: Arial;
font-weight: bold;
font-size: 24px;
margin-bottom: 12px;
}

.modal-content {
font-family: Arial;
margin-bottom: 12px;
}
</style>
</head>
<body>
<div class="right-sidebar">
right sidebar
</div>

<div class="overlay">
<!-- overlay -->
<div style="background-color: rgba(0, 0, 0, 0.5);
display: flex;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
justify-content: center;
align-items: center;">
<div class="modal">
<div class="modal-title">
Modal Title
Expand Down
59 changes: 0 additions & 59 deletions 1-exercise-solutions/lesson-14/14e.css
View file
Open in desktop

This file was deleted.

65 changes: 62 additions & 3 deletions 1-exercise-solutions/lesson-14/14e.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,72 @@
<html>
<head>
<link rel="stylesheet" href="14e.css">
<title>14e.html</title>
<style>
body {
height: 3000px;
}

div {
font-family: Arial;
}
/* left-section */
.profile-picture {
width: 40px;
height: 40px;
object-fit: cover;
border-radius: 20px;
margin-right: 10px;
}

.name {
font-weight: bold;
font-family: Arial;
}

/* right-section */
.add-friend-button {
background-color: rgb(24, 119, 242);
color: white;
font-weight: bold;
border: none;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px;
border-radius: 6px;
margin-right: 3px;
}

.message-button {
background-color: rgb(230, 230, 230);
border: none;
font-weight: bold;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 12px;
padding-right: 12px;
border-radius: 6px;
}
</style>
</head>
<body>
<div class="header">
<div class="left-section">
<!-- header -->
<div style="display: flex;
justify-content: space-between;
align-items: center;
position: fixed;
top: 0;
left: 0;
right: 0;
padding: 10px 50px;
">
<!-- left-section -->
<div style="display: flex;
align-items: center;">
<img class="profile-picture" src="cat.jpg">
<div class="name">Oliver Cat</div>
</div>
<!-- right-section -->
<div class="right-section">
<button class="add-friend-button">Add Friend</button>
<button class="message-button">Message</button>
Expand Down
Loading