├── .DS_Store ├── .idea ├── .gitignore ├── Front-end-Development-Tutorial.iml ├── modules.xml └── vcs.xml ├── .vscode └── settings.json ├── BootStrap-Tutorial ├── .DS_Store ├── 01 Grid system │ ├── 01 Example │ │ ├── ContainerExample.html │ │ └── row_col.html │ └── index.html ├── 02 Navbar │ ├── DesignNov.html │ ├── Nav.html │ ├── NavBar.html │ ├── css │ │ └── style.css │ └── img │ │ ├── logo.png │ │ ├── mysql.png │ │ └── vegetable.png ├── 03 Card │ ├── DarkCard.html │ ├── ProductCard.html │ ├── ProductDesign.html │ ├── card.html │ ├── card09.html │ ├── card1.html │ └── img │ │ ├── logo.png │ │ ├── mushrooms.png │ │ ├── samosa (2).png │ │ ├── samosa.png │ │ └── vegetable.png ├── 03 Modal │ ├── BooksStore.html │ ├── Modal-03.html │ ├── Modal-img.html │ ├── Modal-login-form.html │ ├── Modal1.html │ ├── Modal2.html │ ├── ProductCard.html │ └── img │ │ └── logo.jpg ├── 04 Accordion │ ├── Accordion.html │ ├── Accordion1.html │ ├── aboutus.html │ ├── img │ │ ├── logo.png │ │ ├── mushrooms.png │ │ ├── samosa (2).png │ │ ├── samosa.png │ │ └── vegetable.png │ └── index.html ├── 05 Offcanvas │ ├── Offcanvas.html │ ├── Offcanvas1.html │ ├── SideMenu.html │ ├── img │ │ ├── logo.png │ │ ├── mushrooms.png │ │ ├── mysql.png │ │ ├── samosa (2).png │ │ ├── samosa.png │ │ └── vegetable.png │ └── index1.html ├── 06 Carousel │ ├── Carousel-card-nav │ │ ├── img │ │ │ ├── logo.png │ │ │ ├── p1.jpg │ │ │ ├── p2.jpg │ │ │ ├── p3.jpg │ │ │ └── samosa.png │ │ └── index.html │ ├── CarouselExample.html │ ├── Darkvariant.html │ ├── aboutus.html │ ├── carousels.html │ ├── img │ │ ├── logo.png │ │ ├── mushrooms.png │ │ ├── p1.jpg │ │ ├── p2.jpg │ │ ├── p3.jpg │ │ ├── samosa (2).png │ │ ├── samosa.png │ │ └── vegetable.png │ └── index1.html ├── 07 Collapse │ ├── aboutus.html │ ├── img │ │ ├── logo.png │ │ ├── mushrooms.png │ │ ├── p1.jpg │ │ ├── p2.jpg │ │ ├── p3.jpg │ │ ├── samosa (2).png │ │ ├── samosa.png │ │ └── vegetable.png │ └── index.html ├── Project │ ├── Idea Point │ │ ├── README.md │ │ ├── image │ │ │ └── idea.png │ │ └── index.html │ ├── Joy-food-Point │ │ ├── Container.html │ │ ├── column.html │ │ ├── css │ │ │ └── style.css │ │ ├── img │ │ │ └── logo.png │ │ └── nav_bar.html │ ├── Samosa Point │ │ ├── aboutus.html │ │ ├── css │ │ │ └── style.css │ │ ├── img │ │ │ ├── samosa-1.png │ │ │ └── samosa.png │ │ └── index.html │ ├── Samosa Point1 │ │ ├── README.md │ │ ├── css │ │ │ └── style.css │ │ ├── image │ │ │ ├── 01.jpg │ │ │ ├── 02.jpg │ │ │ ├── 03.jpg │ │ │ ├── diet.png │ │ │ ├── fast-food.png │ │ │ ├── healthy-food.png │ │ │ ├── samosa.png │ │ │ └── vegetables.png │ │ └── index.html │ └── Techno-Hub │ │ ├── contactus.html │ │ ├── css │ │ └── style.css │ │ ├── img │ │ ├── i1.jpg │ │ ├── i2.jpg │ │ ├── i3.jpg │ │ └── techno.png │ │ ├── index.html │ │ └── service.html ├── Sample-Website │ ├── aboutus.html │ ├── img │ │ ├── logo.png │ │ ├── p1.jpg │ │ ├── p2.jpg │ │ ├── p3.jpg │ │ └── samosa.png │ └── index.html ├── Testimonials │ └── index.html ├── accordion-01 │ ├── assets │ │ ├── minus.svg │ │ └── plus.svg │ ├── index.html │ ├── script.js │ └── style.css ├── cards-05 │ ├── assets │ │ ├── balcony-appartment.jpg │ │ ├── lakeview-elegance.png │ │ ├── skyline-oasis.png │ │ └── vista-paradiso.png │ ├── index.html │ └── style.css ├── flip image │ ├── flip_image.html │ ├── img │ │ ├── samosa.png │ │ └── vegetable.png │ └── index.html └── form │ ├── Login.html │ └── SignUp.html ├── HTML-CSS ├── 00 Header Section │ ├── css │ │ └── style.css │ ├── img │ │ └── samosa (2).png │ └── index.html ├── 01 Day │ ├── Project00 │ │ └── index.html │ └── Project01 │ │ ├── Blue.html │ │ ├── Green.html │ │ ├── Pink.html │ │ ├── Red.html │ │ └── Yellow.html ├── 02 Day │ └── Example 01 │ │ ├── css │ │ └── style.css │ │ ├── index.html │ │ ├── pink.html │ │ └── yellow.html ├── 03 Table │ ├── README.md │ └── table.html ├── 04 hiperlink │ ├── index.html │ └── welcome.html ├── 05 List │ ├── README.md │ └── list.html ├── 06 Forms │ ├── Contact Form.html │ ├── forms.html │ └── login.html ├── 07 CSS outline │ └── index.html ├── Animation │ └── README.md ├── Basic.md ├── Example │ ├── Oct 19 2024 Part 2 │ │ ├── blue.html │ │ ├── green.html │ │ ├── index.html │ │ └── pink.html │ ├── Oct 19 2024 │ │ └── index.html │ ├── Oct 24 2024 Part 2 │ │ ├── contact.html │ │ ├── form.html │ │ └── image │ │ │ ├── OIP.jpeg │ │ │ └── rectangle.png │ ├── Oct 24 2024 │ │ ├── image │ │ │ └── rectangle.png │ │ └── index.html │ ├── htmltag.html │ └── index.html ├── HTML Attributes.md ├── Image Carousel │ ├── css │ │ └── style.css │ ├── index.html │ └── js │ │ └── script.js └── Project │ ├── BookStore │ ├── css │ │ └── style.css │ ├── img │ │ └── books.png │ └── index.html │ ├── Chess board │ ├── css │ │ └── style.css │ └── index.html │ ├── ColorBox │ ├── blue.html │ ├── css │ │ └── style.css │ ├── green.html │ ├── index.html │ ├── orange.html │ ├── purple.html │ └── red.html │ ├── FoodStore │ ├── Aboutus.html │ ├── contactus.html │ ├── css │ │ └── style.css │ ├── img │ │ ├── banner.png │ │ ├── burger.png │ │ ├── cutlery.png │ │ ├── diet.png │ │ ├── fast-food-2.png │ │ ├── fast-food.png │ │ ├── fork.png │ │ ├── grapes.png │ │ ├── ramen.png │ │ └── vegetable.png │ ├── index.html │ ├── shop.html │ └── typefood.html │ ├── Image_views │ ├── css │ │ └── style.css │ ├── image1.html │ ├── image2.html │ ├── image3.html │ ├── image4.html │ ├── image5.html │ ├── img │ │ ├── cinema.png │ │ ├── lion.png │ │ ├── man.png │ │ ├── mushrooms.png │ │ ├── penguin.png │ │ └── vegetable.png │ └── index.html │ ├── Joy Books Store │ ├── conatct.html │ ├── css │ │ └── style.css │ ├── image │ │ ├── books-2.png │ │ ├── books.png │ │ ├── e-book.png │ │ ├── light-bulb.png │ │ ├── open-book.png │ │ └── reading.png │ ├── index.html │ └── shop.html │ ├── Joy Toy Store │ ├── css │ │ └── p4n.css │ ├── image │ │ └── rocking-horse.png │ └── index.html │ ├── Ludo │ ├── css │ │ └── style.css │ └── index.html │ ├── MobileStore │ ├── contactus.html │ ├── css │ │ └── style.css │ ├── images │ │ ├── logo.png │ │ └── mobile.webp │ └── index.html │ ├── Product_view │ ├── img │ │ └── samosa.png │ └── index.html │ ├── README.md │ ├── SamosaPoint │ ├── Contact.html │ ├── css │ │ └── style.css │ ├── img │ │ ├── burger.png │ │ ├── diet.png │ │ ├── fast-food-2.png │ │ ├── grapes.png │ │ ├── ramen.png │ │ ├── samosa-bg.png │ │ ├── samosa-bg1.png │ │ ├── samosa.png │ │ ├── shopping-cart.png │ │ └── vegetable.png │ └── index.html │ ├── VideoPlayer │ ├── css │ │ └── p4n.css │ ├── img │ │ ├── heart.png │ │ ├── leonardo.png │ │ └── like.png │ └── index.html │ └── p4n │ ├── css │ └── p4n.css │ ├── index.html │ └── js │ └── scripts.js ├── JQuery ├── Animation │ ├── Animation.html │ ├── Animation1.html │ ├── Animation2.html │ ├── StopAnimation.html │ └── StopAnimation1.html ├── Callback-Chaining │ ├── CallBack.html │ ├── CallBack1.html │ └── Chaining.html ├── Flip │ └── jQueryFlip.html ├── Get Content and Attributes │ ├── Example1.html │ ├── Example2.html │ └── img │ │ └── logo.jpg ├── HideShow │ ├── EffectsFading.html │ ├── Fading.html │ └── HideShow.html ├── Set Content and Attributes │ └── Example.html ├── Sliding │ ├── SlidingEffects.html │ └── css │ │ └── Style.css └── fade │ └── fade.html ├── JavaScript ├── 01 Day Basic │ ├── Basic Internal.html │ ├── Basic.js │ ├── CWPWelcome.html │ ├── README.md │ ├── Variable Internal.html │ └── Variable.js ├── 02 Day Operator │ ├── Operator.html │ ├── Operator1.html │ ├── Operators │ │ ├── ArithmeticOperators.html │ │ ├── AssignmentOperators.html │ │ └── ComparisonOperators.html │ ├── README.md │ └── ReadDataFromTextBox.html ├── 04 Day Function │ ├── Example │ │ ├── Function.js │ │ └── index.html │ ├── Function │ │ ├── function.html │ │ └── function.js │ └── README.md ├── 05 Day Objects │ └── README.md ├── 06 Day Events │ ├── Events.html │ ├── GST_Cal.html │ ├── LoginExample │ │ ├── Login.html │ │ ├── Welcome.html │ │ ├── css │ │ │ └── Style.css │ │ └── js │ │ │ └── loginfun.js │ └── README.md ├── 08 Day String Methods │ └── README.md ├── 09 Day Numbers │ └── README.md ├── 10 Day Array │ ├── Array.js │ ├── Array_Example.html │ ├── README.md │ └── index1.html ├── 11 Day Date │ ├── Date.html │ ├── DateExample.html │ └── README.md ├── 12 Day Math │ └── README.md ├── 13 Day If Else │ ├── README.md │ └── ifelse.html ├── 14 Day Switch │ └── README.md ├── 15 Day Loop │ ├── ForLoop.html │ ├── Loop.html │ ├── README.md │ └── Whileloop.html ├── 16 Day Sets │ └── README.md ├── Example │ ├── MCQ.html │ └── cal.html ├── Questions │ └── README.md └── README.md ├── MySQL ├── Dummy_DataBase.sql ├── MySQLCWP.sql └── cwp.sql ├── README.md └── UI-Design ├── Animated Glowing Radial Menu ├── css │ └── styles.css ├── index.html └── js │ └── script.js ├── Interactive Card Effect ├── image │ ├── shoes01.png │ ├── shoes02.jpg │ ├── shoes03.avif │ └── shoes04.webp ├── index.html └── p4n.css ├── Magic Bottom Menu ├── css │ └── style.css ├── index.html └── js │ └── script.js ├── Product Cards ├── index.html ├── multiplecard.html └── p4n.css ├── chess board Design ├── css │ └── style.css └── index.html ├── chessboard design └── index.html ├── dropdown-menu-1 ├── index.html └── style.css └── vertical tabs ├── index.html ├── script.js └── style.css /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/.DS_Store -------------------------------------------------------------------------------- /.idea/.gitignore: -------------------------------------------------------------------------------- 1 | # Default ignored files 2 | /shelf/ 3 | /workspace.xml 4 | # Editor-based HTTP Client requests 5 | /httpRequests/ 6 | -------------------------------------------------------------------------------- /.idea/Front-end-Development-Tutorial.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5502 3 | } -------------------------------------------------------------------------------- /BootStrap-Tutorial/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/.DS_Store -------------------------------------------------------------------------------- /BootStrap-Tutorial/01 Grid system/01 Example/ContainerExample.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 |

17 | Bootstrap’s grid system uses a series of containers, rows, and columns to layout and align content. It’s built with flexbox and is fully responsive. Below is an example and an in-depth explanation for how the grid system comes together. 18 |

19 | 20 |
21 | 22 | 23 |
24 | 25 |

26 | Bootstrap’s grid system uses a series of containers, rows, and columns to layout and align content. It’s built with flexbox and is fully responsive. Below is an example and an in-depth explanation for how the grid system comes together. 27 |

28 | 29 |
30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/Nav.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/NavBar.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/css/style.css: -------------------------------------------------------------------------------- 1 | .navbar_toggler_icon_color{ 2 | background-color: white; 3 | } -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/02 Navbar/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/img/mysql.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/02 Navbar/img/mysql.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/02 Navbar/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/02 Navbar/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Card/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Card/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Card/img/mushrooms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Card/img/mushrooms.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Card/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Card/img/samosa (2).png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Card/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Card/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Card/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Card/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Modal/Modal-03.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 17 | 18 | 41 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Modal/Modal-img.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 21 | 22 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Modal/Modal-login-form.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 16 | 17 | 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Modal/Modal1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 15 | 16 | 17 | 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/03 Modal/img/logo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/03 Modal/img/logo.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/04 Accordion/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/04 Accordion/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/04 Accordion/img/mushrooms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/04 Accordion/img/mushrooms.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/04 Accordion/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/04 Accordion/img/samosa (2).png -------------------------------------------------------------------------------- /BootStrap-Tutorial/04 Accordion/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/04 Accordion/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/04 Accordion/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/04 Accordion/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/SideMenu.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/mushrooms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/mushrooms.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/mysql.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/mysql.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/samosa (2).png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/05 Offcanvas/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/05 Offcanvas/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p1.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p2.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/p3.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/Carousel-card-nav/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/CarouselExample.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 36 | 37 | 38 | 39 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/mushrooms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/mushrooms.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/p1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/p1.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/p2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/p2.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/p3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/p3.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/samosa (2).png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/06 Carousel/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/06 Carousel/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/mushrooms.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/mushrooms.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/p1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/p1.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/p2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/p2.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/p3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/p3.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/samosa (2).png -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/07 Collapse/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/07 Collapse/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Idea Point/README.md: -------------------------------------------------------------------------------- 1 | # IDEA 2 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Idea Point/image/idea.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Idea Point/image/idea.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Joy-food-Point/Container.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 |
13 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Odit harum omnis inventore, explicabo tempora voluptatem tempore est assumenda libero expedita, cupiditate in alias quasi ea nisi tenetur animi voluptate soluta.

14 |
15 | 16 | 17 |
18 |

19 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet quos maiores doloribus ipsam voluptatem, soluta debitis nobis facilis porro atque dicta? Laborum, deserunt nisi tenetur maiores recusandae voluptatum assumenda accusamus! 20 |

21 |
22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Joy-food-Point/column.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 |
15 |
16 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore tempora praesentium maxime dicta! Quo, quidem placeat non eligendi illo aliquid cum iure officia ad aspernatur, animi sit error magnam saepe. 17 |
18 |
19 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore tempora praesentium maxime dicta! Quo, quidem placeat non eligendi illo aliquid cum iure officia ad aspernatur, animi sit error magnam saepe. 20 |
21 |
22 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore tempora praesentium maxime dicta! Quo, quidem placeat non eligendi illo aliquid cum iure officia ad aspernatur, animi sit error magnam saepe. 23 |
24 | 25 |
26 | 27 |
28 |
29 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore tempora praesentium maxime dicta! Quo, quidem placeat non eligendi illo aliquid cum iure officia ad aspernatur, animi sit error magnam saepe. 30 |
31 |
32 | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore tempora praesentium maxime dicta! Quo, quidem placeat non eligendi illo aliquid cum iure officia ad aspernatur, animi sit error magnam saepe. 33 |
34 | 35 |
36 | 37 |
38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Joy-food-Point/css/style.css: -------------------------------------------------------------------------------- 1 | .theme_color{ 2 | background-color: #FFBD7B; 3 | } -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Joy-food-Point/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Joy-food-Point/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Joy-food-Point/nav_bar.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point/css/style.css: -------------------------------------------------------------------------------- 1 | .menu_item{ 2 | background-color: #FFAF22; 3 | border: solid 2px #fa9e00; 4 | } -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point/img/samosa-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point/img/samosa-1.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/README.md: -------------------------------------------------------------------------------- 1 | #foods 2 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/css/style.css: -------------------------------------------------------------------------------- 1 | .samosa_color{ 2 | /* background-color: #F9D787; */ 3 | color: #332400; 4 | } 5 | .menu_shadow{ 6 | 7 | box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; 8 | } -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/01.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/02.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/03.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/diet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/diet.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/fast-food.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/fast-food.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/healthy-food.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/healthy-food.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Samosa Point1/image/vegetables.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Samosa Point1/image/vegetables.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Techno-Hub/css/style.css: -------------------------------------------------------------------------------- 1 | 2 | .darken-image { 3 | filter: brightness(60%); 4 | } 5 | .center_text{ 6 | top: 50%; 7 | transform: translateY(-50%); 8 | } 9 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Techno-Hub/img/i1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Techno-Hub/img/i1.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Techno-Hub/img/i2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Techno-Hub/img/i2.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Techno-Hub/img/i3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Techno-Hub/img/i3.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Project/Techno-Hub/img/techno.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Project/Techno-Hub/img/techno.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Sample-Website/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Sample-Website/img/logo.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/Sample-Website/img/p1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Sample-Website/img/p1.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Sample-Website/img/p2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Sample-Website/img/p2.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Sample-Website/img/p3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Sample-Website/img/p3.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/Sample-Website/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/Sample-Website/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/accordion-01/assets/minus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/accordion-01/assets/plus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/accordion-01/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Mulish&display=swap'); 2 | 3 | html { 4 | font-size: 16px; 5 | font-family: "Mulish"; 6 | } 7 | 8 | body { 9 | background: white; 10 | height: 100%; 11 | } 12 | 13 | * { 14 | box-sizing: border-box; 15 | } 16 | 17 | .faq-container { 18 | display: flex; 19 | flex-direction: column; 20 | gap: 16px; 21 | margin-top: 12em; 22 | } 23 | 24 | details { 25 | font-size: 1rem; 26 | margin: 0 auto; 27 | width: 100%; 28 | background: #F6FAFF; 29 | border-radius: 8px; 30 | position: relative; 31 | max-width: 600px; 32 | border: 1px solid #C3DEFF; 33 | transition: all 0.3s ease-in-out; 34 | } 35 | 36 | details:hover { 37 | border: 1px solid #A4A1FF; 38 | } 39 | 40 | 41 | summary { 42 | user-select: none; 43 | cursor: pointer; 44 | font-weight: 600; 45 | display: flex; 46 | list-style: none; 47 | padding: 1em; 48 | align-items: center; 49 | } 50 | 51 | summary:hover .faq-title { 52 | opacity: 1; 53 | } 54 | 55 | summary::-webkit-details-marker { 56 | display: none; 57 | } 58 | 59 | summary:focus { 60 | outline: none; 61 | } 62 | 63 | summary:hover .expand-icon { 64 | opacity: 1; 65 | } 66 | 67 | .faq-title { 68 | color: #1C2035; 69 | width: 90%; 70 | opacity: 0.65; 71 | transition: all 250ms ease-in-out; 72 | } 73 | 74 | .faq-content { 75 | color: #303651; 76 | padding: 0.2em 1em 1em 1em; 77 | font-weight: 300; 78 | line-height: 1.5; 79 | } 80 | 81 | .expand-icon { 82 | opacity: 0.65; 83 | } 84 | 85 | .expand-icon { 86 | pointer-events: none; 87 | position: absolute; 88 | right: 1em; 89 | transition: all 150ms ease-out; 90 | } 91 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/cards-05/assets/balcony-appartment.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/cards-05/assets/balcony-appartment.jpg -------------------------------------------------------------------------------- /BootStrap-Tutorial/cards-05/assets/lakeview-elegance.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/cards-05/assets/lakeview-elegance.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/cards-05/assets/skyline-oasis.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/cards-05/assets/skyline-oasis.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/cards-05/assets/vista-paradiso.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/cards-05/assets/vista-paradiso.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/flip image/flip_image.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 | 22 | Front Image 23 |
24 |
25 | 26 | Back Image 27 |
28 |
29 |
30 |
31 |
32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/flip image/img/samosa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/flip image/img/samosa.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/flip image/img/vegetable.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/BootStrap-Tutorial/flip image/img/vegetable.png -------------------------------------------------------------------------------- /BootStrap-Tutorial/flip image/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 38 | 39 | 40 | 41 |
42 |
43 |
44 |
45 |
46 |
47 | 48 | Front Image 49 |
50 |
51 | 52 | Back Image 53 |
54 |
55 |
56 |
57 |
58 |
59 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /BootStrap-Tutorial/form/Login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 9 | 12 | 13 | 14 | 15 | 16 |
17 |
18 |
19 |

Login Now !

20 |
21 | 22 | 23 |
24 |
25 | 26 | 27 |
28 |
29 | SignUP 30 | Login 31 |
32 |
33 |
34 |
35 | 36 | -------------------------------------------------------------------------------- /HTML-CSS/00 Header Section/css/style.css: -------------------------------------------------------------------------------- 1 | .header{ 2 | height: 100px; 3 | width: 1200px; 4 | /* background-color: antiquewhite; */ 5 | border: solid 0px black; 6 | margin: auto; 7 | } 8 | 9 | ul{ 10 | list-style: none; 11 | float: left; 12 | } 13 | li{ 14 | border: solid 1px black; 15 | float: left; 16 | padding-top: 10px; 17 | padding-left: 15px; 18 | padding-right: 15px; 19 | padding-bottom: 10px; 20 | margin-left: 18px; 21 | font-family: Arial, Helvetica, sans-serif; 22 | font-size: 18px; 23 | border-radius: 50px; 24 | background-color: black; 25 | color: wheat; 26 | } 27 | .logo{ 28 | float: left; 29 | padding-top: 16px; 30 | margin-left: 20px; 31 | } -------------------------------------------------------------------------------- /HTML-CSS/00 Header Section/img/samosa (2).png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Pankaj-Str/Front-end-Development-Tutorial/4f23f30e3e8fc04fdbbab9dc678894dab3ed9925/HTML-CSS/00 Header Section/img/samosa (2).png -------------------------------------------------------------------------------- /HTML-CSS/00 Header Section/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 | 12 | 19 |
20 | 21 | -------------------------------------------------------------------------------- /HTML-CSS/01 Day/Project01/Blue.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /HTML-CSS/01 Day/Project01/Green.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /HTML-CSS/01 Day/Project01/Pink.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /HTML-CSS/01 Day/Project01/Red.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /HTML-CSS/01 Day/Project01/Yellow.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /HTML-CSS/02 Day/Example 01/css/style.css: -------------------------------------------------------------------------------- 1 | .box{ 2 | width: 100px; 3 | height: 80px; 4 | border: solid 3px #000; 5 | text-align: center; 6 | font-size: 50px; 7 | padding-top: 20px; 8 | font-family: Arial, Helvetica, sans-serif; 9 | float: left; 10 | margin: 20px; 11 | border-radius: 50px; 12 | } 13 | 14 | .yellow{ 15 | background-color: yellow; 16 | } 17 | .pink{ 18 | background-color: pink; 19 | } 20 | .green{ 21 | background-color: green; 22 | } 23 | 24 | 25 | -------------------------------------------------------------------------------- /HTML-CSS/02 Day/Example 01/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 |
1
13 |
2
14 |
3
15 | 16 | 17 | -------------------------------------------------------------------------------- /HTML-CSS/02 Day/Example 01/pink.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 |
1
13 |
2
14 |
3
15 | 16 | 17 | -------------------------------------------------------------------------------- /HTML-CSS/02 Day/Example 01/yellow.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 |
1
13 |
2
14 |
3
15 | 16 | 17 | -------------------------------------------------------------------------------- /HTML-CSS/04 hiperlink/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |

@p4n.in

11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /HTML-CSS/04 hiperlink/welcome.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |

11 | @p4n.in 12 |

13 | 14 |

15 | Welcome 16 |

17 | 18 | -------------------------------------------------------------------------------- /HTML-CSS/06 Forms/Contact Form.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Contact Form - codeswithpankaj.com 7 | 8 | 9 |

Contact Us

10 |
11 |
12 |

13 | 14 |
15 |

16 | 17 |
18 |

19 | 20 | 21 |
22 | 23 | -------------------------------------------------------------------------------- /HTML-CSS/06 Forms/login.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Styled Form - codeswithpankaj.com 7 | 44 | 45 | 46 |

Contact Us

47 |
48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 |
59 | 60 | -------------------------------------------------------------------------------- /HTML-CSS/07 CSS outline/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 32 | 33 | 34 | 35 | 36 | 37 | 38 |

Codes with Pankaj

39 | 40 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas ea error porro magnam dolores delectus natus, facilis dignissimos fugit atque eius itaque quidem dicta, tenetur officiis illum modi corporis optio! 41 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Eos harum reiciendis architecto laudantium deserunt. Vitae, quod quaerat. Tempore magnam veritatis adipisci distinctio fugit quae est molestiae consectetur. Provident, eaque impedit. 42 | Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dignissimos repudiandae, voluptatum odit eaque corporis, aspernatur vero hic voluptas veniam at cum similique et labore eos ex corrupti, nisi aperiam? Sequi? 43 |

44 | 45 | 46 | -------------------------------------------------------------------------------- /HTML-CSS/Basic.md: -------------------------------------------------------------------------------- 1 | # HTML Elements 2 | 3 | 4 | 1. **`
` (Division):** 5 | - Used for grouping and structuring content. 6 | - Example: `
Content goes here
` 7 | 8 | 2. **`

` (Paragraph):** 9 | - Defines a paragraph. 10 | - Example: `

This is a paragraph.

` 11 | 12 | 3. **`` (Anchor):** 13 | - Creates hyperlinks. 14 | - Example: `Visit Example` 15 | 16 | 4. **`` (Image):** 17 | - Embeds images. 18 | - Example: `Description` 19 | 20 | 5. **`

to

` (Headings):** 21 | - Defines headings of different levels. 22 | - Example: `

This is a Heading

` 23 | 24 | 6. **`