diff --git a/images/code with harry.jpg b/images/code with harry.jpg new file mode 100644 index 0000000..8e299d2 Binary files /dev/null and b/images/code with harry.jpg differ diff --git a/images/download.png b/images/download.png new file mode 100644 index 0000000..9e7baee Binary files /dev/null and b/images/download.png differ diff --git a/images/pic1 - Copy.jpeg b/images/pic1 - Copy.jpeg new file mode 100644 index 0000000..fe86bc1 Binary files /dev/null and b/images/pic1 - Copy.jpeg differ diff --git a/images/pic1.jpeg b/images/pic1.jpeg new file mode 100644 index 0000000..fe86bc1 Binary files /dev/null and b/images/pic1.jpeg differ diff --git a/images/pic10.webp b/images/pic10.webp new file mode 100644 index 0000000..5238817 Binary files /dev/null and b/images/pic10.webp differ diff --git a/images/pic11.jpeg b/images/pic11.jpeg new file mode 100644 index 0000000..fb65d75 Binary files /dev/null and b/images/pic11.jpeg differ diff --git a/images/pic12.webp b/images/pic12.webp new file mode 100644 index 0000000..7cd187b Binary files /dev/null and b/images/pic12.webp differ diff --git a/images/pic13.webp b/images/pic13.webp new file mode 100644 index 0000000..7c67a0e Binary files /dev/null and b/images/pic13.webp differ diff --git a/images/pic14.webp b/images/pic14.webp new file mode 100644 index 0000000..772437c Binary files /dev/null and b/images/pic14.webp differ diff --git a/images/pic15.jpeg b/images/pic15.jpeg new file mode 100644 index 0000000..b45bbb6 Binary files /dev/null and b/images/pic15.jpeg differ diff --git a/images/pic16.webp b/images/pic16.webp new file mode 100644 index 0000000..17a165d Binary files /dev/null and b/images/pic16.webp differ diff --git a/images/pic17.jpeg b/images/pic17.jpeg new file mode 100644 index 0000000..81f6948 Binary files /dev/null and b/images/pic17.jpeg differ diff --git a/images/pic18.jpeg b/images/pic18.jpeg new file mode 100644 index 0000000..e97cf8d Binary files /dev/null and b/images/pic18.jpeg differ diff --git a/images/pic19.webp b/images/pic19.webp new file mode 100644 index 0000000..d313235 Binary files /dev/null and b/images/pic19.webp differ diff --git a/images/pic2 - Copy.jpeg b/images/pic2 - Copy.jpeg new file mode 100644 index 0000000..a2d3df2 Binary files /dev/null and b/images/pic2 - Copy.jpeg differ diff --git a/images/pic2.jpeg b/images/pic2.jpeg new file mode 100644 index 0000000..a2d3df2 Binary files /dev/null and b/images/pic2.jpeg differ diff --git a/images/pic20.jpeg b/images/pic20.jpeg new file mode 100644 index 0000000..d28d835 Binary files /dev/null and b/images/pic20.jpeg differ diff --git a/images/pic21.jpeg b/images/pic21.jpeg new file mode 100644 index 0000000..25dc6d1 Binary files /dev/null and b/images/pic21.jpeg differ diff --git a/images/pic22 - Copy.jpeg b/images/pic22 - Copy.jpeg new file mode 100644 index 0000000..63bd92a Binary files /dev/null and b/images/pic22 - Copy.jpeg differ diff --git a/images/pic22.jpeg b/images/pic22.jpeg new file mode 100644 index 0000000..63bd92a Binary files /dev/null and b/images/pic22.jpeg differ diff --git a/images/pic23.jpeg b/images/pic23.jpeg new file mode 100644 index 0000000..70f3edb Binary files /dev/null and b/images/pic23.jpeg differ diff --git a/images/pic24.webp b/images/pic24.webp new file mode 100644 index 0000000..7ba20e5 Binary files /dev/null and b/images/pic24.webp differ diff --git a/images/pic25.webp b/images/pic25.webp new file mode 100644 index 0000000..91de224 Binary files /dev/null and b/images/pic25.webp differ diff --git a/images/pic27.jpeg b/images/pic27.jpeg new file mode 100644 index 0000000..d2b792f Binary files /dev/null and b/images/pic27.jpeg differ diff --git a/images/pic28.webp b/images/pic28.webp new file mode 100644 index 0000000..f90da85 Binary files /dev/null and b/images/pic28.webp differ diff --git a/images/pic29.webp b/images/pic29.webp new file mode 100644 index 0000000..7e48780 Binary files /dev/null and b/images/pic29.webp differ diff --git a/images/pic3 - Copy.webp b/images/pic3 - Copy.webp new file mode 100644 index 0000000..bb85430 Binary files /dev/null and b/images/pic3 - Copy.webp differ diff --git a/images/pic3.webp b/images/pic3.webp new file mode 100644 index 0000000..bb85430 Binary files /dev/null and b/images/pic3.webp differ diff --git a/images/pic30.webp b/images/pic30.webp new file mode 100644 index 0000000..188a9b3 Binary files /dev/null and b/images/pic30.webp differ diff --git a/images/pic31.webp b/images/pic31.webp new file mode 100644 index 0000000..5e95fff Binary files /dev/null and b/images/pic31.webp differ diff --git a/images/pic32.webp b/images/pic32.webp new file mode 100644 index 0000000..a18e601 Binary files /dev/null and b/images/pic32.webp differ diff --git a/images/pic33.jpeg b/images/pic33.jpeg new file mode 100644 index 0000000..5320099 Binary files /dev/null and b/images/pic33.jpeg differ diff --git a/images/pic34.jpeg b/images/pic34.jpeg new file mode 100644 index 0000000..fd57f5d Binary files /dev/null and b/images/pic34.jpeg differ diff --git a/images/pic35.webp b/images/pic35.webp new file mode 100644 index 0000000..d111898 Binary files /dev/null and b/images/pic35.webp differ diff --git a/images/pic36.jpeg b/images/pic36.jpeg new file mode 100644 index 0000000..0ca458c Binary files /dev/null and b/images/pic36.jpeg differ diff --git a/images/pic37.webp b/images/pic37.webp new file mode 100644 index 0000000..17c9a50 Binary files /dev/null and b/images/pic37.webp differ diff --git a/images/pic4.jpeg b/images/pic4.jpeg new file mode 100644 index 0000000..c3603c0 Binary files /dev/null and b/images/pic4.jpeg differ diff --git a/images/pic5 - Copy.jpeg b/images/pic5 - Copy.jpeg new file mode 100644 index 0000000..48880c5 Binary files /dev/null and b/images/pic5 - Copy.jpeg differ diff --git a/images/pic5.jpeg b/images/pic5.jpeg new file mode 100644 index 0000000..48880c5 Binary files /dev/null and b/images/pic5.jpeg differ diff --git a/images/pic6 - Copy.webp b/images/pic6 - Copy.webp new file mode 100644 index 0000000..46aac5d Binary files /dev/null and b/images/pic6 - Copy.webp differ diff --git a/images/pic6.webp b/images/pic6.webp new file mode 100644 index 0000000..46aac5d Binary files /dev/null and b/images/pic6.webp differ diff --git a/images/pic7.webp b/images/pic7.webp new file mode 100644 index 0000000..17a165d Binary files /dev/null and b/images/pic7.webp differ diff --git a/images/pic8 - Copy.jpeg b/images/pic8 - Copy.jpeg new file mode 100644 index 0000000..5218f66 Binary files /dev/null and b/images/pic8 - Copy.jpeg differ diff --git a/images/pic8.jpeg b/images/pic8.jpeg new file mode 100644 index 0000000..5218f66 Binary files /dev/null and b/images/pic8.jpeg differ diff --git a/images/pic9 - Copy.webp b/images/pic9 - Copy.webp new file mode 100644 index 0000000..ecd02eb Binary files /dev/null and b/images/pic9 - Copy.webp differ diff --git a/images/pic9.webp b/images/pic9.webp new file mode 100644 index 0000000..ecd02eb Binary files /dev/null and b/images/pic9.webp differ diff --git a/images/red-youtube-logo-social-media-logo_197792-1803.avif b/images/red-youtube-logo-social-media-logo_197792-1803.avif new file mode 100644 index 0000000..6eeb124 Binary files /dev/null and b/images/red-youtube-logo-social-media-logo_197792-1803.avif differ diff --git a/images/unnamed.jpg b/images/unnamed.jpg new file mode 100644 index 0000000..0cd9b35 Binary files /dev/null and b/images/unnamed.jpg differ diff --git a/images/youtube-logo_729830-34.avif b/images/youtube-logo_729830-34.avif new file mode 100644 index 0000000..54cf279 Binary files /dev/null and b/images/youtube-logo_729830-34.avif differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..676b36e --- /dev/null +++ b/index.html @@ -0,0 +1,1338 @@ + + + + + + + Document + + + + + +
+ + +
+ + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav Menu + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ +
+ + +
+ +
+ img + +
+
16:22
+
+
+ +
+
+ +
+

Smooth Scroll and Nav menu in + HTML CSS JS only +

+
+ +
+ Online web ustaad +
+ + +
+ 2.2K views • 1 year ago +
+
+ +
+ + + + + + + + + + +
+
+ + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..fa6474f --- /dev/null +++ b/style.css @@ -0,0 +1,157 @@ +* { + margin: 0; + padding: 0; +} + +#navbar { + margin: 0; + font-family: Arial, sans-serif; +} + +.navbar { + background-color: #fff; + box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1); + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px 20px; + position: sticky; + top: 0%; +} + +.navbar_logo img { + height: 30px; +} + +.search-bar { + display: flex; + align-items: center; +} + +.search-bar input { + padding: 8px; + margin-right: 10px; + border: 1px solid #ccc; + border-radius: 4px; +} + +.search-button { + padding: 8px 12px; + background-color: #ff0000; + color: #fff; + border: none; + border-radius: 4px; + cursor: pointer; +} + +.menu ul { + list-style: none; + display: flex; +} + +.menu li { + margin-right: 15px; +} + +.menu a { + text-decoration: none; + color: #333; + font-weight: bold; +} + +.menu a:hover { + color: #ff0000; +} +/* .ytlogo{ + height: 500px; + width: 250px; +} */ + +.container { + display: flex; + flex-direction: row; + flex-flow: wrap; + justify-content: space-evenly; + margin-top: 1rem; + +} + +.box { + padding-bottom: 20px; + +} + +.master_img_container { + /* height: 100%; */ + width: 320px; + position: relative; +} + +.img_container { + margin-bottom: 10px; + height: 200px; + width: 100%px; + cursor: pointer; + /* border-radius: 10%; */ +} + +.master_img { + height: 100%; + width: 100%; +border-radius: 5%; +} + +.master_img:hover { + opacity: 0.5; + + + + +} + +.logo_container { + height: 36px; + width: 36px; + margin: 5px; + float: left; +} + +.logo { + height: 100%; + width: 100%; + border-radius: 50%; + +} + +.text { + width: 75%; +} + +.content { + font-family: 'Roboto', sans-serif; + font-size: 0.95rem; + line-height: 1.5rem; + font-weight: 500; + max-height: 4rem; + margin-bottom: -0.5rem; +} + +.pg_name,.activity { + margin: 12px 5px 5px 46px; + font-family: 'Roboto', sans-serif; + font-size: 14px; + font-weight: 400; + color: gray; + line-height: 1px; +} + +.time { + position: absolute; + bottom: 8px; + right: 10px; + color: white; + border: 1px solid black; + background-color: rgb(35, 20, 20); + width: 40px; + border-radius: 2px; +} \ No newline at end of file