├── .DS_Store ├── .vscode └── settings.json ├── ARITRA ├── index.css ├── index.html └── index.js ├── Analog Watch └── index.html ├── Avik ├── flipkartCloning.css └── flipkartCloning.html ├── BISHAL SEN └── HOTELS.html ├── BISHAL └── BISHAL.html ├── DHRITI ├── QUIZ │ └── QUIZ.html └── digitalproduct.html ├── DisneyHotstarClone ├── images │ ├── add.png │ ├── disney.png │ ├── favicon.ico │ ├── geographic.png │ ├── logo.png │ ├── marvel.png │ ├── nxt.png │ ├── pixar.png │ ├── play.png │ ├── poster 1.png │ ├── poster 10.png │ ├── poster 11.png │ ├── poster 12.png │ ├── poster 2.png │ ├── poster 3.png │ ├── poster 4.png │ ├── poster 5.png │ ├── poster 6.png │ ├── poster 7.png │ ├── poster 8.png │ ├── poster 9.png │ ├── pre.png │ ├── slider1.png │ ├── slider2.png │ ├── slider3.png │ ├── slider4.png │ ├── slider5.png │ └── star-wars.png ├── index.html ├── index.js ├── styles.css └── videos │ ├── disney.mp4 │ ├── geographic.mp4 │ ├── marvel.mp4 │ ├── pixar.mp4 │ └── star-war.mp4 ├── Jyotirmoy_SimpleCalculator ├── index.html ├── script.js └── style.css ├── MyClubPage ├── clubSite.html └── pics │ ├── 0c33d3ec-30b8-4ac5-9b69-bb311b994a9f.png │ ├── 48227582-a866-41ea-a0a2-56b3f9957ac5.png │ ├── 54617dcd-e054-4da2-a4f9-a7cdf79d71d5.png │ ├── 829b9576-69dd-43c7-aa30-5b1e31421723.png │ ├── b5d8a417-92d3-4e5b-9e73-a44b423cb9b2.png │ ├── bee.png │ ├── block-courses.png │ ├── c77e8af9-82c7-49ad-b05f-745e693f643a.png │ ├── facebook2x-1.png │ ├── facebook2x-2.png │ ├── facebook2x.png │ ├── instagram2x-1.png │ ├── instagram2x-2.png │ ├── instagram2x.png │ ├── instructor.png │ ├── linkedin2x-1.png │ ├── linkedin2x-2.png │ ├── linkedin2x.png │ ├── model-black-courses.png │ ├── owners_2-42.png │ ├── pexels-karolina-grabowska-4491461.jpg │ ├── pexels-katerina-holmes-5905709.jpg │ ├── pexels-monstera-6238120.jpg │ ├── play-video.png │ ├── review-stars.png │ ├── testimonio-46.png │ ├── testimonio_2-46__1_.png │ ├── twitter2x-1.png │ ├── twitter2x-2.png │ ├── twitter2x.png │ └── youtube2x.png ├── Nishtha ├── index.html └── undraw_Male_avatar_re_hguk.png ├── Palak └── analog clock ├── Prasun ├── PizzaLanding.html └── images │ ├── DIVIDER01.png │ ├── DIVIDER02.png │ ├── PIZZA.png │ ├── facebook2x.png │ ├── instagram2x.png │ ├── linkedin2x.png │ ├── logo-pizza.png │ ├── order1.png │ ├── order2.png │ ├── pizza-01-11.png │ ├── pizza-01-12.png │ ├── pizza-01-13.png │ ├── pizza-04.png │ ├── share1.png │ └── twitter2x.png ├── Priyadarshan ├── .DS_Store ├── README.md ├── firebase.json ├── package-lock.json ├── package.json ├── public │ ├── favicon.ico │ ├── images │ │ ├── cta-logo-one.png │ │ ├── cta-logo-one.svg │ │ ├── cta-logo-two.png │ │ ├── group-icon.png │ │ ├── home-background.png │ │ ├── home-icon.svg │ │ ├── login-background.jpg │ │ ├── logo.svg │ │ ├── movie-icon.svg │ │ ├── original-icon.svg │ │ ├── play-icon-black.png │ │ ├── play-icon-white.png │ │ ├── search-icon.svg │ │ ├── series-icon.svg │ │ ├── slider-badag.jpg │ │ ├── slider-badging.jpg │ │ ├── slider-scale.jpg │ │ ├── slider-scales.jpg │ │ ├── viewers-disney.png │ │ ├── viewers-marvel.png │ │ ├── viewers-national.png │ │ ├── viewers-pixar.png │ │ ├── viewers-starwars.png │ │ └── watchlist-icon.svg │ ├── index.html │ ├── logo192.png │ ├── logo512.png │ ├── manifest.json │ ├── robots.txt │ └── videos │ │ ├── 1564674844-disney.mp4 │ │ ├── 1564676115-marvel.mp4 │ │ ├── 1564676296-national-geographic.mp4 │ │ ├── 1564676714-pixar.mp4 │ │ └── 1608229455-star-wars.mp4 ├── src │ ├── App.css │ ├── App.js │ ├── app │ │ └── store.js │ ├── components │ │ ├── Detail.js │ │ ├── Header.js │ │ ├── Home.js │ │ ├── ImgSlider.js │ │ ├── Login.js │ │ ├── NewDisney.js │ │ ├── Originals.js │ │ ├── Recommends.js │ │ ├── Trending.js │ │ └── Viewers.js │ ├── disneyPlusMoviesData.json │ ├── features │ │ ├── movie │ │ │ └── movieSlice.js │ │ └── user │ │ │ └── userSlice.js │ ├── firebase.js │ ├── index.css │ └── index.js └── yarn.lock ├── README.md ├── Rayoti ├── Hover Button │ ├── index.html │ ├── script.js │ └── style.css └── SimpleJobApplicationWebsite │ ├── first.html │ └── first_style.css ├── RegistrationForm ├── index.html └── regform.css ├── Resume Webpage ├── SHINJINI └── index.html ├── SRIJAN ├── srijan.css ├── srijan.html └── srijan.js ├── Sayan Das └── index.html ├── Shanit ├── Musick │ └── index.html └── index.css ├── Snigdha's Login Webpage ├── index.html ├── script.js └── style.css ├── Snigdha ├── __pycache__ │ └── librarym.cpython-38.pyc ├── database │ └── library2.sql └── librarym.py ├── Sudoku-Solver ├── files │ ├── favicon_io │ │ ├── android-chrome-192x192.png │ │ ├── android-chrome-512x512.png │ │ ├── apple-touch-icon.png │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── favicon.ico │ │ └── site.webmanifest │ └── images │ │ ├── ss00.png │ │ └── ss01.png ├── index.html ├── scripts │ ├── app.js │ ├── draw_board.js │ ├── load_boards.js │ └── solver.js └── styles │ └── style.css ├── Supratim └── index1.html ├── Suvarnesh ├── 404.html ├── css │ ├── aos.css │ ├── bootstrap.min.css │ └── main.css ├── favicon.ico ├── images │ ├── address_book.jpg │ ├── cc-bg-1.jpg │ ├── covid_19.jpg │ ├── graphic-design-1.jpg │ ├── graphic-design-2.jpg │ ├── graphic-design-3.jpg │ ├── graphic-design-4.jpg │ ├── logo512.png │ ├── logo64.png │ ├── photography-1.jpg │ ├── photography-2.jpg │ ├── photography-3.jpg │ ├── photography-4.jpg │ ├── project-1.jpg │ ├── project-2.jpg │ ├── project-3.jpg │ ├── project-4.jpg │ ├── reference-image-1.jpg │ ├── reference-image-2.jpg │ ├── reference-image-3.jpg │ ├── staticmap.png │ ├── suvarneshkm.jpg │ ├── todo-react.jpg │ └── todo_django.jpg ├── index.html ├── js │ ├── aos.js │ ├── core │ │ ├── bootstrap.min.js │ │ ├── jquery.3.2.1.min.js │ │ └── popper.min.js │ ├── now-ui-kit.js │ └── plugins │ │ ├── bootstrap-datepicker.js │ │ ├── bootstrap-switch.js │ │ ├── jquery.sharrre.js │ │ └── nouislider.min.js ├── manifest.json ├── script.js ├── scripts │ └── main.js └── sworker.js ├── Tick Tac Game └── index2.html ├── White Board └── Online-WhiteBoard │ ├── README.md │ ├── index.html │ ├── online_Whiteboard.png │ ├── script.js │ └── style.css ├── abhijan ├── htm.html ├── index.html ├── index.js └── styles.css ├── arnab └── arnab.html ├── code-soham ├── README.md ├── asset-manifest.json ├── assets │ ├── bg-st-stp.svg │ └── icons │ │ ├── aws.svg │ │ ├── c++.svg │ │ ├── canva.svg │ │ ├── css3.svg │ │ ├── gcp.svg │ │ ├── git.svg │ │ ├── github.svg │ │ ├── heroku.svg │ │ ├── html.svg │ │ ├── js.svg │ │ ├── mongodb.svg │ │ ├── mui.png │ │ ├── nodejs.svg │ │ ├── office.svg │ │ ├── postman.svg │ │ ├── pp.svg │ │ ├── python.svg │ │ ├── reactjs.svg │ │ ├── sparkar.png │ │ ├── sublime.svg │ │ ├── tailwind.svg │ │ └── vscode.svg ├── code-soham.html ├── favicon.ico ├── logo192.png ├── logo512.png ├── manifest.json ├── robots.txt └── static │ ├── css │ ├── main.3e35f1d3.css │ └── main.3e35f1d3.css.map │ ├── js │ ├── 787.0a7689f1.chunk.js │ ├── 787.0a7689f1.chunk.js.map │ ├── main.a46eb33d.js │ ├── main.a46eb33d.js.LICENSE.txt │ └── main.a46eb33d.js.map │ └── media │ ├── revicons.57fd05d4ae650374c8de.ttf │ ├── revicons.a77de540a38981833f9e.eot │ └── revicons.e8746a624ed098489406.woff ├── ds └── bijoya.html ├── gitnandini └── landing_page.html ├── libinmv_resume ├── libinmv_resume.html └── src │ ├── resume.css │ └── resume.js ├── portfolio_webpage ├── portfolio.html └── style.css ├── profile.html ├── signup_page ├── signup.css └── signup.html └── sulagna └── index.html /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/.DS_Store -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5504 3 | } -------------------------------------------------------------------------------- /ARITRA/index.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap'); 2 | 3 | *{ 4 | padding: 0; 5 | margin: 0; 6 | } 7 | 8 | body{ 9 | position: relative; 10 | background-color: #c68c53a8; 11 | font-family: 'Architects Daughter', cursive; 12 | } 13 | 14 | button{ 15 | padding: 10px; 16 | outline: none; 17 | cursor: pointer; 18 | font-family: inherit; 19 | border-radius: 5px; 20 | background: whitesmoke; 21 | border: 1px solid lightgray; 22 | } 23 | 24 | button:hover{ 25 | color: white; 26 | background-color: rgba(0, 0, 0, 0.1); 27 | } 28 | 29 | #modal{ 30 | position: fixed; 31 | z-index: 1; 32 | width: 100%; 33 | min-height: 100vh; 34 | background-color: rgba(0, 0, 0, 0.5); 35 | } 36 | 37 | #inner_modal{ 38 | display: flex; 39 | justify-content: center; 40 | align-items: center; 41 | min-height: 100vh; 42 | } 43 | 44 | #inner_modal textarea{ 45 | width: 276px; 46 | height: 276px; 47 | padding: 25px; 48 | outline: none; 49 | resize: none; 50 | font-size: 1.5rem; 51 | font-family: inherit; 52 | box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.9); 53 | } 54 | 55 | #inner_modal i{ 56 | font-size: 1.4rem; 57 | color: gray; 58 | cursor: pointer; 59 | margin-top: -285px; 60 | margin-left: -35px; 61 | transition: 1s ease-in-out; 62 | } 63 | 64 | #inner_modal i:hover{ 65 | color: lightgray; 66 | } 67 | 68 | .container{ 69 | width: 1280px; 70 | margin: auto; 71 | } 72 | 73 | #header{ 74 | color: white; 75 | padding: 0 20px; 76 | min-height: 70px; 77 | text-shadow: 1px 1px black; 78 | display: flex; 79 | flex-wrap: wrap; 80 | justify-content: space-between; 81 | align-items: center; 82 | } 83 | 84 | .fas{ 85 | color: #c2ff3d; 86 | } 87 | 88 | #all_notes{ 89 | display: flex; 90 | justify-content: center; 91 | flex-wrap: wrap; 92 | padding-top: 10px; 93 | } 94 | 95 | .note{ 96 | width:300px; 97 | height: 300px; 98 | transition: 2s; 99 | cursor: pointer; 100 | overflow-wrap: break-word; 101 | box-shadow: 0px 10px 24px 0px rgba(0,0,0,0.75); 102 | } 103 | 104 | .note h1{ 105 | font-size: 1.5rem; 106 | } 107 | 108 | .details { 109 | margin-top: 25px; 110 | padding: 0 15px; 111 | font-size: 1.5rem; 112 | } 113 | 114 | .details i{ 115 | color: whitesmoke; 116 | cursor: pointer; 117 | text-shadow: 1px 1px #BBB; 118 | } 119 | 120 | @media(max-width:1280px){ 121 | .container{ 122 | width: 100%; 123 | } 124 | } 125 | 126 | @media(max-width:768px){ 127 | #header{ 128 | padding: 20px; 129 | gap: 10px; 130 | flex-direction: column; 131 | align-items: center; 132 | text-align: center; 133 | } 134 | } 135 | -------------------------------------------------------------------------------- /ARITRA/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Sticky Notes 10 | 11 | 12 | 13 | 19 | 20 |
21 | 22 |
23 |
24 | 28 |
29 |
30 | 31 |
32 |
33 |
34 |
35 |
36 | 37 |
38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /ARITRA/index.js: -------------------------------------------------------------------------------- 1 | var random_margin = ["-5px", "1px", "5px", "10px", "7px"]; 2 | var random_colors = ["#c2ff3d","#ff3de8","#3dc2ff","#04e022","#bc83e6","#ebb328"]; 3 | var random_degree = ["rotate(3deg)", "rotate(1deg)", "rotate(-1deg)", "rotate(-3deg)", "rotate(-5deg)", "rotate(-8deg)"]; 4 | var index = 0; 5 | 6 | window.onload = document.querySelector("#user_input").select(); 7 | 8 | document.querySelector("#add_note").addEventListener("click", () => { 9 | document.querySelector("#modal").style.display = "block"; 10 | }); 11 | 12 | document.querySelector("#hide").addEventListener("click", () => { 13 | document.querySelector("#modal").style.display = "none"; 14 | }); 15 | 16 | document.querySelector("#user_input").addEventListener('keydown', (event) => { 17 | if(event.key === 'Enter'){ 18 | const text = document.querySelector("#user_input"); 19 | createStickyNote(text.value); 20 | } 21 | }); 22 | 23 | createStickyNote = (text) => { 24 | let note = document.createElement("div"); 25 | let details = document.createElement("div"); 26 | let noteText = document.createElement("h1"); 27 | 28 | note.className = "note"; 29 | details.className = "details"; 30 | noteText.textContent = text; 31 | 32 | details.appendChild(noteText); 33 | note.appendChild(details); 34 | 35 | if(index > random_colors.length - 1) 36 | index = 0; 37 | 38 | note.setAttribute("style", `margin:${random_margin[Math.floor(Math.random() * random_margin.length)]}; background-color:${random_colors[index++]}; transform:${random_degree[Math.floor(Math.random() * random_degree.length)]}`); 39 | 40 | note.addEventListener("dblclick", () => { 41 | note.remove(); 42 | }) 43 | 44 | document.querySelector("#all_notes").appendChild(note); 45 | } 46 | 47 | -------------------------------------------------------------------------------- /Avik/flipkartCloning.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Cormorant+SC:wght@300&family=Lato:ital,wght@0,300;0,400;1,100;1,300&display=swap'); 2 | @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@1,300&display=swap'); 3 | 4 | :root { 5 | --main-bg-color: #2874f0; 6 | } 7 | 8 | * { 9 | margin: 0; 10 | padding: 0; 11 | } 12 | 13 | header { 14 | height: 58px; 15 | background: var(--main-bg-color); 16 | font-family: 'Cormorant SC', serif; 17 | font-family: 'Lato', sans-serif; 18 | } 19 | nav{ 20 | display: flex; 21 | 22 | } 23 | .logo{ 24 | display: flex; 25 | align-items: center; 26 | } 27 | .logo img{ 28 | width: 88px; 29 | padding: 0 25px; 30 | } 31 | .search{ 32 | display: flex; 33 | align-items: center; 34 | 35 | } 36 | .search input{ 37 | width: 30vw; 38 | height: 27px; 39 | border-radius: 2px; 40 | margin: 0 16px 0 56px; 41 | padding: 0 12px; 42 | } 43 | .search button{ 44 | font-family: 'Cormorant SC', serif; 45 | font-family: 'Lato', sans-serif; 46 | font-weight: 900; 47 | } 48 | .slider{ 49 | margin:12px auto; 50 | width: 60vw; 51 | overflow: hidden; 52 | } 53 | .card .card-items img{ 54 | height: 166px; 55 | /* width: 166px; */ 56 | } 57 | .card{ 58 | max-width: 91vw; 59 | margin: 37px auto; 60 | } 61 | 62 | .my-2{ 63 | margin: 26px 0; 64 | } 65 | /* .card .card-items{ 66 | display: flex; 67 | padding: 0 16px; 68 | } */ 69 | .card h2{ 70 | font-family: 'Roboto', sans-serif; 71 | margin: 26px 0; 72 | } 73 | .cards{ 74 | display: flex; 75 | flex-direction: row; 76 | overflow: hidden; 77 | } 78 | 79 | .card-items{ 80 | display: inline-flex; 81 | justify-content:center; 82 | flex-direction: column; 83 | margin: 0 15px; 84 | } 85 | .card .lines p{ 86 | padding: 2px 40px; 87 | } 88 | 89 | .container{ 90 | min-height: calc(100vh - 58px - 12vh); 91 | } 92 | nav ul { 93 | height: 58px; 94 | display: flex; 95 | justify-content: flex-start; 96 | align-items: center; 97 | } 98 | 99 | nav ul li { 100 | padding: 0 23px; 101 | list-style: none; 102 | 103 | } 104 | 105 | nav ul li a { 106 | color: white; 107 | text-decoration: none; 108 | } 109 | nav ul li a:hover { 110 | font-weight: bolder; 111 | } 112 | 113 | footer { 114 | height: 12vh; 115 | background-color: var(--main-bg-color); 116 | color: white; 117 | font-family: 'Cormorant SC', serif; 118 | font-family: 'Lato', sans-serif; 119 | } 120 | -------------------------------------------------------------------------------- /BISHAL SEN/HOTELS.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | WORLD'S BEST LUXORIOUS HOTELS 5 | 6 | 7 |

WORLD'S BEST LUXORIOUS HOTELS

8 |

9 |

$ welcome to our website. WANT TO VISIT best hotels? join us.$

10 |

There are top many resturants in the world.But among them four are CINEPAX,GRAND,ROYALTON and SILK HOTEL.



11 | #1 12 | cinepax hotel

13 | #2 14 | grand hotel

15 | #3 16 | royalton hotel

17 | #4 18 | silk hotel

19 |

HI!!click on the hotels where you want to go.THANKS.....

20 | 21 | 22 | -------------------------------------------------------------------------------- /BISHAL/BISHAL.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BISHAL.com 8 | 9 | 10 |

ALL ABOUT AN APPLE

11 |

HELLO I AM BISHAL

12 |

GO TO THE CHANEL

13 |

LET'S GO

14 |
HEADING
15 |

An apple is an edible fruit produced by an apple tree (Malus domestica).
Apple trees are cultivated worldwide and are the most widely grown species in the genus Malus. The tree originated in Central Asia, where its wild ancestor, Malus sieversii, is still found today. Apples have been grown for thousands of years in Asia and Europe and were brought to North America by European colonists. Apples have religious and mythological significance in many cultures, including Norse, Greek, and European Christian tradition. 16 | 17 | Apples grown from seed tend to be very different from those of their parents, and the resultant fruit frequently lacks desired characteristics. Generally, apple cultivars are propagated by clonal grafting onto rootstocks. Apple trees grown without rootstocks tend to be larger and much slower to fruit after planting. Rootstocks are used to control the speed of growth and the size of the resulting tree, allowing for easier harvesting. 18 | 19 | There are more than 7,500 known cultivars of apples. Different cultivars are bred for various tastes and uses, including cooking, eating raw, and cider production. Trees and fruit are prone to a number of fungal, bacterial, and pest problems, which can be controlled by a number of organic and non-organic means. In 2010, the fruit's genome was sequenced as part of research on disease control and selective breeding in apple production.

20 | "MORE ABOUT APPLE" 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /DisneyHotstarClone/images/add.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/add.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/disney.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/disney.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/favicon.ico -------------------------------------------------------------------------------- /DisneyHotstarClone/images/geographic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/geographic.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/logo.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/marvel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/marvel.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/nxt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/nxt.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/pixar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/pixar.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/play.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/play.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 1.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 10.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 11.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 12.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 2.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 3.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 4.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 5.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 6.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 7.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 8.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/poster 9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/poster 9.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/pre.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/pre.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/slider1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/slider1.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/slider2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/slider2.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/slider3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/slider3.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/slider4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/slider4.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/slider5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/slider5.png -------------------------------------------------------------------------------- /DisneyHotstarClone/images/star-wars.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/images/star-wars.png -------------------------------------------------------------------------------- /DisneyHotstarClone/index.js: -------------------------------------------------------------------------------- 1 | let movies = [ 2 | { 3 | name: "falcon and the winter soldier", 4 | genre:"Marvel · Superhero · Action · Science Fiction", 5 | des: 6 | "Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit porro et veniam excepturi, eaque voluptatem impedit nulla laboriosam facilis ut laboriosam libero!", 7 | image: "images/slider2.png" 8 | }, 9 | { 10 | name: "loki", 11 | genre:"Marvel · Superhero · Action ", 12 | des: 13 | "Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit porro et veniam excepturi, eaque voluptatem impedit nulla laboriosam facilis ut laboriosam libero!", 14 | image: "images/slider1.png" 15 | }, 16 | { 17 | name: "wanda vision", 18 | genre:"Marvel · English · Superhero · Action · Science Fiction", 19 | des: 20 | "Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit porro et veniam excepturi, eaque voluptatem impedit nulla laboriosam facilis ut laboriosam libero!", 21 | image: "images/slider3.png" 22 | }, 23 | { 24 | name: "raya and the last dragon", 25 | genre:"Animation · Fantasy · Adventure · Kids", 26 | des: 27 | "Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit porro et veniam excepturi, eaque voluptatem impedit nulla laboriosam facilis ut laboriosam libero!", 28 | image: "images/slider4.png" 29 | }, 30 | { 31 | name: "luca", 32 | genre:"Animation · Fantasy · Adventure · Kids", 33 | des: 34 | "Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit porro et veniam excepturi, eaque voluptatem impedit nulla laboriosam facilis ut laboriosam libero!", 35 | image: "images/slider5.png" 36 | } 37 | ]; 38 | 39 | const carousel = document.querySelector(".carousel"); 40 | let sliders = []; 41 | 42 | let slideIndex = 0; // to track current slide index. 43 | 44 | const createSlide = () => { 45 | if (slideIndex >= movies.length) { 46 | slideIndex = 0; 47 | } 48 | 49 | // creating DOM element 50 | let slide = document.createElement("div"); 51 | var imgElement = document.createElement("img"); 52 | let content = document.createElement("div"); 53 | let h1 = document.createElement("h1"); 54 | let genre = document.createElement("p"); 55 | let p = document.createElement("p"); 56 | 57 | // attaching all elements 58 | imgElement.appendChild(document.createTextNode("")); 59 | h1.appendChild(document.createTextNode(movies[slideIndex].name)); 60 | p.appendChild(document.createTextNode(movies[slideIndex].des)); 61 | genre.appendChild(document.createTextNode(movies[slideIndex].genre)); 62 | content.appendChild(h1); 63 | content.appendChild(genre); 64 | content.appendChild(p); 65 | slide.appendChild(content); 66 | slide.appendChild(imgElement); 67 | carousel.appendChild(slide); 68 | 69 | // setting up image 70 | imgElement.src = movies[slideIndex].image; 71 | slideIndex++; 72 | 73 | // setting elements classname 74 | slide.className = "slider"; 75 | content.className = "slide-content"; 76 | h1.className = "movie-title"; 77 | genre.className = "movie-gen" 78 | p.className = "movie-des"; 79 | 80 | sliders.push(slide); 81 | 82 | if (sliders.length) { 83 | sliders[0].style.marginLeft = `calc(-${100 * (sliders.length - 2)}% - ${ 84 | 30 * (sliders.length - 2) 85 | }px)`; 86 | } 87 | }; 88 | 89 | for (let i = 0; i < 3; i++) { 90 | createSlide(); 91 | } 92 | 93 | setInterval(() => { 94 | createSlide(); 95 | }, 3000); 96 | 97 | //Video Cards 98 | 99 | const videoCards = [...document.querySelectorAll(".video-card")]; 100 | 101 | videoCards.forEach((item) => { 102 | item.addEventListener("mouseover", () => { 103 | let video = item.children[1]; 104 | video.play(); 105 | }); 106 | item.addEventListener("mouseleave", () => { 107 | let video = item.children[1]; 108 | video.pause(); 109 | }); 110 | }); 111 | 112 | //card sliders 113 | 114 | let cardContainers = [...document.querySelectorAll(".card-container")]; 115 | let preBtns = [...document.querySelectorAll(".pre-btn")]; 116 | let nxtBtns = [...document.querySelectorAll(".nxt-btn")]; 117 | 118 | cardContainers.forEach((item, i) => { 119 | let containerDimensions = item.getBoundingClientRect(); 120 | let containerWidth = containerDimensions.width; 121 | 122 | nxtBtns[i].addEventListener("click", () => { 123 | item.scrollLeft += containerWidth - 200; 124 | }); 125 | 126 | preBtns[i].addEventListener("click", () => { 127 | item.scrollLeft -= containerWidth + 200; 128 | }); 129 | }); 130 | -------------------------------------------------------------------------------- /DisneyHotstarClone/videos/disney.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/videos/disney.mp4 -------------------------------------------------------------------------------- /DisneyHotstarClone/videos/geographic.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/videos/geographic.mp4 -------------------------------------------------------------------------------- /DisneyHotstarClone/videos/marvel.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/videos/marvel.mp4 -------------------------------------------------------------------------------- /DisneyHotstarClone/videos/pixar.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/videos/pixar.mp4 -------------------------------------------------------------------------------- /DisneyHotstarClone/videos/star-war.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/DisneyHotstarClone/videos/star-war.mp4 -------------------------------------------------------------------------------- /Jyotirmoy_SimpleCalculator/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Document 9 | 10 | 11 |
12 | 13 |
14 | 15 |
16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 |
38 |
39 | 40 | 41 | -------------------------------------------------------------------------------- /Jyotirmoy_SimpleCalculator/script.js: -------------------------------------------------------------------------------- 1 | let k='sdf'; 2 | let r = k.slice(0,-1); 3 | console.log(r); 4 | 5 | //intialise 6 | let num=''; 7 | let n; 8 | let ans=0; 9 | let optn; 10 | let num1,num2; 11 | const buttons = document.querySelectorAll('.num'); 12 | const input = document.querySelector('.input'); 13 | const subInput = document.querySelector('.sub-input') 14 | const equal = document.querySelector('.equal'); 15 | const opn = document.querySelectorAll(".operation"); 16 | const delBtn = document.querySelector(".del"); 17 | const clrBtn = document.querySelector('.clr'); 18 | 19 | //operations 20 | const add = function(a,b){ 21 | input.value=a+b; 22 | } 23 | 24 | const sub = function(a,b){ 25 | input.value= a-b; 26 | } 27 | 28 | const mul = function(a,b){ 29 | input.value=a*b; 30 | } 31 | 32 | const div = function(a,b){ 33 | input.value=a/b; 34 | } 35 | 36 | const per = function(a,b){ 37 | input.value=(a/100)*b; 38 | } 39 | 40 | const del = function(){ 41 | console.log(input.value); 42 | n=input.value 43 | console.log(n); 44 | console.log(n.slice(0,-1)) 45 | input.value=n.slice(0,-1); 46 | } 47 | 48 | const clr = function(){ 49 | input.value=''; 50 | subInput.value=''; 51 | } 52 | 53 | 54 | //Data entry 55 | buttons.forEach(ele => ele.addEventListener('click',function(){ 56 | num = input.value + ele.value; 57 | input.value=num; 58 | })); 59 | 60 | 61 | //operations execution 62 | opn.forEach(el => el.addEventListener('click',function(){ 63 | opn.forEach(ela => ela.classList.remove('btn-active')); 64 | optn=el.value; 65 | el.classList.add('btn-active'); 66 | console.log(input.value); 67 | num1=Number(input.value); 68 | subInput.value=input.value; 69 | input.value=''; 70 | console.log(optn); 71 | })); 72 | 73 | 74 | //del clr 75 | delBtn.addEventListener('click',function(){ 76 | del(); 77 | }) 78 | 79 | clrBtn.addEventListener('click',function(){ 80 | clr(); 81 | }) 82 | 83 | 84 | //result 85 | equal.addEventListener("click",function(){ 86 | num2=Number(input.value); 87 | console.log(input.value); 88 | console.log(optn); 89 | opn.forEach(ela => ela.classList.remove('btn-active')); 90 | if(optn=='+'){ 91 | console.log("asdf"); 92 | add(num1,num2); 93 | } 94 | else if(optn=='-'){ 95 | sub(num1,num2); 96 | } 97 | else if(optn=='*'){ 98 | mul(num1,num2); 99 | } 100 | else if(optn=='/'){ 101 | div(num1,num2); 102 | } 103 | else if(optn=='%'){ 104 | 105 | console.log("asdf"); 106 | per(num1,num2); 107 | } 108 | subInput.value =subInput.value + optn + num2; 109 | }); 110 | 111 | -------------------------------------------------------------------------------- /Jyotirmoy_SimpleCalculator/style.css: -------------------------------------------------------------------------------- 1 | body{ 2 | position: relative; 3 | background-color: darkslategrey; 4 | } 5 | 6 | .calculator{ 7 | display: flex; 8 | flex-direction: column; 9 | gap: 20px; 10 | position: absolute; 11 | top: 100px; 12 | left: 50%; 13 | transform: translate(-50%,0); 14 | justify-content: center; 15 | align-items: center; 16 | padding: 12px; 17 | border: 2px solid rgba(3, 3, 3, 0.674); 18 | border-radius: 10px; 19 | box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.306); 20 | } 21 | 22 | .btns{ 23 | display: grid; 24 | grid-template-rows: 50px 50px 50px 50px 50px; 25 | grid-template-columns: 50px 50px 50px 50px; 26 | justify-items: center; 27 | align-items: center; 28 | } 29 | 30 | .btn{ 31 | height: 50px; 32 | width: 50px; 33 | border-radius: 50%; 34 | border: none; 35 | box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.306); 36 | } 37 | 38 | .btn-active{ 39 | transform: scale(1.05); 40 | background-color: green; 41 | } 42 | 43 | 44 | .input{ 45 | width: 200px; 46 | height: 40px; 47 | text-align: right; 48 | } 49 | 50 | .sub-input{ 51 | background-color: bisque; 52 | height: 20px; 53 | width: 200px; 54 | } 55 | 56 | .equal{ 57 | border-radius: 20px; 58 | width: 90px; 59 | grid-column: 3 / 5; 60 | } 61 | -------------------------------------------------------------------------------- /MyClubPage/pics/0c33d3ec-30b8-4ac5-9b69-bb311b994a9f.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/0c33d3ec-30b8-4ac5-9b69-bb311b994a9f.png -------------------------------------------------------------------------------- /MyClubPage/pics/48227582-a866-41ea-a0a2-56b3f9957ac5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/48227582-a866-41ea-a0a2-56b3f9957ac5.png -------------------------------------------------------------------------------- /MyClubPage/pics/54617dcd-e054-4da2-a4f9-a7cdf79d71d5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/54617dcd-e054-4da2-a4f9-a7cdf79d71d5.png -------------------------------------------------------------------------------- /MyClubPage/pics/829b9576-69dd-43c7-aa30-5b1e31421723.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/829b9576-69dd-43c7-aa30-5b1e31421723.png -------------------------------------------------------------------------------- /MyClubPage/pics/b5d8a417-92d3-4e5b-9e73-a44b423cb9b2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/b5d8a417-92d3-4e5b-9e73-a44b423cb9b2.png -------------------------------------------------------------------------------- /MyClubPage/pics/bee.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/bee.png -------------------------------------------------------------------------------- /MyClubPage/pics/block-courses.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/block-courses.png -------------------------------------------------------------------------------- /MyClubPage/pics/c77e8af9-82c7-49ad-b05f-745e693f643a.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/c77e8af9-82c7-49ad-b05f-745e693f643a.png -------------------------------------------------------------------------------- /MyClubPage/pics/facebook2x-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/facebook2x-1.png -------------------------------------------------------------------------------- /MyClubPage/pics/facebook2x-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/facebook2x-2.png -------------------------------------------------------------------------------- /MyClubPage/pics/facebook2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/facebook2x.png -------------------------------------------------------------------------------- /MyClubPage/pics/instagram2x-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/instagram2x-1.png -------------------------------------------------------------------------------- /MyClubPage/pics/instagram2x-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/instagram2x-2.png -------------------------------------------------------------------------------- /MyClubPage/pics/instagram2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/instagram2x.png -------------------------------------------------------------------------------- /MyClubPage/pics/instructor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/instructor.png -------------------------------------------------------------------------------- /MyClubPage/pics/linkedin2x-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/linkedin2x-1.png -------------------------------------------------------------------------------- /MyClubPage/pics/linkedin2x-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/linkedin2x-2.png -------------------------------------------------------------------------------- /MyClubPage/pics/linkedin2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/linkedin2x.png -------------------------------------------------------------------------------- /MyClubPage/pics/model-black-courses.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/model-black-courses.png -------------------------------------------------------------------------------- /MyClubPage/pics/owners_2-42.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/owners_2-42.png -------------------------------------------------------------------------------- /MyClubPage/pics/pexels-karolina-grabowska-4491461.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/pexels-karolina-grabowska-4491461.jpg -------------------------------------------------------------------------------- /MyClubPage/pics/pexels-katerina-holmes-5905709.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/pexels-katerina-holmes-5905709.jpg -------------------------------------------------------------------------------- /MyClubPage/pics/pexels-monstera-6238120.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/pexels-monstera-6238120.jpg -------------------------------------------------------------------------------- /MyClubPage/pics/play-video.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/play-video.png -------------------------------------------------------------------------------- /MyClubPage/pics/review-stars.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/review-stars.png -------------------------------------------------------------------------------- /MyClubPage/pics/testimonio-46.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/testimonio-46.png -------------------------------------------------------------------------------- /MyClubPage/pics/testimonio_2-46__1_.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/testimonio_2-46__1_.png -------------------------------------------------------------------------------- /MyClubPage/pics/twitter2x-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/twitter2x-1.png -------------------------------------------------------------------------------- /MyClubPage/pics/twitter2x-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/twitter2x-2.png -------------------------------------------------------------------------------- /MyClubPage/pics/twitter2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/twitter2x.png -------------------------------------------------------------------------------- /MyClubPage/pics/youtube2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/MyClubPage/pics/youtube2x.png -------------------------------------------------------------------------------- /Nishtha/undraw_Male_avatar_re_hguk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Nishtha/undraw_Male_avatar_re_hguk.png -------------------------------------------------------------------------------- /Palak/analog clock: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Clock 8 | 9 | 10 | 11 |

Clock Using Pure JS

12 |
13 |
14 |
15 |
16 |
17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /Prasun/images/DIVIDER01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/DIVIDER01.png -------------------------------------------------------------------------------- /Prasun/images/DIVIDER02.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/DIVIDER02.png -------------------------------------------------------------------------------- /Prasun/images/PIZZA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/PIZZA.png -------------------------------------------------------------------------------- /Prasun/images/facebook2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/facebook2x.png -------------------------------------------------------------------------------- /Prasun/images/instagram2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/instagram2x.png -------------------------------------------------------------------------------- /Prasun/images/linkedin2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/linkedin2x.png -------------------------------------------------------------------------------- /Prasun/images/logo-pizza.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/logo-pizza.png -------------------------------------------------------------------------------- /Prasun/images/order1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/order1.png -------------------------------------------------------------------------------- /Prasun/images/order2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/order2.png -------------------------------------------------------------------------------- /Prasun/images/pizza-01-11.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/pizza-01-11.png -------------------------------------------------------------------------------- /Prasun/images/pizza-01-12.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/pizza-01-12.png -------------------------------------------------------------------------------- /Prasun/images/pizza-01-13.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/pizza-01-13.png -------------------------------------------------------------------------------- /Prasun/images/pizza-04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/pizza-04.png -------------------------------------------------------------------------------- /Prasun/images/share1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/share1.png -------------------------------------------------------------------------------- /Prasun/images/twitter2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Prasun/images/twitter2x.png -------------------------------------------------------------------------------- /Priyadarshan/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/.DS_Store -------------------------------------------------------------------------------- /Priyadarshan/README.md: -------------------------------------------------------------------------------- 1 | # DisneyPlus Clone 2 | 3 | ### Home Page 4 | ![image](https://user-images.githubusercontent.com/62868878/115612683-28d4cd00-a309-11eb-9aba-7557f1ec7f0f.png) 5 | 6 | ### Logging Page 7 | ![image](https://user-images.githubusercontent.com/62868878/115612834-51f55d80-a309-11eb-8e7e-e2f90639eaac.png) 8 | 9 | ### Main Page 10 | ![image](https://user-images.githubusercontent.com/62868878/115612933-705b5900-a309-11eb-92c5-eb690bd22f3f.png) 11 | 12 | ### Dyanamic Catagories 13 | ![image](https://user-images.githubusercontent.com/62868878/115613481-0f805080-a30a-11eb-9428-101e5c5d0431.png) 14 | 15 | 16 | ### Recommended Videos 17 | ![image](https://user-images.githubusercontent.com/62868878/115613008-849f5600-a309-11eb-8c5a-454a8e523d8a.png) 18 | 19 | ### video Playing Page 20 | ![image](https://user-images.githubusercontent.com/62868878/115613125-a7316f00-a309-11eb-894d-f17a017902cd.png) 21 | 22 | ***Developed By.. Priyadarshan Ghosh*** 23 | ***Thank you*** 24 | -------------------------------------------------------------------------------- /Priyadarshan/firebase.json: -------------------------------------------------------------------------------- 1 | { 2 | "hosting": { 3 | "public": "build", 4 | "ignore": [ 5 | "firebase.json", 6 | "**/.*", 7 | "**/node_modules/**" 8 | ], 9 | "rewrites": [ 10 | { 11 | "source": "**", 12 | "destination": "/index.html" 13 | } 14 | ] 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /Priyadarshan/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "youtube-disney-clone", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@reduxjs/toolkit": "^1.5.1", 7 | "@testing-library/jest-dom": "^5.11.4", 8 | "@testing-library/react": "^11.1.0", 9 | "@testing-library/user-event": "^12.1.10", 10 | "firebase": "^8.4.1", 11 | "firebase-tools": "^9.9.0", 12 | "react": "^17.0.2", 13 | "react-dom": "^17.0.2", 14 | "react-redux": "^7.2.3", 15 | "react-router-dom": "^5.2.0", 16 | "react-scripts": "4.0.3", 17 | "react-slick": "^0.28.1", 18 | "slick-carousel": "^1.8.1", 19 | "styled-components": "^5.2.3", 20 | "web-vitals": "^1.0.1" 21 | }, 22 | "scripts": { 23 | "start": "react-scripts start", 24 | "build": "react-scripts build", 25 | "test": "react-scripts test", 26 | "eject": "react-scripts eject" 27 | }, 28 | "eslintConfig": { 29 | "extends": [ 30 | "react-app", 31 | "react-app/jest" 32 | ] 33 | }, 34 | "browserslist": { 35 | "production": [ 36 | ">0.2%", 37 | "not dead", 38 | "not op_mini all" 39 | ], 40 | "development": [ 41 | "last 1 chrome version", 42 | "last 1 firefox version", 43 | "last 1 safari version" 44 | ] 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /Priyadarshan/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/favicon.ico -------------------------------------------------------------------------------- /Priyadarshan/public/images/cta-logo-one.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/cta-logo-one.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/cta-logo-two.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/cta-logo-two.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/group-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/group-icon.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/home-background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/home-background.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/home-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/images/login-background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/login-background.jpg -------------------------------------------------------------------------------- /Priyadarshan/public/images/movie-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/images/original-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/images/play-icon-black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/play-icon-black.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/play-icon-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/play-icon-white.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/search-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/images/series-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/images/slider-badag.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/slider-badag.jpg -------------------------------------------------------------------------------- /Priyadarshan/public/images/slider-badging.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/slider-badging.jpg -------------------------------------------------------------------------------- /Priyadarshan/public/images/slider-scale.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/slider-scale.jpg -------------------------------------------------------------------------------- /Priyadarshan/public/images/slider-scales.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/slider-scales.jpg -------------------------------------------------------------------------------- /Priyadarshan/public/images/viewers-disney.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/viewers-disney.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/viewers-marvel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/viewers-marvel.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/viewers-national.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/viewers-national.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/viewers-pixar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/viewers-pixar.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/viewers-starwars.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/images/viewers-starwars.png -------------------------------------------------------------------------------- /Priyadarshan/public/images/watchlist-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Priyadarshan/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | React App 28 | 29 | 30 | 31 |
32 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /Priyadarshan/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/logo192.png -------------------------------------------------------------------------------- /Priyadarshan/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/logo512.png -------------------------------------------------------------------------------- /Priyadarshan/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /Priyadarshan/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /Priyadarshan/public/videos/1564674844-disney.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/videos/1564674844-disney.mp4 -------------------------------------------------------------------------------- /Priyadarshan/public/videos/1564676115-marvel.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/videos/1564676115-marvel.mp4 -------------------------------------------------------------------------------- /Priyadarshan/public/videos/1564676296-national-geographic.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/videos/1564676296-national-geographic.mp4 -------------------------------------------------------------------------------- /Priyadarshan/public/videos/1564676714-pixar.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/videos/1564676714-pixar.mp4 -------------------------------------------------------------------------------- /Priyadarshan/public/videos/1608229455-star-wars.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/public/videos/1608229455-star-wars.mp4 -------------------------------------------------------------------------------- /Priyadarshan/src/App.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Priyadarshan/src/App.css -------------------------------------------------------------------------------- /Priyadarshan/src/App.js: -------------------------------------------------------------------------------- 1 | import { BrowserRouter as Router, Switch, Route } from "react-router-dom"; 2 | import Login from "./components/Login"; 3 | import Header from "./components/Header"; 4 | import "./App.css"; 5 | import Home from "./components/Home"; 6 | import Detail from "./components/Detail"; 7 | 8 | function App() { 9 | return ( 10 |
11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | ); 27 | } 28 | 29 | export default App; 30 | -------------------------------------------------------------------------------- /Priyadarshan/src/app/store.js: -------------------------------------------------------------------------------- 1 | import { configureStore, getDefaultMiddleware } from "@reduxjs/toolkit"; 2 | import userReducer from "../features/user/userSlice"; 3 | import movieReducer from "../features/movie/movieSlice"; 4 | 5 | export default configureStore({ 6 | reducer: { 7 | user: userReducer, 8 | movie: movieReducer, 9 | }, 10 | middleware: getDefaultMiddleware({ 11 | serializableCheck: false, 12 | }), 13 | }); 14 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Home.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import ImgSlider from "./ImgSlider"; 3 | import NewDisney from "./NewDisney"; 4 | import Originals from "./Originals"; 5 | import Recommends from "./Recommends"; 6 | import Trending from "./Trending"; 7 | import Viewers from "./Viewers"; 8 | import { useEffect } from "react"; 9 | import { useDispatch, useSelector } from "react-redux"; 10 | import db from "../firebase"; 11 | import { setMovies } from "../features/movie/movieSlice"; 12 | import { selectUserName } from "../features/user/userSlice"; 13 | 14 | const Home = (props) => { 15 | const dispatch = useDispatch(); 16 | const userName = useSelector(selectUserName); 17 | let recommends = []; 18 | let newDisneys = []; 19 | let originals = []; 20 | let trending = []; 21 | 22 | useEffect(() => { 23 | console.log("hello"); 24 | db.collection("movies").onSnapshot((snapshot) => { 25 | snapshot.docs.map((doc) => { 26 | console.log(recommends); 27 | switch (doc.data().type) { 28 | case "recommend": 29 | recommends = [...recommends, { id: doc.id, ...doc.data() }]; 30 | break; 31 | 32 | case "new": 33 | newDisneys = [...newDisneys, { id: doc.id, ...doc.data() }]; 34 | break; 35 | 36 | case "original": 37 | originals = [...originals, { id: doc.id, ...doc.data() }]; 38 | break; 39 | 40 | case "trending": 41 | trending = [...trending, { id: doc.id, ...doc.data() }]; 42 | break; 43 | } 44 | }); 45 | 46 | dispatch( 47 | setMovies({ 48 | recommend: recommends, 49 | newDisney: newDisneys, 50 | original: originals, 51 | trending: trending, 52 | }) 53 | ); 54 | }); 55 | }, [userName]); 56 | 57 | return ( 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | ); 67 | }; 68 | 69 | const Container = styled.main` 70 | position: relative; 71 | min-height: calc(100vh - 250px); 72 | overflow-x: hidden; 73 | display: block; 74 | top: 72px; 75 | padding: 0 calc(3.5vw + 5px); 76 | 77 | &:after { 78 | background: url("/images/home-background.png") center center / cover 79 | no-repeat fixed; 80 | content: ""; 81 | position: absolute; 82 | inset: 0px; 83 | opacity: 1; 84 | z-index: -1; 85 | } 86 | `; 87 | 88 | export default Home; 89 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/ImgSlider.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import "slick-carousel/slick/slick.css"; 3 | import "slick-carousel/slick/slick-theme.css"; 4 | import Slider from "react-slick"; 5 | 6 | const ImgSlider = (props) => { 7 | let settings = { 8 | dots: true, 9 | infinite: true, 10 | speed: 500, 11 | slidesToShow: 1, 12 | slidesToScroll: 1, 13 | autoplay: true, 14 | }; 15 | return ( 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | ); 42 | }; 43 | 44 | const Carousel = styled(Slider)` 45 | margin-top: 20px; 46 | 47 | & > button { 48 | opacity: 0; 49 | height: 100%; 50 | width: 5vw; 51 | z-index: 1; 52 | 53 | &:hover { 54 | opacity: 1; 55 | transition: opacity 0.2s ease 0s; 56 | } 57 | } 58 | 59 | ul li button { 60 | &:before { 61 | font-size: 10px; 62 | color: rgb(150, 158, 171); 63 | } 64 | } 65 | 66 | li.slick-active button:before { 67 | color: white; 68 | } 69 | 70 | .slick-list { 71 | overflow: initial; 72 | } 73 | 74 | .slick-prev { 75 | left: -75px; 76 | } 77 | 78 | .slick-next { 79 | right: -75px; 80 | } 81 | `; 82 | 83 | const Wrap = styled.div` 84 | border-radius: 4px; 85 | cursor: pointer; 86 | position: relative; 87 | 88 | a { 89 | border-radius: 4px; 90 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 91 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 92 | cursor: pointer; 93 | display: block; 94 | position: relative; 95 | padding: 4px; 96 | 97 | img { 98 | width: 100%; 99 | height: 100%; 100 | } 101 | 102 | &:hover { 103 | padding: 0; 104 | border: 4px solid rgba(249, 249, 249, 0.8); 105 | transition-duration: 300ms; 106 | } 107 | } 108 | `; 109 | 110 | export default ImgSlider; 111 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Login.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | 3 | const Login = (props) => { 4 | return ( 5 | 6 | 7 | 8 | 9 | GET ALL THERE 10 | 11 | Get Premier Access to Raya and the Last Dragon for an additional fee 12 | with a Disney+ subscription. As of 03/26/21, the price of Disney+ 13 | and The Disney Bundle will increase by $1. 14 | 15 | 16 | 17 | 18 | 19 | 20 | ); 21 | }; 22 | 23 | const Container = styled.section` 24 | overflow: hidden; 25 | display: flex; 26 | flex-direction: column; 27 | text-align: center; 28 | height: 100vh; 29 | `; 30 | 31 | const Content = styled.div` 32 | margin-bottom: 10vw; 33 | width: 100%; 34 | position: relative; 35 | min-height: 100vh; 36 | box-sizing: border-box; 37 | display: flex; 38 | justify-content: center; 39 | align-items: center; 40 | flex-direction: column; 41 | padding: 80px 40px; 42 | height: 100%; 43 | `; 44 | 45 | const BgImage = styled.div` 46 | height: 100%; 47 | background-position: top; 48 | background-size: cover; 49 | background-repeat: no-repeat; 50 | background-image: url("/images/login-background.jpg"); 51 | position: absolute; 52 | top: 0; 53 | right: 0; 54 | left: 0; 55 | z-index: -1; 56 | `; 57 | 58 | const CTA = styled.div` 59 | max-width: 650px; 60 | width: 100%; 61 | display: flex; 62 | flex-direction: column; 63 | `; 64 | 65 | const CTALogoOne = styled.img` 66 | margin-bottom: 12px; 67 | max-width: 600px; 68 | min-height: 1px; 69 | display: block; 70 | width: 100%; 71 | `; 72 | 73 | const SignUp = styled.a` 74 | font-weight: bold; 75 | color: #f9f9f9; 76 | background-color: #0063e5; 77 | margin-bottom: 12px; 78 | width: 100%; 79 | letter-spacing: 1.5px; 80 | font-size: 18px; 81 | padding: 16.5px 0; 82 | border: 1px solid transparent; 83 | border-radius: 4px; 84 | 85 | &:hover { 86 | background-color: #0483ee; 87 | } 88 | `; 89 | 90 | const Description = styled.p` 91 | color: hsla(0, 0%, 95.3%, 1); 92 | font-size: 11px; 93 | margin: 0 0 24px; 94 | line-height: 1.5; 95 | letter-spacing: 1.5px; 96 | `; 97 | 98 | const CTALogoTwo = styled.img` 99 | max-width: 600px; 100 | margin-bottom: 20px; 101 | display: inline-block; 102 | vertical-align: bottom; 103 | width: 100%; 104 | `; 105 | 106 | export default Login; 107 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/NewDisney.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import { Link } from "react-router-dom"; 3 | import { useSelector } from "react-redux"; 4 | import { selectNewDisney } from "../features/movie/movieSlice"; 5 | 6 | const NewDisney = (props) => { 7 | const movies = useSelector(selectNewDisney); 8 | 9 | return ( 10 | 11 |

New to Disney+

12 | 13 | {movies && 14 | movies.map((movie, key) => ( 15 | 16 | {movie.id} 17 | 18 | {movie.title} 19 | 20 | 21 | ))} 22 | 23 | 24 | ); 25 | }; 26 | 27 | const Container = styled.div` 28 | padding: 0 0 26px; 29 | `; 30 | 31 | const Content = styled.div` 32 | display: grid; 33 | grid-gap: 25px; 34 | gap: 25px; 35 | grid-template-columns: repeat(4, minmax(0, 1fr)); 36 | 37 | @media (max-width: 768px) { 38 | grid-template-columns: repeat(2, minmax(0, 1fr)); 39 | } 40 | `; 41 | 42 | const Wrap = styled.div` 43 | padding-top: 56.25%; 44 | border-radius: 10px; 45 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 46 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 47 | cursor: pointer; 48 | overflow: hidden; 49 | position: relative; 50 | transition: all 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; 51 | border: 3px solid rgba(249, 249, 249, 0.1); 52 | img { 53 | inset: 0px; 54 | display: block; 55 | height: 100%; 56 | object-fit: cover; 57 | opacity: 1; 58 | position: absolute; 59 | transition: opacity 500ms ease-in-out 0s; 60 | width: 100%; 61 | z-index: 1; 62 | top: 0; 63 | } 64 | &:hover { 65 | box-shadow: rgb(0 0 0 / 80%) 0px 40px 58px -16px, 66 | rgb(0 0 0 / 72%) 0px 30px 22px -10px; 67 | transform: scale(1.05); 68 | border-color: rgba(249, 249, 249, 0.8); 69 | } 70 | `; 71 | 72 | export default NewDisney; 73 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Originals.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import { Link } from "react-router-dom"; 3 | import { useSelector } from "react-redux"; 4 | import { selectOriginal } from "../features/movie/movieSlice"; 5 | 6 | const Originals = (props) => { 7 | const movies = useSelector(selectOriginal); 8 | 9 | return ( 10 | 11 |

Originals

12 | 13 | {movies && 14 | movies.map((movie, key) => ( 15 | 16 | {movie.id} 17 | 18 | {movie.title} 19 | 20 | 21 | ))} 22 | 23 | 24 | ); 25 | }; 26 | 27 | const Container = styled.div` 28 | padding: 0 0 26px; 29 | `; 30 | 31 | const Content = styled.div` 32 | display: grid; 33 | grid-gap: 25px; 34 | gap: 25px; 35 | grid-template-columns: repeat(4, minmax(0, 1fr)); 36 | 37 | @media (max-width: 768px) { 38 | grid-template-columns: repeat(2, minmax(0, 1fr)); 39 | } 40 | `; 41 | 42 | const Wrap = styled.div` 43 | padding-top: 56.25%; 44 | border-radius: 10px; 45 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 46 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 47 | cursor: pointer; 48 | overflow: hidden; 49 | position: relative; 50 | transition: all 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; 51 | border: 3px solid rgba(249, 249, 249, 0.1); 52 | img { 53 | inset: 0px; 54 | display: block; 55 | height: 100%; 56 | object-fit: cover; 57 | opacity: 1; 58 | position: absolute; 59 | transition: opacity 500ms ease-in-out 0s; 60 | width: 100%; 61 | z-index: 1; 62 | top: 0; 63 | } 64 | &:hover { 65 | box-shadow: rgb(0 0 0 / 80%) 0px 40px 58px -16px, 66 | rgb(0 0 0 / 72%) 0px 30px 22px -10px; 67 | transform: scale(1.05); 68 | border-color: rgba(249, 249, 249, 0.8); 69 | } 70 | `; 71 | 72 | export default Originals; 73 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Recommends.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import { Link } from "react-router-dom"; 3 | import { useSelector } from "react-redux"; 4 | import { selectRecommend } from "../features/movie/movieSlice"; 5 | 6 | const Recommends = (props) => { 7 | const movies = useSelector(selectRecommend); 8 | console.log(movies, ":🛢️"); 9 | 10 | return ( 11 | 12 |

Recommended for You

13 | 14 | {movies && 15 | movies.map((movie, key) => ( 16 | 17 | {movie.id} 18 | 19 | {movie.title} 20 | 21 | 22 | ))} 23 | 24 | 25 | ); 26 | }; 27 | 28 | const Container = styled.div` 29 | padding: 0 0 26px; 30 | `; 31 | 32 | const Content = styled.div` 33 | display: grid; 34 | grid-gap: 25px; 35 | gap: 25px; 36 | grid-template-columns: repeat(4, minmax(0, 1fr)); 37 | 38 | @media (max-width: 768px) { 39 | grid-template-columns: repeat(2, minmax(0, 1fr)); 40 | } 41 | `; 42 | 43 | const Wrap = styled.div` 44 | padding-top: 56.25%; 45 | border-radius: 10px; 46 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 47 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 48 | cursor: pointer; 49 | overflow: hidden; 50 | position: relative; 51 | transition: all 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; 52 | border: 3px solid rgba(249, 249, 249, 0.1); 53 | 54 | img { 55 | inset: 0px; 56 | display: block; 57 | height: 100%; 58 | object-fit: cover; 59 | opacity: 1; 60 | position: absolute; 61 | transition: opacity 500ms ease-in-out 0s; 62 | width: 100%; 63 | z-index: 1; 64 | top: 0; 65 | } 66 | 67 | &:hover { 68 | box-shadow: rgb(0 0 0 / 80%) 0px 40px 58px -16px, 69 | rgb(0 0 0 / 72%) 0px 30px 22px -10px; 70 | transform: scale(1.05); 71 | border-color: rgba(249, 249, 249, 0.8); 72 | } 73 | `; 74 | 75 | export default Recommends; 76 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Trending.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | import { Link } from "react-router-dom"; 3 | import { useSelector } from "react-redux"; 4 | import { selectTrending } from "../features/movie/movieSlice"; 5 | 6 | const Trending = (props) => { 7 | const movies = useSelector(selectTrending); 8 | 9 | return ( 10 | 11 |

Trending

12 | 13 | {movies && 14 | movies.map((movie, key) => ( 15 | 16 | {movie.id} 17 | 18 | {movie.title} 19 | 20 | 21 | ))} 22 | 23 | 24 | ); 25 | }; 26 | 27 | const Container = styled.div` 28 | padding: 0 0 26px; 29 | `; 30 | 31 | const Content = styled.div` 32 | display: grid; 33 | grid-gap: 25px; 34 | gap: 25px; 35 | grid-template-columns: repeat(4, minmax(0, 1fr)); 36 | 37 | @media (max-width: 768px) { 38 | grid-template-columns: repeat(2, minmax(0, 1fr)); 39 | } 40 | `; 41 | 42 | const Wrap = styled.div` 43 | padding-top: 56.25%; 44 | border-radius: 10px; 45 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 46 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 47 | cursor: pointer; 48 | overflow: hidden; 49 | position: relative; 50 | transition: all 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; 51 | border: 3px solid rgba(249, 249, 249, 0.1); 52 | img { 53 | inset: 0px; 54 | display: block; 55 | height: 100%; 56 | object-fit: cover; 57 | opacity: 1; 58 | position: absolute; 59 | transition: opacity 500ms ease-in-out 0s; 60 | width: 100%; 61 | z-index: 1; 62 | top: 0; 63 | } 64 | &:hover { 65 | box-shadow: rgb(0 0 0 / 80%) 0px 40px 58px -16px, 66 | rgb(0 0 0 / 72%) 0px 30px 22px -10px; 67 | transform: scale(1.05); 68 | border-color: rgba(249, 249, 249, 0.8); 69 | } 70 | `; 71 | 72 | export default Trending; 73 | -------------------------------------------------------------------------------- /Priyadarshan/src/components/Viewers.js: -------------------------------------------------------------------------------- 1 | import styled from "styled-components"; 2 | 3 | const Viewers = (props) => { 4 | return ( 5 | 6 | 7 | 8 | 11 | 12 | 13 | 14 | 17 | 18 | 19 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 38 | 39 | 40 | ); 41 | }; 42 | 43 | const Container = styled.div` 44 | margin-top: 30px; 45 | padding: 30px 0px 26px; 46 | display: grid; 47 | grid-gap: 25px; 48 | gap: 25px; 49 | grid-template-columns: repeat(5, minmax(0, 1fr)); 50 | 51 | @media (max-width: 768px) { 52 | grid-template-columns: repeat(1, minmax(0, 1fr)); 53 | } 54 | `; 55 | 56 | const Wrap = styled.div` 57 | padding-top: 56.25%; 58 | border-radius: 10px; 59 | box-shadow: rgb(0 0 0 / 69%) 0px 26px 30px -10px, 60 | rgb(0 0 0 / 73%) 0px 16px 10px -10px; 61 | cursor: pointer; 62 | overflow: hidden; 63 | position: relative; 64 | transition: all 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; 65 | border: 3px solid rgba(249, 249, 249, 0.1); 66 | 67 | img { 68 | inset: 0px; 69 | display: block; 70 | height: 100%; 71 | object-fit: cover; 72 | opacity: 1; 73 | position: absolute; 74 | transition: opacity 500ms ease-in-out 0s; 75 | width: 100%; 76 | z-index: 1; 77 | top: 0; 78 | } 79 | 80 | video { 81 | width: 100%; 82 | height: 100%; 83 | position: absolute; 84 | top: 0px; 85 | opacity: 0; 86 | z-index: 0; 87 | } 88 | 89 | &:hover { 90 | box-shadow: rgb(0 0 0 / 80%) 0px 40px 58px -16px, 91 | rgb(0 0 0 / 72%) 0px 30px 22px -10px; 92 | 93 | transform: scale(1.05); 94 | border-color: rgba(249, 249, 249, 0.8); 95 | 96 | video { 97 | opacity: 1; 98 | } 99 | } 100 | `; 101 | 102 | export default Viewers; 103 | -------------------------------------------------------------------------------- /Priyadarshan/src/features/movie/movieSlice.js: -------------------------------------------------------------------------------- 1 | import { createSlice } from "@reduxjs/toolkit"; 2 | 3 | const initialState = { 4 | recommend: null, 5 | newDisney: null, 6 | original: null, 7 | trending: null, 8 | }; 9 | 10 | const movieSlice = createSlice({ 11 | name: "movie", 12 | initialState, 13 | reducers: { 14 | setMovies: (state, action) => { 15 | state.recommend = action.payload.recommend; 16 | state.newDisney = action.payload.newDisney; 17 | state.original = action.payload.original; 18 | state.trending = action.payload.trending; 19 | }, 20 | }, 21 | }); 22 | 23 | export const { setMovies } = movieSlice.actions; 24 | 25 | export const selectRecommend = (state) => state.movie.recommend; 26 | export const selectNewDisney = (state) => state.movie.newDisney; 27 | export const selectOriginal = (state) => state.movie.original; 28 | export const selectTrending = (state) => state.movie.trending; 29 | 30 | export default movieSlice.reducer; 31 | -------------------------------------------------------------------------------- /Priyadarshan/src/features/user/userSlice.js: -------------------------------------------------------------------------------- 1 | import { createSlice } from "@reduxjs/toolkit"; 2 | 3 | const initialState = { 4 | name: "", 5 | email: "", 6 | photo: "", 7 | }; 8 | 9 | const userSlice = createSlice({ 10 | name: "user", 11 | initialState, 12 | reducers: { 13 | setUserLoginDetails: (state, action) => { 14 | state.name = action.payload.name; 15 | state.email = action.payload.email; 16 | state.photo = action.payload.photo; 17 | }, 18 | 19 | setSignOutState: (state) => { 20 | state.name = null; 21 | state.email = null; 22 | state.photo = null; 23 | }, 24 | }, 25 | }); 26 | 27 | export const { setUserLoginDetails, setSignOutState } = userSlice.actions; 28 | 29 | export const selectUserName = (state) => state.user.name; 30 | export const selectUserEmail = (state) => state.user.email; 31 | export const selectUserPhoto = (state) => state.user.photo; 32 | 33 | export default userSlice.reducer; 34 | -------------------------------------------------------------------------------- /Priyadarshan/src/firebase.js: -------------------------------------------------------------------------------- 1 | import firebase from "firebase"; 2 | 3 | const firebaseConfig = { 4 | apiKey: "AIzaSyA9BnlX96fMf7XiUVCFRsoQzG8DGERJkeY", 5 | authDomain: "disneyplus-clone-a33d5.firebaseapp.com", 6 | projectId: "disneyplus-clone-a33d5", 7 | storageBucket: "disneyplus-clone-a33d5.appspot.com", 8 | messagingSenderId: "37918794208", 9 | appId: "1:37918794208:web:dbe9842dfe1dda522a4b85", 10 | measurementId: "G-DRVLJKWRWG", 11 | }; 12 | 13 | const firebaseApp = firebase.initializeApp(firebaseConfig); 14 | const db = firebaseApp.firestore(); 15 | const auth = firebase.auth(); 16 | const provider = new firebase.auth.GoogleAuthProvider(); 17 | const storage = firebase.storage(); 18 | 19 | export { auth, provider, storage }; 20 | export default db; 21 | -------------------------------------------------------------------------------- /Priyadarshan/src/index.css: -------------------------------------------------------------------------------- 1 | html { 2 | scroll-behavior: smooth; 3 | } 4 | 5 | * { 6 | box-sizing: border-box; 7 | } 8 | 9 | body { 10 | background-color: #040714; 11 | color: #f9f9f9; 12 | 13 | font-family: Avenir-Roman, sans-serif; 14 | margin: 0; 15 | padding: 0; 16 | } 17 | 18 | a { 19 | color: #f9f9f9; 20 | text-decoration: none; 21 | } 22 | 23 | @media only screen and (min-width: 768px) { 24 | body { 25 | font-size: 16px; 26 | } 27 | } 28 | @media only screen and (min-width: 480px) and (max-width: 768px) { 29 | body { 30 | font-size: 15px; 31 | } 32 | } 33 | @media only screen and (max-width: 479px) { 34 | body { 35 | font-size: 14px; 36 | } 37 | } -------------------------------------------------------------------------------- /Priyadarshan/src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import "./index.css"; 4 | import App from "./App"; 5 | import store from "./app/store"; 6 | import { Provider } from "react-redux"; 7 | 8 | ReactDOM.render( 9 | 10 | 11 | 12 | 13 | , 14 | document.getElementById("root") 15 | ); 16 | 17 | // If you want to start measuring performance in your app, pass a function 18 | // to log results (for example: reportWebVitals(console.log)) 19 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 20 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # showcase-your-webpage 2 | a repo where you can showcase your webpage 3 | 4 | # HACKTOBERFEST 5 | Create a pull if it satify the problems then it will be merged 6 | # What is Hacktoberfest? 7 | ### Hacktoberfest is a month-long celebration of open-source software by DigitalOcean that encourages participation in giving back to the open-source community. 8 | 9 | # Why to attend? 10 | ### Participating in Hacktoberfest is a great way to get involved with the open source community wherever you are on your tech journey. 11 | 12 | 13 | # How to contribute? 14 | 15 | **1.** Fork [this](https://github.com/SCCSEAOT/showcase-your-webpage) repository. 16 | 17 | **2.** Clone your forked copy of the project. 18 | 19 | ```bash 20 | git clone https://github.com//showcase-your-webpage 21 | ``` 22 | 23 | **3.** Navigate to the project directory :file_folder: . 24 | 25 | ``` 26 | cd showcase-your-webpage 27 | ``` 28 | 29 | **4.** Add a reference(remote) to the original repository. 30 | 31 | ``` 32 | git remote add upstream https://github.com/SCCSEAOT/showcase-your-webpage 33 | ``` 34 | 35 | **5.** Check the remotes for this repository. 36 | ``` 37 | git remote -v 38 | ``` 39 | 40 | **6.** Always take a pull from the upstream repository to your master branch to keep it at par with the main project(updated repository). 41 | 42 | ``` 43 | git pull upstream main 44 | ``` 45 | 46 | **7.** Create a new branch. 47 | 48 | ``` 49 | git checkout -b 50 | ``` 51 | 52 | **8.** Perform your desired changes to the code base. 53 | 54 | 55 | **9.** Track your changes:heavy_check_mark: . 56 | 57 | ``` 58 | git add . 59 | ``` 60 | 61 | **10.** Commit your changes . 62 | 63 | ``` 64 | git commit -m "Relevant message" 65 | ``` 66 | 67 | **11.** Push the committed changes in your feature branch to your remote repo. 68 | ``` 69 | git push -u origin 70 | ``` 71 | 72 | **12.** To create a pull request, click on `compare and pull requests`. Please ensure you compare your feature branch to the desired branch of the repository you are supposed to make a PR to. 73 | 74 | 75 | **13.** Add appropriate title and description to your pull request explaining your changes and efforts done. 76 | 77 | 78 | **14.** Click on `Create Pull Request`. 79 | 80 | 81 | **15** Hurray! You have made a PR to the SHOWCASE-YOUR-WEBPAGE . Sit back patiently and relax while your PR is reviewed.it 82 | 83 | 84 | 85 | Thanks goes to these **Wonderful People** 👨🏻‍💻: 🚀 **Contributions** of any kind is welcome! 86 | 87 | 88 | 89 | 94 | 95 |
90 | 91 | 92 | 93 |
96 | -------------------------------------------------------------------------------- /Rayoti/Hover Button/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Hover 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /Rayoti/Hover Button/script.js: -------------------------------------------------------------------------------- 1 | const container = document.getElementById("container"); 2 | const colors = ["#95FA03", "#00FAF7", "#FA00D0", "#FFAE00", "#3800AF"]; 3 | const SQUARES = 2700; 4 | 5 | const getRandomColor = () => colors[Math.floor(Math.random() * colors.length)]; 6 | 7 | const setColor = (square) => { 8 | const color = getRandomColor(); 9 | square.style.background = color; 10 | square.style.boxShadow = `0 0 2px ${color}, 0 0 10px ${color}`; 11 | }; 12 | 13 | const removeColor = (square) => { 14 | square.style.background = "#ldldld"; 15 | square.style.boxShadow = "0 0 2px #000"; 16 | }; 17 | 18 | for(let i = 0; i < SQUARES; i++) { 19 | const square = document.createElement("div"); 20 | square.classList.add("square"); 21 | square.addEventListener("mouseover", () => setColor(square)); 22 | square.addEventListener("mouseout", () => removeColor(square)); 23 | container.appendChild(square); 24 | } 25 | 26 | -------------------------------------------------------------------------------- /Rayoti/Hover Button/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | box-sizing: border-box; 3 | } 4 | 5 | body{ 6 | background-color: #111; 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | height: 100vh; 11 | overflow: hidden; 12 | margin: 0; 13 | } 14 | .container { 15 | display: flex; 16 | align-items: center; 17 | justify-content: center; 18 | flex-wrap: wrap; 19 | max-width: 1800px; 20 | } 21 | .square{ 22 | background-color: #ldldld; 23 | box-shadow: 0 0 2px #000; 24 | height: 16px; 25 | width: 16px; 26 | margin: 2px; 27 | transition: 1s ease; 28 | } 29 | .square:hover { 30 | transition-duration: 0.5s; 31 | } 32 | -------------------------------------------------------------------------------- /Rayoti/SimpleJobApplicationWebsite/first.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Job Application Form 8 | 9 | 10 | 11 |
12 |
13 |

14 | Job Application 15 | (Web) 16 |

17 |
18 |
19 |
20 | 21 | 26 |
27 |
28 | 29 | 34 |
35 |
36 | 37 | 43 |
44 |
45 | 46 | 53 |
54 |
55 | 56 | 63 |
64 |
65 | 66 | 67 |
68 |
69 | 70 | 76 |
77 |
78 | 79 | 80 |
81 |
82 | 83 | 84 |
85 |
86 |
87 | 88 |
89 |
90 |
91 |
92 | 93 | 94 | -------------------------------------------------------------------------------- /Rayoti/SimpleJobApplicationWebsite/first_style.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | body { 8 | background-color: #ccc; 9 | } 10 | .container { 11 | max-width: 900px; 12 | margin: 0 auto; 13 | } 14 | 15 | .apply_box { 16 | max-width: 600px; 17 | padding: 20px; 18 | background-color: white; 19 | margin: 0 auto; 20 | margin-top: 50px; 21 | box-shadow: 4px 3px 5px rgba(1, 1, 1, 0.1); 22 | border-radius: 10px; 23 | } 24 | 25 | .title_small { 26 | font-size: 20px; 27 | } 28 | 29 | .form_container { 30 | margin-top: 20px; 31 | display: grid; 32 | grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 33 | gap: 20px; 34 | } 35 | .form_control { 36 | display: flex; 37 | flex-direction: column; 38 | } 39 | 40 | label { 41 | font-size: 15px; 42 | margin-bottom: 5px; 43 | } 44 | 45 | input, 46 | select, 47 | textarea { 48 | padding: 6px 10px; 49 | border: 1px solid #ccc; 50 | border-radius: 4px; 51 | font-size: 15px; 52 | } 53 | 54 | input:focus { 55 | outline-color: red; 56 | } 57 | 58 | .button_container { 59 | display: flex; 60 | 61 | justify-content: flex-end; 62 | margin-top: 20px; 63 | } 64 | button { 65 | background-color: red; 66 | border: transparent solid 2px; 67 | padding: 5px 10px; 68 | color: white; 69 | border-radius: 8px; 70 | transition: 0.3s ease-in; 71 | } 72 | button:hover { 73 | background-color: #ccc; 74 | border: 2px solid red; 75 | color: black; 76 | transition: 0.3s ease-out; 77 | cursor: pointer; 78 | } 79 | .textarea_control { 80 | grid-column: 1 / span 2; 81 | } 82 | .textarea_control textarea { 83 | width: 100%; 84 | } 85 | 86 | @media (max-width: 460px) { 87 | .textarea_control { 88 | grid-column: 1 / span 1; 89 | } 90 | } ; 91 | -------------------------------------------------------------------------------- /RegistrationForm/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Registration Form 6 | 7 | 8 | 9 |

Registration Form

10 |

Please fill out this form with the required information

11 |
12 |
13 | 14 | 15 | 16 | 17 |
18 |
19 | 20 | 21 | 24 |
25 |
26 | 27 | 28 | 37 | 40 |
41 | 42 |
43 | 44 | -------------------------------------------------------------------------------- /RegistrationForm/regform.css: -------------------------------------------------------------------------------- 1 | body { 2 | width: 100%; 3 | height: 100vh; 4 | margin: 0; 5 | background-color: #1b1b32; 6 | color: #f5f6f7; 7 | font-family: Tahoma; 8 | font-size: 19px; 9 | } 10 | 11 | h1, p { 12 | margin: 1em auto; 13 | text-align: center; 14 | } 15 | 16 | form { 17 | width: 60vw; 18 | max-width: 500px; 19 | min-width: 300px; 20 | margin: 0 auto; 21 | padding-bottom: 2em; 22 | } 23 | 24 | fieldset { 25 | border: none; 26 | padding: 2rem 0; 27 | border-bottom: 3px solid #3b3b4f; 28 | } 29 | 30 | fieldset:last-of-type { 31 | border-bottom: none; 32 | } 33 | 34 | label { 35 | display: block; 36 | margin: 0.5rem 0; 37 | } 38 | 39 | input, 40 | textarea, 41 | select { 42 | margin: 10px 0 0 0; 43 | width: 100%; 44 | min-height: 2em; 45 | } 46 | 47 | input, textarea { 48 | background-color: #0a0a23; 49 | border: 1px solid #0a0a23; 50 | color: #ffffff; 51 | } 52 | 53 | .inline { 54 | width: unset; 55 | margin: 0 0.5em 0 0; 56 | vertical-align: middle; 57 | } 58 | 59 | input[type="submit"] { 60 | display: block; 61 | width: 60%; 62 | margin: 1em auto; 63 | height: 2em; 64 | font-size: 1.1rem; 65 | background-color: #3b3b4f; 66 | border-color: white; 67 | min-width: 300px; 68 | } 69 | 70 | input[type="file"] { 71 | padding: 1px 2px; 72 | } 73 | 74 | a{ 75 | color:#dfdfe2; 76 | } 77 | -------------------------------------------------------------------------------- /SHINJINI/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 34 | -------------------------------------------------------------------------------- /SRIJAN/srijan.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 50px; 3 | } 4 | 5 | hr { 6 | border: 0; 7 | height: 1px; 8 | background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); 9 | } 10 | 11 | .em-text{ 12 | color: #0ea7b5 !important; 13 | } 14 | 15 | .intro-header { 16 | -webkit-font-smoothing: antialiased; 17 | text-rendering: optimizelegibility; 18 | padding-top: 50px; 19 | padding-bottom: 50px; 20 | text-align: center; 21 | background:url(https://unsplash.com/photos/FIKD9t5_5zQ/download) center center fixed; 22 | background-size: cover; 23 | } 24 | .intro-message > h1 { 25 | -webkit-font-smoothing: antialiased; 26 | text-rendering: optimizelegibility; 27 | margin-top: 10%; 28 | font-size: 70px; 29 | text-shadow: 2px 1px #808080; 30 | } 31 | 32 | 33 | .btn:hover { 34 | background: #C0C0C0; 35 | transform:scale(1); 36 | transition: 0.1s; 37 | letter-spacing: 2px; 38 | } 39 | 40 | .navbar-header { 41 | margin-left: 2%; 42 | } 43 | .navbar-right { 44 | margin-right: 2%; 45 | } 46 | 47 | .btn-freeCodeCamp { 48 | background-color: #492C14; 49 | color: #ffffff !important; 50 | } 51 | 52 | .about-page { 53 | -webkit-font-smoothing: antialiased; 54 | text-rendering: optimizelegibility; 55 | padding-top: 50px; 56 | padding-bottom: 50px; 57 | text-align: center; 58 | background:url(https://images.unsplash.com/photo-1433959352364-9314c5b6eb0b?fit=crop&fm=jpg&h=700&q=80&w=1050) center center fixed; 59 | background-size: cover; 60 | } 61 | 62 | .about-message > h1{ 63 | -webkit-font-smoothing: antialiased; 64 | text-rendering: optimizelegibility; 65 | margin-top: 5%; 66 | font-size: 60px; 67 | text-shadow: 2px 1px #808080; 68 | } 69 | 70 | .about-message > p{ 71 | margin-top: 50px; 72 | color: #dddddd; 73 | text-shadow: 2px 1px #000; 74 | font-size: 20px; 75 | } 76 | 77 | .portfolio-page { 78 | padding-top: 20px; 79 | padding-bottom: 50px; 80 | text-align: center; 81 | background:url(https://images.unsplash.com/photo-1437422061949-f6efbde0a471?q=80&fm=jpg&s=e23055c9ba7686b8fe583fb8318a1f88) center center fixed; 82 | background-size: cover; 83 | } 84 | 85 | .portfolio-message { 86 | margin-top: 5%; 87 | font-size: 60px; 88 | text-shadow: 2px 1px #808080; 89 | } 90 | 91 | .contact-page { 92 | padding-top: 70px; 93 | padding-bottom: 50px; 94 | text-align: center; 95 | background:url(https://images.unsplash.com/photo-1415045384817-2f9cf7f2ed79?q=80&fm=jpg&s=c186a1fbe2e559bdb841372f97715c91) center center fixed; 96 | background-size: cover; 97 | } 98 | 99 | .contact-message > h1{ 100 | margin-top: 15%; 101 | font-size: 60px; 102 | text-shadow: 2px 1px #808080; 103 | float: left; 104 | padding-bottom: 50px; 105 | } 106 | 107 | ul.social-buttons > li { 108 | display: block; 109 | margin: 0 auto; 110 | padding: 2em; 111 | } 112 | -------------------------------------------------------------------------------- /SRIJAN/srijan.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | $('.nav li').click(function(){ 4 | $('.nav li').removeClass('active'); 5 | $(this).addClass('active'); 6 | }) 7 | 8 | $(".intro-header").css("height", $(window).height()); 9 | 10 | $(".about-page").css("height", $(window).height()); 11 | 12 | $(".portfolio-page").css("height", $(window).height()); 13 | 14 | $(".contact-page").css("height", $(window).height()); 15 | 16 | -------------------------------------------------------------------------------- /Sayan Das/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Login Page 6 | 46 | 47 | 48 |

User Login Form

49 |
50 |
51 | 52 | 53 | 54 | 55 | 56 | Remember me 57 | 58 | Forgot Password? 59 |
60 |
61 | 62 | 63 | -------------------------------------------------------------------------------- /Shanit/Musick/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Musick 8 | 9 | 10 | 11 | 12 | 25 | 26 |
27 |

Welcome to Musick

28 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente, odit numquam! Sunt dolorem eligendi aut harum, at dolores aperiam fuga delectus suscipit repellat enim non quam. Commodi vitae itaque ratione repudiandae tenetur. Molestias placeat nihil tempore asperiores dolorum inventore, fugiat neque sint rem, explicabo ducimus sed deserunt reiciendis, minus delectus?

29 | 30 |
31 | 32 | 33 | -------------------------------------------------------------------------------- /Shanit/index.css: -------------------------------------------------------------------------------- 1 | /* Css reset */ 2 | *{ 3 | margin: 0; 4 | padding: 0; 5 | } 6 | /* Navigation Bar */ 7 | 8 | #navbar{ 9 | display: flex; 10 | align-items: center; 11 | /* justify-content: center; */ 12 | position: relative; 13 | height: 70px; 14 | font-family: 'Baloo 2', cursive; 15 | } 16 | 17 | /* Navigation Bar: Logo */ 18 | #logo{ 19 | margin: 0px 10px; 20 | padding: 0px 15px; 21 | } 22 | #logo img{ 23 | height: 55px; 24 | width: 55px; 25 | } 26 | 27 | /* Navigation Bar: listing */ 28 | #navbar ul{ 29 | display: flex; 30 | margin: 20px; 31 | } 32 | #navbar::before{ 33 | content: ""; 34 | background-color: black; 35 | position: absolute; 36 | height: 100%; 37 | width: 100%; 38 | z-index: -1; 39 | opacity: 0.4; 40 | } 41 | #navbar ul li{ 42 | /* color: azure; */ 43 | list-style: none; 44 | font-size: 1.1rem; 45 | } 46 | #navbar ul li a{ 47 | color: white; 48 | display: block; 49 | padding: 10px 20px; 50 | border-radius: 30px; 51 | text-decoration: none; 52 | } 53 | #navbar ul li a:hover{ 54 | color: rgb(107, 224, 245); 55 | background-color: rgb(101, 38, 121); 56 | } 57 | .item{ 58 | padding: 10px 2px; 59 | } 60 | #home{ 61 | display: flex; 62 | flex-direction: column; 63 | padding: 5px 30px; 64 | height: 150px; 65 | justify-content: center; 66 | align-items: center; 67 | color: white; 68 | } 69 | #home::before{ 70 | content: ""; 71 | background: url("DJhands.jpg") no-repeat center center/cover; 72 | position: absolute; 73 | height: 100%; 74 | width: 100%; 75 | z-index: -1; 76 | opacity: 0.9; 77 | } 78 | #home h2{ 79 | font-size: 2.5rem; 80 | font-family: 'Baloo 2', cursive; 81 | padding: 20px; 82 | margin: 80px; 83 | } 84 | 85 | #home p{ 86 | font-family: 'Indie Flower', cursive; 87 | } 88 | 89 | .btn{ 90 | border: 2px solid rgb(201, 76, 240); 91 | width: 120px; 92 | margin: 10px; 93 | padding: 5px; 94 | border-radius: 15px; 95 | font-family: 'Baloo 2', cursive; 96 | background-color: rgb(107, 224, 245); 97 | cursor: pointer; 98 | } 99 | .btn:hover{ 100 | background-color: rgb(101, 38, 121); 101 | color: rgb(107, 224, 245); 102 | } 103 | 104 | .center{ 105 | text-align: center; 106 | } 107 | -------------------------------------------------------------------------------- /Snigdha's Login Webpage/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Login Form with Shake Effect | CodingNepal 8 | 9 | 10 | 11 | 12 |
13 |
Login Form
14 |
15 | 23 |
24 |
25 | 26 | 27 | 28 |
29 |
Password can't be blank
30 |
31 |
Forgot password?
32 | 33 |
34 |
Not yet member? Signup now
35 |
36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /Snigdha's Login Webpage/script.js: -------------------------------------------------------------------------------- 1 | const form = document.querySelector("form"); 2 | eField = form.querySelector(".email"), 3 | eInput = eField.querySelector("input"), 4 | pField = form.querySelector(".password"), 5 | pInput = pField.querySelector("input"); 6 | 7 | form.onsubmit = (e)=>{ 8 | e.preventDefault(); //preventing from form submitting 9 | //if email and password is blank then add shake class in it else call specified function 10 | (eInput.value == "") ? eField.classList.add("shake", "error") : checkEmail(); 11 | (pInput.value == "") ? pField.classList.add("shake", "error") : checkPass(); 12 | 13 | setTimeout(()=>{ //remove shake class after 500ms 14 | eField.classList.remove("shake"); 15 | pField.classList.remove("shake"); 16 | }, 500); 17 | 18 | eInput.onkeyup = ()=>{checkEmail();} //calling checkEmail function on email input keyup 19 | pInput.onkeyup = ()=>{checkPass();} //calling checkPassword function on pass input keyup 20 | 21 | function checkEmail(){ //checkEmail function 22 | let pattern = /^[^ ]+@[^ ]+\.[a-z]{2,3}$/; //pattern for validate email 23 | if(!eInput.value.match(pattern)){ //if pattern not matched then add error and remove valid class 24 | eField.classList.add("error"); 25 | eField.classList.remove("valid"); 26 | let errorTxt = eField.querySelector(".error-txt"); 27 | //if email value is not empty then show please enter valid email else show Email can't be blank 28 | (eInput.value != "") ? errorTxt.innerText = "Enter a valid email address" : errorTxt.innerText = "Email can't be blank"; 29 | }else{ //if pattern matched then remove error and add valid class 30 | eField.classList.remove("error"); 31 | eField.classList.add("valid"); 32 | } 33 | } 34 | 35 | function checkPass(){ //checkPass function 36 | if(pInput.value == ""){ //if pass is empty then add error and remove valid class 37 | pField.classList.add("error"); 38 | pField.classList.remove("valid"); 39 | }else{ //if pass is empty then remove error and add valid class 40 | pField.classList.remove("error"); 41 | pField.classList.add("valid"); 42 | } 43 | } 44 | 45 | //if eField and pField doesn't contains error class that mean user filled details properly 46 | if(!eField.classList.contains("error") && !pField.classList.contains("error")){ 47 | window.location.href = form.getAttribute("action"); //redirecting user to the specified url which is inside action attribute of form tag 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /Snigdha's Login Webpage/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap'); 2 | *{ 3 | margin: 0; 4 | padding: 0; 5 | box-sizing: border-box; 6 | font-family: "Poppins", sans-serif; 7 | } 8 | body{ 9 | width: 100%; 10 | height: 100vh; 11 | display: flex; 12 | align-items: center; 13 | justify-content: center; 14 | background: #5372F0; 15 | } 16 | ::selection{ 17 | color: #fff; 18 | background: #5372F0; 19 | } 20 | .wrapper{ 21 | width: 380px; 22 | padding: 40px 30px 50px 30px; 23 | background: #fff; 24 | border-radius: 5px; 25 | text-align: center; 26 | box-shadow: 10px 10px 15px rgba(0,0,0,0.1); 27 | } 28 | .wrapper header{ 29 | font-size: 35px; 30 | font-weight: 600; 31 | } 32 | .wrapper form{ 33 | margin: 40px 0; 34 | } 35 | form .field{ 36 | width: 100%; 37 | margin-bottom: 20px; 38 | } 39 | form .field.shake{ 40 | animation: shake 0.3s ease-in-out; 41 | } 42 | @keyframes shake { 43 | 0%, 100%{ 44 | margin-left: 0px; 45 | } 46 | 20%, 80%{ 47 | margin-left: -12px; 48 | } 49 | 40%, 60%{ 50 | margin-left: 12px; 51 | } 52 | } 53 | form .field .input-area{ 54 | height: 50px; 55 | width: 100%; 56 | position: relative; 57 | } 58 | form input{ 59 | width: 100%; 60 | height: 100%; 61 | outline: none; 62 | padding: 0 45px; 63 | font-size: 18px; 64 | background: none; 65 | caret-color: #5372F0; 66 | border-radius: 5px; 67 | border: 1px solid #bfbfbf; 68 | border-bottom-width: 2px; 69 | transition: all 0.2s ease; 70 | } 71 | form .field input:focus, 72 | form .field.valid input{ 73 | border-color: #5372F0; 74 | } 75 | form .field.shake input, 76 | form .field.error input{ 77 | border-color: #dc3545; 78 | } 79 | .field .input-area i{ 80 | position: absolute; 81 | top: 50%; 82 | font-size: 18px; 83 | pointer-events: none; 84 | transform: translateY(-50%); 85 | } 86 | .input-area .icon{ 87 | left: 15px; 88 | color: #bfbfbf; 89 | transition: color 0.2s ease; 90 | } 91 | .input-area .error-icon{ 92 | right: 15px; 93 | color: #dc3545; 94 | } 95 | form input:focus ~ .icon, 96 | form .field.valid .icon{ 97 | color: #5372F0; 98 | } 99 | form .field.shake input:focus ~ .icon, 100 | form .field.error input:focus ~ .icon{ 101 | color: #bfbfbf; 102 | } 103 | form input::placeholder{ 104 | color: #bfbfbf; 105 | font-size: 17px; 106 | } 107 | form .field .error-txt{ 108 | color: #dc3545; 109 | text-align: left; 110 | margin-top: 5px; 111 | } 112 | form .field .error{ 113 | display: none; 114 | } 115 | form .field.shake .error, 116 | form .field.error .error{ 117 | display: block; 118 | } 119 | form .pass-txt{ 120 | text-align: left; 121 | margin-top: -10px; 122 | } 123 | .wrapper a{ 124 | color: #5372F0; 125 | text-decoration: none; 126 | } 127 | .wrapper a:hover{ 128 | text-decoration: underline; 129 | } 130 | form input[type="submit"]{ 131 | height: 50px; 132 | margin-top: 30px; 133 | color: #fff; 134 | padding: 0; 135 | border: none; 136 | background: #5372F0; 137 | cursor: pointer; 138 | border-bottom: 2px solid rgba(0,0,0,0.1); 139 | transition: all 0.3s ease; 140 | } 141 | form input[type="submit"]:hover{ 142 | background: #2c52ed; 143 | } 144 | -------------------------------------------------------------------------------- /Snigdha/__pycache__/librarym.cpython-38.pyc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Snigdha/__pycache__/librarym.cpython-38.pyc -------------------------------------------------------------------------------- /Snigdha/database/library2.sql: -------------------------------------------------------------------------------- 1 | -- phpMyAdmin SQL Dump 2 | -- version 5.2.0 3 | -- https://www.phpmyadmin.net/ 4 | -- 5 | -- Host: 127.0.0.1 6 | -- Generation Time: May 23, 2022 at 09:33 AM 7 | -- Server version: 10.4.24-MariaDB 8 | -- PHP Version: 7.4.29 9 | 10 | SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; 11 | START TRANSACTION; 12 | SET time_zone = "+00:00"; 13 | 14 | 15 | /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; 16 | /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; 17 | /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; 18 | /*!40101 SET NAMES utf8mb4 */; 19 | 20 | -- 21 | -- Database: `library2` 22 | -- 23 | 24 | -- -------------------------------------------------------- 25 | 26 | -- 27 | -- Table structure for table `register` 28 | -- 29 | 30 | CREATE TABLE `register` ( 31 | `id` int(10) NOT NULL, 32 | `f_name` varchar(50) NOT NULL, 33 | `l_name` varchar(50) NOT NULL, 34 | `contact` varchar(10) NOT NULL, 35 | `email` varchar(50) NOT NULL, 36 | `question` varchar(100) NOT NULL, 37 | `answer` varchar(100) NOT NULL, 38 | `password` varchar(50) NOT NULL 39 | ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; 40 | 41 | -- 42 | -- Indexes for dumped tables 43 | -- 44 | 45 | -- 46 | -- Indexes for table `register` 47 | -- 48 | ALTER TABLE `register` 49 | ADD PRIMARY KEY (`id`); 50 | 51 | -- 52 | -- AUTO_INCREMENT for dumped tables 53 | -- 54 | 55 | -- 56 | -- AUTO_INCREMENT for table `register` 57 | -- 58 | ALTER TABLE `register` 59 | MODIFY `id` int(10) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=8; 60 | COMMIT; 61 | 62 | /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; 63 | /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; 64 | /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */; 65 | -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/android-chrome-192x192.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/android-chrome-512x512.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/apple-touch-icon.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/favicon-16x16.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/favicon-32x32.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/favicon_io/favicon.ico -------------------------------------------------------------------------------- /Sudoku-Solver/files/favicon_io/site.webmanifest: -------------------------------------------------------------------------------- 1 | {"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} -------------------------------------------------------------------------------- /Sudoku-Solver/files/images/ss00.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/images/ss00.png -------------------------------------------------------------------------------- /Sudoku-Solver/files/images/ss01.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Sudoku-Solver/files/images/ss01.png -------------------------------------------------------------------------------- /Sudoku-Solver/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Sudoku Solver 11 | 12 | 13 | 14 |
15 |

Sudoku Solver

16 |

Solves sudoku puzzle using backtracking technique.

17 |

→ Enter a valid sudoku puzzle. Then click the Solve button to see the solution.

18 |

→ Click the Clear button to clear the board.

19 |

→ Hit Load a puzzle to load a pre-existing puzzle.

20 |
21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /Sudoku-Solver/scripts/app.js: -------------------------------------------------------------------------------- 1 | import { solve, insertValues, populateValues } from './solver.js' 2 | import { drawBoard } from './draw_board.js' 3 | import { loadRandomBoard } from './load_boards.js' 4 | 5 | const solveButton = document.querySelector("#solve-button") 6 | const clearButton = document.querySelector("#clear-button") 7 | const loadButton = document.querySelector('#load-button') 8 | 9 | function main() { 10 | drawBoard() 11 | solveButton.addEventListener('click', () => { 12 | insertValues() 13 | if(solve()) { 14 | populateValues() 15 | } else { 16 | alert("Can't solve this puzzle!") 17 | } 18 | }) 19 | clearButton.addEventListener('click', () => window.location.reload(true)) 20 | loadButton.addEventListener('click', () => loadRandomBoard()) 21 | } 22 | main() -------------------------------------------------------------------------------- /Sudoku-Solver/scripts/draw_board.js: -------------------------------------------------------------------------------- 1 | export function drawBoard() { 2 | const sudokuBoard = document.querySelector("#puzzle") 3 | const squares = 81 4 | 5 | for (let i=0; i 27 && i < 53)) || 15 | ((i % 9 == 0 || i % 9 == 1 || i % 9 == 2) && i > 53) || 16 | ((i % 9 == 6 || i % 9 == 7 || i % 9 == 8) && i > 53) 17 | ) { 18 | inputElement.classList.add('odd-section') 19 | } 20 | sudokuBoard.appendChild(inputElement) 21 | } 22 | } -------------------------------------------------------------------------------- /Sudoku-Solver/scripts/load_boards.js: -------------------------------------------------------------------------------- 1 | const boards = { 2 | 0: [0,0,0,0,1,7,2,0,0,0,0,0,4,0,0,0,0,0,0,0,9,0,0,3,0,0,0,4,0,0,7,8,0,5,0,0,0,2,5,0,0,0,8,0,0,0,0,0,6,0,0,0,0,0,6,0,1,5,0,0,0,0,0,0,0,0,0,0,6,0,3,0,2,0,0,0,0,1,7,0,4], 3 | 1: [0,5,1,3,6,2,7,0,0,0,4,0,0,5,8,0,0,0,0,0,0,4,0,0,0,2,5,0,8,0,0,0,0,9,0,3,0,0,0,0,0,0,0,0,0,7,0,5,0,0,0,0,8,0,1,2,0,0,0,9,0,0,0,0,0,0,2,8,0,0,6,0,0,0,8,5,3,4,2,9,0] 4 | } 5 | const size = Object.keys(boards).length 6 | 7 | export function loadRandomBoard() { 8 | const inputs = document.querySelectorAll('input') 9 | let index = Math.floor(Math.random()*size) 10 | let savedBoard = boards[index] 11 | 12 | for(let i=0; i { 7 | if(input.value) { 8 | board.push(parseInt(input.value)) 9 | input.classList.add('input-el') 10 | } else { 11 | board.push(0) 12 | input.classList.add('empty-el') 13 | } 14 | }) 15 | } 16 | 17 | const indexToRowCol = (index) => { 18 | return {row: Math.floor(index/9), col: index%9} 19 | } 20 | const rowColToIndex = (row, col) => (row * 9 + col) 21 | 22 | const acceptable = (board, index, value) => { 23 | let { row, col } = indexToRowCol(index) 24 | for (let r = 0; r < 9; ++r) { 25 | if (board[rowColToIndex(r, col)] == value) return false 26 | } 27 | for (let c = 0; c < 9; ++c) { 28 | if (board[rowColToIndex(row, c)] == value) return false 29 | } 30 | 31 | let r1 = Math.floor(row / 3) * 3 32 | let c1 = Math.floor(col / 3) * 3 33 | for (let r = r1; r < r1 + 3; ++r) { 34 | for (let c = c1; c < c1 + 3; ++c) { 35 | if (board[rowColToIndex(r, c)] == value) return false 36 | } 37 | } 38 | return true 39 | } 40 | 41 | const getChoices = (board, index) => { 42 | let choices = [] 43 | for (let value = 1; value <= 9; ++value) { 44 | if (acceptable(board, index, value)) { 45 | choices.push(value) 46 | } 47 | } 48 | return choices 49 | } 50 | 51 | const bestBet = (board) => { 52 | let index, moves, bestLen = 100 53 | for (let i = 0; i < 81; ++i) { 54 | if (!board[i]) { 55 | let m = getChoices(board, i) 56 | if (m.length < bestLen) { 57 | bestLen = m.length 58 | moves = m 59 | index = i 60 | if (bestLen == 0) break 61 | } 62 | } 63 | } 64 | return { index, moves } 65 | } 66 | 67 | export const solve = () => { 68 | let { index, moves } = bestBet(board) 69 | if (index == null) return true 70 | for (let m of moves) { 71 | board[index] = m 72 | if (solve()) return true 73 | } 74 | board[index] = 0 75 | return false 76 | } 77 | 78 | export function populateValues() { 79 | const inputs = document.querySelectorAll('input') 80 | inputs.forEach((input, i) => input.value = board[i]) 81 | } -------------------------------------------------------------------------------- /Sudoku-Solver/styles/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | border-spacing: 0; 8 | } 9 | 10 | html { 11 | font-family: 'Roboto', sans-serif; 12 | background-color: #FDF2E9; 13 | } 14 | 15 | .intro { 16 | color: #1B4F72; 17 | font-size: 25px; 18 | letter-spacing: 1px; 19 | margin: 30px 0px 10px 0px; 20 | } 21 | 22 | .instruction-1, .instruction-2, .instruction-3, .description { 23 | font-size: 19px; 24 | color: #1B4F72; 25 | letter-spacing: 0.5px; 26 | } 27 | 28 | .instruction-3 { 29 | margin: 0px 0px 15px 0px; 30 | } 31 | 32 | .description { 33 | margin: 0px 0px 15px 0px; 34 | } 35 | 36 | .decorator-elem { 37 | font-weight: bold; 38 | } 39 | 40 | .sudoku-solver { 41 | margin: auto; 42 | width: 50%; 43 | } 44 | 45 | .puzzle { 46 | width: 540px; 47 | height: 540px; 48 | } 49 | 50 | 51 | .odd-section { 52 | background: #d3d3d3; 53 | } 54 | 55 | .puzzle input { 56 | text-align: center; 57 | font-size: 30px; 58 | width: 60px; 59 | height: 60px; 60 | border: 1px #808080 solid; 61 | } 62 | 63 | .empty-el { 64 | color: #4848d4; 65 | } 66 | 67 | .solve-button, .clear-button, .load-button { 68 | margin-top: 20px; 69 | background-color: #1B4F72; 70 | border: none; 71 | border-radius: 3px; 72 | color: white; 73 | padding: 15px 30px; 74 | text-align: center; 75 | text-decoration: none; 76 | display: inline-block; 77 | font-size: 18px; 78 | letter-spacing: 1px; 79 | /* text-transform: uppercase; */ 80 | cursor: pointer; 81 | } 82 | 83 | .clear-button, .load-button { 84 | margin-left: 15px; 85 | } 86 | 87 | .solve-button:hover, .clear-button:hover, .load-button:hover { 88 | background-color: #568caf; 89 | } 90 | -------------------------------------------------------------------------------- /Supratim/index1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Login Page 6 | 46 | 47 | 48 |

Student Login Form

49 |
50 |
51 | 52 | 53 | 54 | 55 | 56 | Remember me 57 | 58 | Forgot password? 59 |
60 |
61 | 62 | 63 | -------------------------------------------------------------------------------- /Suvarnesh/404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Page Not Found 7 | 8 | 23 | 24 | 25 |
26 |

404

27 |

Page Not Found

28 |

The specified file was not found on this website. Please check the URL for mistakes and try again.

29 |

Why am I seeing this?

30 |

This page was generated by the Firebase Command-Line Interface. To modify it, edit the 404.html file in your project's configured public directory.

31 |
32 | 33 | 34 | -------------------------------------------------------------------------------- /Suvarnesh/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/favicon.ico -------------------------------------------------------------------------------- /Suvarnesh/images/address_book.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/address_book.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/cc-bg-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/cc-bg-1.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/covid_19.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/covid_19.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/graphic-design-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/graphic-design-1.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/graphic-design-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/graphic-design-2.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/graphic-design-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/graphic-design-3.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/graphic-design-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/graphic-design-4.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/logo512.png -------------------------------------------------------------------------------- /Suvarnesh/images/logo64.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/logo64.png -------------------------------------------------------------------------------- /Suvarnesh/images/photography-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/photography-1.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/photography-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/photography-2.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/photography-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/photography-3.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/photography-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/photography-4.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/project-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/project-1.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/project-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/project-2.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/project-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/project-3.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/project-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/project-4.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/reference-image-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/reference-image-1.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/reference-image-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/reference-image-2.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/reference-image-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/reference-image-3.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/staticmap.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/staticmap.png -------------------------------------------------------------------------------- /Suvarnesh/images/suvarneshkm.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/suvarneshkm.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/todo-react.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/todo-react.jpg -------------------------------------------------------------------------------- /Suvarnesh/images/todo_django.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/Suvarnesh/images/todo_django.jpg -------------------------------------------------------------------------------- /Suvarnesh/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "Suvarnesh' Resume", 3 | "short_name" : "Suvarnesh KM", 4 | "start_url" : ".", 5 | "background_color" : "white", 6 | "theme_color" : "#378C3F", 7 | "display" : "standalone", 8 | "icons" : [ 9 | { 10 | "src" : "images/logo64.png", 11 | "sizes" : "64x64", 12 | "type" : "image/png" 13 | }, 14 | { 15 | "src" : "images/logo512.png", 16 | "sizes" : "512x512", 17 | "type" : "image/png" 18 | } 19 | ] 20 | } -------------------------------------------------------------------------------- /Suvarnesh/script.js: -------------------------------------------------------------------------------- 1 | if("serviceWorker" in navigator){ 2 | navigator.serviceWorker.register("sworker.js").then(registration=>{ 3 | console.log("Service worker registered") 4 | console.log(registration); 5 | }).catch(error=>{ 6 | console.log("Service Worker error") 7 | console.log(error) 8 | }) 9 | } 10 | else { 11 | alert("Service Worker not working") 12 | } -------------------------------------------------------------------------------- /Suvarnesh/scripts/main.js: -------------------------------------------------------------------------------- 1 | // Add your javascript here 2 | // Don't forget to add it into respective layouts where this js file is needed 3 | 4 | $(document).ready(function() { 5 | AOS.init( { 6 | // uncomment below for on-scroll animations to played only once 7 | // once: true 8 | }); // initialize animate on scroll library 9 | }); 10 | 11 | // Smooth scroll for links with hashes 12 | $('a.smooth-scroll') 13 | .click(function(event) { 14 | // On-page links 15 | if ( 16 | location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') 17 | && 18 | location.hostname == this.hostname 19 | ) { 20 | // Figure out element to scroll to 21 | var target = $(this.hash); 22 | target = target.length ? target : $('[name=' + this.hash.slice(1) + ']'); 23 | // Does a scroll target exist? 24 | if (target.length) { 25 | // Only prevent default if animation is actually gonna happen 26 | event.preventDefault(); 27 | $('html, body').animate({ 28 | scrollTop: target.offset().top 29 | }, 1000, function() { 30 | // Callback after animation 31 | // Must change focus! 32 | var $target = $(target); 33 | $target.focus(); 34 | if ($target.is(":focus")) { // Checking if the target was focused 35 | return false; 36 | } else { 37 | $target.attr('tabindex','-1'); // Adding tabindex for elements not focusable 38 | $target.focus(); // Set focus again 39 | }; 40 | }); 41 | } 42 | } 43 | }); 44 | -------------------------------------------------------------------------------- /Suvarnesh/sworker.js: -------------------------------------------------------------------------------- 1 | self.addEventListener("install",e=>{ 2 | 3 | e.waitUntil( 4 | caches.open("static").then(cache=>{ 5 | return cache.addAll(["./","css/aos.css","css/bootstrap.min.css" 6 | ,"css/main.css","./images/address_book.jpg" 7 | ,"./images/covid_19.jpg","./images/todo_django.jpg" 8 | ,"./images/todo-react.jpg","./images/logo64.png" 9 | ,"./images/logo512.png","./images/suvarneshkm.jpg" 10 | ,"./images/cc-bg-1.jpg","./favicon.ico"]); 11 | }) 12 | ) 13 | 14 | }) 15 | 16 | self.addEventListener("fetch",e=>{ 17 | e.respondWith( 18 | caches.match(e.request).then(response=>{ 19 | return response || fetch(e.request) 20 | }) 21 | ) 22 | }) -------------------------------------------------------------------------------- /White Board/Online-WhiteBoard/README.md: -------------------------------------------------------------------------------- 1 | # Online-WhiteBoard 2 | This is an online white board that will allow you to brainstorm, work out problems, and even draw mockups with other people remotely! 3 | 4 | # Tech Stack Used 5 | * HTML 6 | * CSS 7 | * JavaScript 8 | 9 | # Try It Out 10 | Here is the live preview of the website. Feel free to try it out! [LIVE](https://online-whiteboard.netlify.app/) 11 | 12 | This is the demo screenshot of the Online WhiteBoard. 13 | ![Online WhiteBoard](https://github.com/Utkarsh299-tech/Online-WhiteBoard/blob/main/online_Whiteboard.png) 14 | 15 | # Reference 16 | I referred this YouTube video [tutorial]() to create this Board. 17 | 18 | # Star this Repo ⭐ 19 | # Made With Love❤ 20 | -------------------------------------------------------------------------------- /White Board/Online-WhiteBoard/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Online WhiteBoard 9 | 10 | 11 | 12 | 13 | 14 | 39 | 40 | 41 | 42 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /White Board/Online-WhiteBoard/online_Whiteboard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/White Board/Online-WhiteBoard/online_Whiteboard.png -------------------------------------------------------------------------------- /White Board/Online-WhiteBoard/script.js: -------------------------------------------------------------------------------- 1 | const ctx = document.getElementById('canvas').getContext('2d'); //creating a 2D canvas 2 | window.addEventListener('resize', resize); 3 | resize(); 4 | let mousePos = { //initially x and y position 5 | x:0, 6 | y:0 7 | } 8 | window.addEventListener('mousemove', draw); //to draw 9 | window.addEventListener('mousedown', mousePosition); 10 | window.addEventListener('mouseenter', mousePosition); 11 | 12 | function mousePosition(e) { //positioning the mouse as per client 13 | mousePos.x = e.clientX; 14 | mousePos.y = e.clientY; 15 | } 16 | 17 | function resize() { //canvas resize 18 | ctx.canvas.width = window.innerWidth; 19 | ctx.canvas.height = window.innerHeight; 20 | } 21 | 22 | function draw(e) { 23 | if(e.buttons !== 1) //is nothing is drawn then no response 24 | return; 25 | ctx.beginPath(); //to start 26 | ctx.lineCap = 'round'; //starting head of a line 27 | ctx.strokeStyle = '#111'; //black colour 28 | ctx.linewidth = '5'; 29 | ctx.moveTo(mousePos.x, mousePos.y); //to move the mouse n x and y psition 30 | mousePosition(e); 31 | ctx.lineTo(mousePos.x, mousePos.y); 32 | ctx.stroke(); //while pressing the mouse to draw 33 | } -------------------------------------------------------------------------------- /White Board/Online-WhiteBoard/style.css: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /abhijan/htm.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Abhi Web Design | Welcome 11 | 12 | 13 | 14 |
15 |
16 |

Abhi Web Design

17 |
18 | 25 |
26 |
27 |
28 |

Professional Web Design

29 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lobortis quam sed condimentum ornare.

30 |
31 |
32 |
33 |
34 |

Subscribe To Our Newsletter

35 |
36 | 37 | 38 |
39 |
40 |
41 |
42 |
43 |
44 | 45 |

HTML5 Markup

46 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lobortis quam sed condimentum ornare.

47 |
48 |
49 | 50 |

CSS3 Styling

51 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lobortis quam sed condimentum ornare.

52 |
53 |
54 | 55 |

Graphic Design

56 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lobortis quam sed condimentum ornare.

57 |
58 |
59 |
60 |
61 |

Abhi Web Design, Copyright © 2020

62 |
63 | 64 | 65 | -------------------------------------------------------------------------------- /abhijan/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 7 Soor 8 | 9 | 10 | 11 |

Saptak🎶

12 |

Feel the seven soors

13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 |
25 |

Saptak © Copyright Reserved

26 |
27 | 28 | 29 | -------------------------------------------------------------------------------- /abhijan/index.js: -------------------------------------------------------------------------------- 1 | var noOfKeys = document.querySelectorAll(".note").length; 2 | 3 | for (var i = 0; i < noOfKeys; i++) { 4 | document.querySelectorAll(".note")[i].addEventListener("click", function() { 5 | var buttonInnerHTML = this.innerHTML; 6 | makeSound(buttonInnerHTML); 7 | buttonAnimation(buttonInnerHTML); 8 | }); 9 | } 10 | document.addEventListener("keypress", function(event) { 11 | makeSound(event.key); 12 | buttonAnimation(event.key); 13 | }); 14 | 15 | function makeSound(key) { 16 | 17 | if(key=="sa" || key=="s"){ 18 | var tom1 = new Audio("sounds/sa.mp3"); 19 | tom1.play(); 20 | } 21 | 22 | else if(key=="re" || key=="d"){ 23 | var tom2 = new Audio("sounds/re.mp3"); 24 | tom2.play(); 25 | } 26 | 27 | else if(key=="ga" || key=="f"){ 28 | var tom3 = new Audio("sounds/ga.mp3"); 29 | tom3.play(); 30 | } 31 | 32 | else if(key=="ma" || key=="g"){ 33 | var tom4 = new Audio('sounds/ma.mp3'); 34 | tom4.play(); 35 | } 36 | 37 | else if(key=="pa" || key=="h"){ 38 | var snare = new Audio('sounds/pa.mp3'); 39 | snare.play(); 40 | } 41 | 42 | else if(key=="dha" || key=="j"){ 43 | var crash = new Audio('sounds/dha.mp3'); 44 | crash.play(); 45 | } 46 | 47 | else if(key=="ni" || key=="k"){ 48 | var kick = new Audio('sounds/ni.mp3'); 49 | kick.play(); 50 | } 51 | 52 | else if(key=="saa" || key=="l"){ 53 | var kick = new Audio('sounds/saa.mp3'); 54 | kick.play(); 55 | } 56 | else console.log(key); 57 | } 58 | 59 | function buttonAnimation(currentKey) { 60 | var activeButton = document.querySelector("." + currentKey); 61 | activeButton.classList.add("pressed"); 62 | setTimeout(function() { 63 | activeButton.classList.remove("pressed"); 64 | }, 100); 65 | } 66 | -------------------------------------------------------------------------------- /abhijan/styles.css: -------------------------------------------------------------------------------- 1 | body{ 2 | margin: 0; 3 | padding: 0; 4 | background: url("background.jpg") no-repeat; 5 | } 6 | 7 | h1{ 8 | font-size: 150px; 9 | color: azure; 10 | margin-top: 0px; 11 | margin-left: 30%; 12 | font-family: Old English Text MT; 13 | 14 | } 15 | 16 | p{ 17 | font-size: 20px; 18 | color: azure; 19 | font-family: Lucida Handwriting; 20 | margin-left: 48%; 21 | margin-top: -120px; 22 | } 23 | 24 | .container{ 25 | margin-top: 50px;; 26 | height: 200px; 27 | width: 90%; 28 | margin-left: 5%; 29 | display: flex; 30 | justify-content: space-around; 31 | } 32 | footer{ 33 | margin-top: 95px; 34 | height: 70px; 35 | width: 100%; 36 | background-color: rgb(19, 18, 18); 37 | font-size: 15px; 38 | color: azure; 39 | font-family: Times New Roman; 40 | text-align: center; 41 | padding-top: 15px; 42 | } 43 | 44 | .o{ 45 | width: 12%; 46 | background-color: black; 47 | color: white; 48 | font-size: 60px; 49 | } 50 | .e{ 51 | width: 12%; 52 | background-color: white; 53 | color: black; 54 | font-size: 60px; 55 | } 56 | 57 | .pressed { 58 | box-shadow: 0 3px 4px 0 #DBEDF3; 59 | opacity: 0.5; 60 | } 61 | -------------------------------------------------------------------------------- /arnab/arnab.html: -------------------------------------------------------------------------------- 1 |

Hello this is Arnab

2 | -------------------------------------------------------------------------------- /code-soham/README.md: -------------------------------------------------------------------------------- 1 | ## Disclaimer 2 | This site was generated from a React build so when run on localhost or 127.0.0.1/ , some functionality has not been properly inherited. 3 | To get the actual website please redirect to : 4 | https://code-soham.github.io/ 5 | or the repository : 6 | https://github.com/code-soham/code-soham.github.io/ -------------------------------------------------------------------------------- /code-soham/asset-manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "files": { 3 | "main.css": "/static/css/main.3e35f1d3.css", 4 | "main.js": "/static/js/main.a46eb33d.js", 5 | "static/js/787.0a7689f1.chunk.js": "/static/js/787.0a7689f1.chunk.js", 6 | "static/media/revicons.eot": "/static/media/revicons.a77de540a38981833f9e.eot", 7 | "static/media/revicons.ttf": "/static/media/revicons.57fd05d4ae650374c8de.ttf", 8 | "static/media/revicons.woff": "/static/media/revicons.e8746a624ed098489406.woff", 9 | "index.html": "/index.html", 10 | "main.3e35f1d3.css.map": "/static/css/main.3e35f1d3.css.map", 11 | "main.a46eb33d.js.map": "/static/js/main.a46eb33d.js.map", 12 | "787.0a7689f1.chunk.js.map": "/static/js/787.0a7689f1.chunk.js.map" 13 | }, 14 | "entrypoints": [ 15 | "static/css/main.3e35f1d3.css", 16 | "static/js/main.a46eb33d.js" 17 | ] 18 | } -------------------------------------------------------------------------------- /code-soham/assets/bg-st-stp.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/aws.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/c++.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/css3.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/gcp.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 11 | 13 | 16 | 18 | 21 | 22 | -------------------------------------------------------------------------------- /code-soham/assets/icons/git.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/github.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/heroku.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/html.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/js.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/mongodb.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/mui.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/assets/icons/mui.png -------------------------------------------------------------------------------- /code-soham/assets/icons/nodejs.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/office.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/postman.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/pp.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/python.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/reactjs.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/sparkar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/assets/icons/sparkar.png -------------------------------------------------------------------------------- /code-soham/assets/icons/sublime.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/assets/icons/tailwind.svg: -------------------------------------------------------------------------------- 1 | tailwind-css -------------------------------------------------------------------------------- /code-soham/assets/icons/vscode.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /code-soham/code-soham.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 18 | 22 | 23 | 24 | Portfolio 25 | 26 | 27 | 28 | 29 | 30 |
31 | 32 | 33 | -------------------------------------------------------------------------------- /code-soham/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/favicon.ico -------------------------------------------------------------------------------- /code-soham/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/logo192.png -------------------------------------------------------------------------------- /code-soham/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/logo512.png -------------------------------------------------------------------------------- /code-soham/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /code-soham/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /code-soham/static/js/787.0a7689f1.chunk.js: -------------------------------------------------------------------------------- 1 | "use strict";(self.webpackChunkcode_soham_github_io=self.webpackChunkcode_soham_github_io||[]).push([[787],{787:function(e,t,n){n.r(t),n.d(t,{getCLS:function(){return y},getFCP:function(){return h},getFID:function(){return C},getLCP:function(){return P},getTTFB:function(){return D}});var i,r,a,o,u=function(e,t){return{name:e,value:void 0===t?-1:t,delta:0,entries:[],id:"v2-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12)}},c=function(e,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){if("first-input"===e&&!("PerformanceEventTiming"in self))return;var n=new PerformanceObserver((function(e){return e.getEntries().map(t)}));return n.observe({type:e,buffered:!0}),n}}catch(e){}},f=function(e,t){var n=function n(i){"pagehide"!==i.type&&"hidden"!==document.visibilityState||(e(i),t&&(removeEventListener("visibilitychange",n,!0),removeEventListener("pagehide",n,!0)))};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},s=function(e){addEventListener("pageshow",(function(t){t.persisted&&e(t)}),!0)},m=function(e,t,n){var i;return function(r){t.value>=0&&(r||n)&&(t.delta=t.value-(i||0),(t.delta||void 0===i)&&(i=t.value,e(t)))}},v=-1,d=function(){return"hidden"===document.visibilityState?0:1/0},p=function(){f((function(e){var t=e.timeStamp;v=t}),!0)},l=function(){return v<0&&(v=d(),p(),s((function(){setTimeout((function(){v=d(),p()}),0)}))),{get firstHiddenTime(){return v}}},h=function(e,t){var n,i=l(),r=u("FCP"),a=function(e){"first-contentful-paint"===e.name&&(f&&f.disconnect(),e.startTime-1&&e(t)},r=u("CLS",0),a=0,o=[],v=function(e){if(!e.hadRecentInput){var t=o[0],i=o[o.length-1];a&&e.startTime-i.startTime<1e3&&e.startTime-t.startTime<5e3?(a+=e.value,o.push(e)):(a=e.value,o=[e]),a>r.value&&(r.value=a,r.entries=o,n())}},d=c("layout-shift",v);d&&(n=m(i,r,t),f((function(){d.takeRecords().map(v),n(!0)})),s((function(){a=0,T=-1,r=u("CLS",0),n=m(i,r,t)})))},E={passive:!0,capture:!0},w=new Date,L=function(e,t){i||(i=t,r=e,a=new Date,F(removeEventListener),S())},S=function(){if(r>=0&&r1e12?new Date:performance.now())-e.timeStamp;"pointerdown"==e.type?function(e,t){var n=function(){L(e,t),r()},i=function(){r()},r=function(){removeEventListener("pointerup",n,E),removeEventListener("pointercancel",i,E)};addEventListener("pointerup",n,E),addEventListener("pointercancel",i,E)}(t,e):L(t,e)}},F=function(e){["mousedown","keydown","touchstart","pointerdown"].forEach((function(t){return e(t,b,E)}))},C=function(e,t){var n,a=l(),v=u("FID"),d=function(e){e.startTimeperformance.now())return;n.entries=[t],e(n)}catch(e){}},"complete"===document.readyState?setTimeout(t,0):addEventListener("load",(function(){return setTimeout(t,0)}))}}}]); 2 | //# sourceMappingURL=787.0a7689f1.chunk.js.map -------------------------------------------------------------------------------- /code-soham/static/js/main.a46eb33d.js.LICENSE.txt: -------------------------------------------------------------------------------- 1 | /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ 2 | 3 | /** 4 | * @license React 5 | * react-dom.production.min.js 6 | * 7 | * Copyright (c) Facebook, Inc. and its affiliates. 8 | * 9 | * This source code is licensed under the MIT license found in the 10 | * LICENSE file in the root directory of this source tree. 11 | */ 12 | 13 | /** 14 | * @license React 15 | * react-jsx-runtime.production.min.js 16 | * 17 | * Copyright (c) Facebook, Inc. and its affiliates. 18 | * 19 | * This source code is licensed under the MIT license found in the 20 | * LICENSE file in the root directory of this source tree. 21 | */ 22 | 23 | /** 24 | * @license React 25 | * react.production.min.js 26 | * 27 | * Copyright (c) Facebook, Inc. and its affiliates. 28 | * 29 | * This source code is licensed under the MIT license found in the 30 | * LICENSE file in the root directory of this source tree. 31 | */ 32 | 33 | /** 34 | * @license React 35 | * scheduler.production.min.js 36 | * 37 | * Copyright (c) Facebook, Inc. and its affiliates. 38 | * 39 | * This source code is licensed under the MIT license found in the 40 | * LICENSE file in the root directory of this source tree. 41 | */ 42 | -------------------------------------------------------------------------------- /code-soham/static/media/revicons.57fd05d4ae650374c8de.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/static/media/revicons.57fd05d4ae650374c8de.ttf -------------------------------------------------------------------------------- /code-soham/static/media/revicons.a77de540a38981833f9e.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/static/media/revicons.a77de540a38981833f9e.eot -------------------------------------------------------------------------------- /code-soham/static/media/revicons.e8746a624ed098489406.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SCCSEAOT/showcase-your-webpage/622b9852d09f8cfe3a931955488b4b3a68a1a7b1/code-soham/static/media/revicons.e8746a624ed098489406.woff -------------------------------------------------------------------------------- /gitnandini/landing_page.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Freshos Landing Page 8 | 51 | 52 | 53 |
54 | 63 |
64 |
65 |

Welcome to FRESHOS

66 |

Fresh groceries at reasonable price are just a click away ! 67 | Order Now 68 | 69 |

70 |
71 | 72 | 73 | -------------------------------------------------------------------------------- /libinmv_resume/src/resume.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: 'Times New Roman'; 3 | font-size: 12pt; 4 | background-color: rgb(255, 255, 255); 5 | color: black; 6 | } 7 | 8 | .dark-mode { 9 | background-color: rgb(26, 26, 26); 10 | color: rgb(195, 194, 194) !important; 11 | } 12 | 13 | a:link { 14 | text-decoration: none; 15 | } 16 | 17 | .link_unset { 18 | all: unset; 19 | cursor: pointer; 20 | } 21 | 22 | .no-margin { 23 | margin: 0; 24 | } 25 | 26 | a:hover { 27 | color: rgb(141, 68, 243) !important; 28 | } 29 | 30 | i { 31 | width: 22px; 32 | height: 36px; 33 | margin-top: 2px; 34 | justify-content: end; 35 | } 36 | 37 | 38 | .dark-icon:hover { 39 | cursor: pointer; 40 | color: rgb(127, 127, 127); 41 | } 42 | 43 | .light-icon:hover { 44 | cursor: pointer; 45 | color: rgb(255, 174, 35); 46 | } 47 | -------------------------------------------------------------------------------- /libinmv_resume/src/resume.js: -------------------------------------------------------------------------------- 1 | var themeFlag = 0; //0 for light and 1 for dark theme 2 | function toggleDark() { 3 | var element = document.body; 4 | element.classList.toggle("dark-mode"); 5 | } 6 | function toggleTheme(x) { 7 | if (themeFlag == 0) { 8 | x.innerHTML = ` 9 | wb_sunny 10 | `; 11 | themeFlag = 1; 12 | } 13 | else { 14 | x.innerHTML = ` 15 | dark_mode 16 | `; 17 | themeFlag = 0; 18 | } 19 | 20 | } 21 | -------------------------------------------------------------------------------- /portfolio_webpage/portfolio.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | portfolio website 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 24 | 25 |
26 |

I'm NANDINI

27 |

This is my official portfolio website to show all 28 |
details and projects on web developments. 29 |

30 | 31 | GO TO PROJECTS 32 |
33 |
34 | 35 | 36 |
37 |
38 | 39 | -------------------------------------------------------------------------------- /portfolio_webpage/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | font-family: sans-serif; 5 | } 6 | 7 | .hero{ 8 | position: relative; 9 | width: 100%; 10 | height: 100vh; 11 | background: honeydew; 12 | 13 | } 14 | 15 | nav{ 16 | display: flex; 17 | width: 80%; 18 | margin: auto; 19 | padding: 20px 0; 20 | align-items: center; 21 | justify-content: space-between; 22 | 23 | } 24 | 25 | nav ul li{ 26 | display: inline-block; 27 | list-style: none; 28 | margin: 10px 20px; 29 | 30 | } 31 | 32 | nav ul li a{ 33 | text-decoration: none; 34 | color:black; 35 | font-weight: bold; 36 | 37 | } 38 | nav ul li a:hover{ 39 | color: red; 40 | 41 | } 42 | 43 | .detel{ 44 | margin-left: 0%; 45 | margin: 15%; 46 | 47 | } 48 | .detel h1{ 49 | font-size: 50px; 50 | color: black; 51 | margin-bottom: 20px; 52 | 53 | } 54 | 55 | span{ 56 | color:orange; 57 | 58 | } 59 | 60 | .detel p{ 61 | color: grey; 62 | padding: 10px 10px; 63 | text-decoration: none; 64 | font-weight: bold; 65 | color: rgb(85, 74, 74); 66 | display: inline-block; 67 | margin: 30px 0px; 68 | border-radius: 5px; 69 | } 70 | 71 | .images{ 72 | width: 1000px; 73 | height: 1000px; 74 | position: absolute; 75 | justify-content: center; 76 | height: 100px; 77 | 78 | } 79 | 80 | .images img{ 81 | height: 700px; 82 | position: absolute; 83 | left: 80%; 84 | bottom: 0; 85 | } -------------------------------------------------------------------------------- /profile.html: -------------------------------------------------------------------------------- 1 |

DEMO

2 | 3 | 4 | srijan 5 | -------------------------------------------------------------------------------- /signup_page/signup.css: -------------------------------------------------------------------------------- 1 | 2 | body 3 | { 4 | display: grid; 5 | place-items: center; 6 | height: 104vh; 7 | background: linear-gradient( #8942a8, #ba382f); 8 | } 9 | .circle 10 | { 11 | height: 250px; 12 | width: 250px; 13 | border-radius: 50%; 14 | position: absolute; 15 | top: 5%; 16 | left: 25%; 17 | background: radial-gradient(#ffffffca,#9C27B0 70%); 18 | box-shadow: 2px 2px 5px rgba(0, 0, 0, 9.15); 19 | z-index: 998; 20 | } 21 | .circle2 22 | { 23 | top: 70%; 24 | left: 55%; 25 | background: radial-gradient(#ffffffca,#E91E63 70%); 26 | } 27 | #container 28 | { 29 | height: 510px; 30 | width: 400px; 31 | position: relative; 32 | padding: 30px; 33 | border-radius: 30px; 34 | background: linear-gradient(30deg,rgba(255,255,255,0.1),rgba(255,255,255,0.4)); 35 | backdrop-filter: blur(20px); 36 | border: 1px solid rgba(255,255,255,0.9); 37 | border-right: 1px solid rgba(255,255,255,0.5); 38 | border-bottom: 1px solid rgba(255,255,255,0.5); 39 | z-index: 999; 40 | } 41 | #container h2 42 | { 43 | font-size: 55px; 44 | margin: 30px 0; 45 | color: #fff; 46 | text-shadow: 1px 1px 2px #E91e63; 47 | } 48 | #container .name 49 | { 50 | width: 49.4%; 51 | } 52 | #container input 53 | { 54 | height: 43px; 55 | width: 90%; 56 | border: none; 57 | outline: none; 58 | background: linear-gradient(to top,rgba(255,255,255,0.1),rgba(255,255,255,0.3)); 59 | border: 1px solid rgba(255,255,255,0.4); 60 | border-right: 1px solid rgba(255,255,255,0.3); 61 | border-bottom: 1px solid rgba(255,255,255,0.3); 62 | margin: 8px 0; 63 | padding: 0 20px; 64 | font-size: 18px; 65 | border-radius: 7px; 66 | color: #fff; 67 | text-shadow: 1px 1px 1px #000; 68 | } 69 | #container input::placeholder 70 | { 71 | color: #ffffff; 72 | } 73 | 74 | #container input[type="submit"] 75 | { 76 | background: #e6336f; 77 | color: #fff; 78 | font-size: 22px; 79 | cursor: pointer; 80 | border: none; 81 | box-shadow: none; 82 | } 83 | #container p 84 | { 85 | font-size: 20px; 86 | margin: 17px 0; 87 | color: #fff; 88 | } 89 | #container p a 90 | { 91 | text-decoration: none; 92 | color: #fff; 93 | font-weight: bold; 94 | font-size: 21px; 95 | } 96 | 97 | .box-area { 98 | position: absolute; 99 | top: 0; 100 | left: 0; 101 | width: 100%; 102 | height: 100%; 103 | overflow: hidden; 104 | } 105 | .box-area li { 106 | position: absolute; 107 | display: block; 108 | list-style: none; 109 | width: 25px; 110 | height: 25px; 111 | background: rgba(255, 255, 255, 0.2); 112 | animation: animate 20s linear infinite; 113 | bottom: -150px; 114 | } 115 | .box-area li:nth-child(1) { 116 | left: 86%; 117 | width: 80px; 118 | height: 80px; 119 | animation-delay: 0s; 120 | } 121 | .box-area li:nth-child(2) { 122 | left: 12%; 123 | width: 30px; 124 | height: 30px; 125 | animation-delay: 1.5s; 126 | animation-duration: 9s; 127 | } 128 | .box-area li:nth-child(3) { 129 | left: 70%; 130 | width: 100px; 131 | height: 100px; 132 | animation-delay: 5.5s; 133 | } 134 | .box-area li:nth-child(4) { 135 | left: 42%; 136 | width: 150px; 137 | height: 150px; 138 | animation-delay: 0s; 139 | animation-duration: 15s; 140 | } 141 | .box-area li:nth-child(5) { 142 | left: 65%; 143 | width: 40px; 144 | height: 40px; 145 | animation-delay: 0s; 146 | } 147 | .box-area li:nth-child(6) { 148 | left: 15%; 149 | width: 110px; 150 | height: 110px; 151 | animation-delay: 3.5s; 152 | } 153 | .box-area li:nth-child(7) { 154 | left: 30%; 155 | width: 80px; 156 | height: 80px; 157 | animation-delay: 2.5s; 158 | } 159 | 160 | @keyframes animate { 161 | 0% { 162 | transform: translateY(0) rotate(0deg); 163 | opacity: 1; 164 | } 165 | 100% { 166 | transform: translateY(-800px) rotate(360deg); 167 | opacity: 0; 168 | } 169 | } -------------------------------------------------------------------------------- /signup_page/signup.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Sign Up Form 8 | 9 | 10 | 11 | 12 |
13 |
14 | 15 | 16 |
17 |
18 | 19 |

Sign Up

20 | 21 |
22 |
23 |
24 |
25 | 26 |

Already have a account? Login

27 |
28 |
29 | 30 |
    31 |
  • 32 |
  • 33 |
  • 34 |
  • 35 |
  • 36 |
  • 37 |
  • 38 |
39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /sulagna/index.html: -------------------------------------------------------------------------------- 1 | < 2 | 3 | 4 | 5 | 6 | 7 | GfG 8 | 9 | 10 |
11 |
12 | Personal Details 13 | 14 | 15 |

16 | 28 |

29 | 30 | 31 | 32 | 33 |

34 | 35 |

36 | 37 | 38 | 39 | 40 |

41 | 42 |

43 | 44 | 45 | 46 | 47 |

48 | Gender : 49 | 50 | 51 |

52 | 53 | 54 | 55 | 56 |

57 | 58 |

59 | 60 | 61 | 62 | 63 |

64 | 65 |

66 | 67 | 68 | 69 | 70 |

71 | 76 |

77 | 78 | 79 | 80 | 81 |

82 | 83 |

84 | 85 | 86 |
87 |
88 | 89 | 90 | --------------------------------------------------------------------------------