├── 15th Jan 2023 - Doubt Session ├── index.html └── style.css ├── 8th Jan 2023 - Doubt Session HTML ├── Div.html ├── FormUnwrap.html ├── iframe.html └── rowspancolspan.html ├── Cheatsheets ├── API Cheatsheet.pdf ├── CSS Cheatsheet.pdf ├── Chrome Exrensions Cheatsheet.pdf ├── Express-Cheatsheet.pdf ├── Git Cheatsheet.pdf ├── HTML Cheatsheet.pdf ├── Javascript Cheatsheet.pdf ├── MongoDB-CheatSheet .pdf ├── React Cheatsheet.pdf └── Vs Code Cheatsheet.pdf ├── Debugging Exercise ├── Exercise1 - HTML │ ├── 01-q1.html │ ├── 01-solutionQ1.html │ ├── 02-q2.html │ ├── 02-solutionQ2.html │ ├── 03-q3.html │ ├── 03-solutionQ3.html │ ├── 04-q4.html │ ├── 04-solutionQ4.html │ ├── 05-q5.html │ ├── 05-solutionQ5.html │ ├── 06-q6.html │ └── 06-solutionQ6.html └── Exercise2 - CSS │ ├── question1.html │ ├── question2.html │ ├── question3.html │ ├── question4.html │ ├── question5.html │ ├── solution1.html │ ├── solution2.html │ ├── solution3.html │ ├── solution4.html │ └── solution5.html ├── Dot-Batch(Weekly-Codes) ├── Week 1 - HTML Basics │ ├── Day1 27th Dec 2022 │ │ ├── Learn.html │ │ ├── List.html │ │ ├── Mango.html │ │ ├── Resource.txt │ │ └── index.html │ ├── Day2 29th Dec 2022 │ │ ├── Tagpractice │ │ │ ├── Form.html │ │ │ ├── start.html │ │ │ └── tables.html │ │ └── resouces.txt │ ├── Day3 3rd Jan 2023 │ │ ├── Colgroup.html │ │ ├── CreatingRowColSpanTable.html │ │ ├── LearnTable.html │ │ ├── Span.html │ │ └── tribute.html │ ├── Day4 5th Jan 2023 │ │ ├── TagPracticeLink.html │ │ ├── divspan.html │ │ └── tributeLinkBookmark.html │ └── HTML Cheatsheet.pdf ├── Week 2 - CSS Basics │ ├── CSS BASICS - 1 7th Jan 2023 │ │ ├── Addstyle.html │ │ ├── boxmodel.html │ │ ├── index.html │ │ ├── pixel.html │ │ └── styles.css │ ├── CSS BASICS - 2 10th Jan 2023 │ │ ├── Dimension │ │ │ ├── index.html │ │ │ └── style.css │ │ ├── Gradient │ │ │ ├── index.html │ │ │ └── style.css │ │ ├── Position │ │ │ ├── index.html │ │ │ └── style.css │ │ ├── Shadows │ │ │ ├── index.html │ │ │ └── style.css │ │ └── Transforms │ │ │ ├── index.html │ │ │ └── style.css │ ├── CSS BASICS - 3 12th Jan 2023 │ │ └── Flex Properties │ │ │ ├── index.html │ │ │ └── style.css │ ├── CSS Cheatsheet.pdf │ └── ParallaxWebsite │ │ ├── background.png │ │ ├── foreground.png │ │ ├── index.html │ │ ├── sport-1.jpg │ │ ├── sport-2.jpg │ │ ├── sport-3.jpg │ │ └── styles.css ├── Week 3 - Animations and Responsiveness │ ├── 17th Jan 2023 - Grid And Responsiveness │ │ ├── AdvGrid │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── BlogWebsiteLayout │ │ │ ├── index.html │ │ │ ├── post.css │ │ │ ├── post.html │ │ │ └── styles.css │ │ ├── Class Slide Grid and Responsiveness.pdf │ │ ├── Grid and Responsivness │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── GridProperties │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── GridTemplateArea │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── advGrids │ │ │ ├── grid.html │ │ │ └── grids.css │ │ ├── blogWebsite │ │ │ ├── index.html │ │ │ ├── post.html │ │ │ ├── posts.css │ │ │ └── styles.css │ │ ├── index.html │ │ ├── mediaQueries │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── nestedgrids │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── properties │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── styles.css │ │ └── templateArea │ │ │ ├── index.html │ │ │ └── styles.css │ ├── 19th Jan 2023 - Animations │ │ ├── 19th_January_2023_Handwritten_Notes.pdf │ │ ├── Animation │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── HireMeButtonHomework │ │ │ └── Hiremebtn.html │ │ ├── Transition │ │ │ ├── index.html │ │ │ └── styles.css │ │ ├── index.html │ │ └── styles.css │ └── 22nd Jan 2023 - Unwrapp Modern Chair │ │ ├── chair.html │ │ ├── images │ │ ├── chair1.png │ │ ├── chair2.png │ │ ├── chair3.png │ │ ├── chair4.png │ │ ├── chair5.png │ │ ├── chair6.png │ │ ├── color1.jpg │ │ ├── color2.jpg │ │ ├── color3.jpg │ │ ├── color4.jpg │ │ ├── color5.jpg │ │ ├── color6.jpg │ │ └── favicon.ico │ │ └── styles.css ├── Week 4 - Tailwind CSS │ ├── 24th Jan - Class 1 │ │ ├── InstallingTailwindFromNode.html │ │ └── TailwindUsingCDN.html │ └── Resources.txt ├── Week 5 - Javascript Codes │ ├── Javacript - Basics 1 │ │ ├── index.html │ │ └── index.js │ ├── Javascript - Basics 2 │ │ ├── index.html │ │ └── index.js │ ├── Javascript - Basics 3 │ │ ├── index.html │ │ └── index.js │ └── Javascript - Basics 4 │ │ ├── index.html │ │ ├── index.js │ │ └── tempCodeRunnerFile.js └── Week 6 - DOM+MODERNJS │ ├── Class 2 │ ├── index.html │ └── index.js │ ├── Class 3 │ ├── index.html │ └── index.js │ └── Class 4 │ ├── index.html │ └── index.js ├── FlexGame ├── LEVEL 1.jpeg ├── LEVEL 10.jpeg ├── LEVEL 11.jpeg ├── LEVEL 12.jpeg ├── LEVEL 13.jpeg ├── LEVEL 14.jpeg ├── LEVEL 15.jpeg ├── LEVEL 16.jpeg ├── LEVEL 17.jpeg ├── LEVEL 18.jpeg ├── LEVEL 19.jpeg ├── LEVEL 2 .jpeg ├── LEVEL 20.jpeg ├── LEVEL 21.jpeg ├── LEVEL 22.jpeg ├── LEVEL 23.jpeg ├── LEVEL 24.jpeg ├── LEVEL 3 .jpeg ├── LEVEL 4.jpeg ├── LEVEL 5.jpeg ├── LEVEL 6.jpeg ├── LEVEL 7 .jpeg ├── LEVEL 8.jpeg └── LEVEL 9.jpeg ├── Handwritten Notes by Turwash ├── ALL IN ONE CSS WITH ANIMATIONS.pdf ├── ALL IN ONE HTML.pdf ├── DOM+MODERN JS CLASS 1 - HANDWRITTEN NOTES.pdf ├── DOM+MODERN JS CLASS 3 - HANDWRITTEN NOTES.pdf ├── DOM+MODERN JS CLASS 4 - HANDWRITTEN NOTES.pdf └── DOM+MODERNJS CLASS 2 - HANDWRITTEN NOTES.pdf ├── Homework and all codes ├── Animations_and_Responsiveness │ ├── Advanced_grid.html │ ├── Animations.html │ ├── Blog_website_layout.html │ ├── Grid_area.html │ ├── Grid_properties.html │ ├── Grid_template_area.html │ ├── Homework Questions │ ├── Media_queries.html │ ├── ModernButton.css │ ├── MordernButton.html │ ├── Nested_grids.html │ ├── Portfolio.css │ ├── Portfolio.html │ ├── Transitions.html │ ├── Variables.html │ ├── chair.html │ ├── images │ │ ├── Details │ │ ├── chair1.png │ │ ├── chair2.png │ │ ├── chair3.png │ │ ├── chair4.png │ │ ├── chair5.png │ │ ├── chair6.png │ │ ├── color1.jpg │ │ ├── color2.jpg │ │ ├── color3.jpg │ │ ├── color4.jpg │ │ ├── color5.jpg │ │ ├── color6.jpg │ │ └── favicon.ico │ └── styles.css ├── Backend │ └── Homework Questions ├── CSS │ ├── 1.html │ ├── 2.html │ ├── 3.html │ ├── 4.html │ ├── 5.html │ ├── CSS_Units.html │ ├── Dimension_Properties.html │ ├── Flex.html │ ├── Gradients.html │ ├── Homework Questions │ ├── Homework_Codes.html │ ├── Positioning_Properties.html │ ├── Product_Card.html │ ├── Shadows.html │ ├── Transforms.html │ ├── Ways_to_add_css.html │ ├── Web_Development_Bootcamp_Card.html │ ├── box_model.html │ ├── colors.html │ ├── imageGallery.css │ ├── imageGallery.html │ ├── index.html │ └── style.css ├── Git_and_GitHub │ ├── Git_and_GitHub_Cheatsheet.pdf │ ├── Git_and_GitHub_Notes.pdf │ └── Homework Questions ├── HTML │ ├── 1.html │ ├── 2.html │ ├── 3.html │ ├── 4.html │ ├── 5.html │ ├── 6.html │ ├── ContactUs_Form.html │ ├── Div_and_Span.html │ ├── Forms.html │ ├── HTML_Cheatsheet.pdf │ ├── HTML_Notes.pdf │ ├── Homework Questions │ ├── Homework_Codes.html │ ├── Links.html │ ├── Linus_Torvalds.html │ ├── Semantic_Tags.html │ ├── Starter_Code.html │ ├── Table1.html │ ├── Table2.html │ ├── Tables.html │ ├── Tables_Classwork_Exercise.html │ ├── Tables_Depth.html │ ├── favicon │ │ ├── android-chrome-192x192.png │ │ ├── android-chrome-512x512.png │ │ ├── apple-touch-icon.png │ │ ├── browserconfig.xml │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── favicon.ico │ │ ├── mstile-150x150.png │ │ └── site.webmanifest │ └── index.html ├── Javascript Basics │ ├── Homework Questions │ ├── Homework.js │ ├── JS1.html │ ├── JS1.js │ ├── JS2.html │ ├── JS2.js │ ├── JS3.html │ ├── JS3.js │ ├── JS4.html │ └── JS4.js ├── Javascript DOM Manipulation and Modern Javascript │ ├── Counter.html │ ├── Counter.js │ ├── DOM_ClassI.html │ ├── DOM_ClassI.js │ ├── DOM_ClassII.html │ ├── DOM_ClassII.js │ ├── DOM_ClassIII.html │ ├── DOM_ClassIII.js │ ├── DOM_ClassIV.html │ ├── DOM_ClassIV.js │ ├── Homework Question │ ├── Homework.html │ ├── Homework.js │ ├── ShareModal.css │ ├── ShareModal.html │ ├── ShareModal.js │ ├── add.js │ └── person.js ├── Javascript Mini Projects │ └── Homework Questions ├── Major Project │ └── Homework Questions ├── React │ └── Homework Questions ├── Tailwind CSS │ ├── Discord Clone │ │ ├── Details │ │ ├── index.html │ │ ├── main.css │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── postcss.config.js │ │ └── tailwind.config.js │ ├── Homework Questions │ └── Razorpay Clone │ │ ├── Details │ │ ├── images │ │ ├── CTABg.svg │ │ ├── Details │ │ ├── Xicon.svg │ │ ├── api-driven-icon.svg │ │ ├── autopay-icon.svg │ │ ├── buisness-banking.png │ │ ├── capital-credit-icon.svg │ │ ├── comanies.png │ │ ├── core-features-sectionBg.svg │ │ ├── ctaImg.svg │ │ ├── current-icon.svg │ │ ├── dashboard-reporting-icon.svg │ │ ├── easy-integration.svg │ │ ├── facebook-icon.svg │ │ ├── fake-company-logo.png │ │ ├── favicon.png │ │ ├── feature-section-2BG.svg │ │ ├── feature-section1-dottedrows.png │ │ ├── features-wave.svg │ │ ├── features2-wave.svg │ │ ├── footer-certificate-1.png │ │ ├── footer-certificate-2.jpg │ │ ├── github-icon.svg │ │ ├── hero-illustration.jpg │ │ ├── hero-shape.svg │ │ ├── india-flag.svg │ │ ├── industry-support-icon.svg │ │ ├── instagram-icon.svg │ │ ├── instant-activation-icon.svg │ │ ├── instant-settlement-bg.svg │ │ ├── instant-settlement-bghover.svg │ │ ├── instant-settlement-icon.svg │ │ ├── instantsettlement-bg.svg │ │ ├── instantsettlement-hoverbg.svg │ │ ├── linkedin-icon.svg │ │ ├── logo-dark.svg │ │ ├── logo.svg │ │ ├── magic-checkout-bg.svg │ │ ├── magic-checkout-hoverbg.svg │ │ ├── magic-checkout.svg │ │ ├── payment-button-bg.svg │ │ ├── payment-button-hoverbg.svg │ │ ├── payment-button.svg │ │ ├── payment-buttons-icon.svg │ │ ├── payment-gateway.svg │ │ ├── payment-link-icon.svg │ │ ├── payment-modes.svg │ │ ├── payment-pages-icon.svg │ │ ├── payment-suite.png │ │ ├── payouts-icon.svg │ │ ├── quotes.svg │ │ ├── razorpayX.svg │ │ ├── razorpayXicon.svg │ │ ├── route-icon.svg │ │ ├── secure-icon.svg │ │ ├── simple-pricing.svg │ │ ├── smart-collect-icon.svg │ │ ├── subscriptions-icon.svg │ │ ├── testimonial.jpg │ │ ├── twitter-icon.svg │ │ ├── upi-autopay-bg.svg │ │ ├── upi-autopay-hoverbg.svg │ │ ├── x-flame-1.png │ │ └── x-flame-2.png │ │ ├── index.html │ │ ├── main.css │ │ ├── package-lock.json │ │ ├── package.json │ │ ├── postcss.config.js │ │ └── tailwind.config.js └── readme-style ├── README.md └── index Web Dev Batch.docx /15th Jan 2023 - Doubt Session/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | #wrapper { 8 | height: 100vh; 9 | overflow-x: hidden; 10 | overflow-y: auto; 11 | } 12 | 13 | .container { 14 | height: 100%; 15 | max-width: 1200px; 16 | margin: 0 auto; /* Content comes in center , left and right margin equal*/ 17 | padding: 20px; /* space between border and content */ 18 | } 19 | 20 | .container h1 { 21 | margin: 20px 100px; 22 | text-align: center; 23 | margin-bottom: 20px; 24 | font-size: 3rem; 25 | } 26 | 27 | .gallery { 28 | display: flex; 29 | flex-wrap: wrap; 30 | justify-content: space-between; 31 | } 32 | 33 | .card { 34 | height: 300px; 35 | width: 32%; 36 | position: relative; 37 | margin-bottom: 20px; 38 | border-radius: 10px; 39 | overflow: hidden; 40 | } 41 | 42 | .card img{ 43 | height: 100%; 44 | width: 100%; 45 | filter: grayscale(100%); 46 | box-shadow: 0 0 20px #333; 47 | object-fit: cover; 48 | } 49 | 50 | .card:hover{ 51 | transform: scale(1.03); 52 | filter: drop-shadow(0 0 10px #333); 53 | transition: 0.5s; 54 | } 55 | 56 | .card:hover img{ 57 | filter: grayscale(0%); 58 | } 59 | 60 | .card figcaption{ 61 | position: absolute; 62 | bottom: 0; 63 | left: 0; 64 | padding: 25px; 65 | height: 20; 66 | width: 100%; 67 | font-size: 16px; 68 | font-weight: 500; 69 | color: white; 70 | opacity: 0; 71 | border-radius: 0 0 10px 10px; 72 | background: linear-gradient(0deg , rgba(0 , 0, 0 , 0.5) 0%, rgba(255 ,255,255)); 73 | transition: 0.3s; 74 | 75 | } 76 | 77 | .card:hover figcaption{ 78 | opacity: 1; 79 | transform: scale(1.03); 80 | } -------------------------------------------------------------------------------- /8th Jan 2023 - Doubt Session HTML/Div.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 20 | 21 | 22 | 23 |
24 | This is heading of Div 1 with display as inline 25 | This is heading of Div 1 with display as inline 26 |
27 | 28 | 29 |

This is heading of second Span with display as block

30 |

This is heading of second Span with display as block

31 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /8th Jan 2023 - Doubt Session HTML/iframe.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Maps

11 | 12 | 18 | 19 | 20 |

Wikipedia

21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /Cheatsheets/API Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/API Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/CSS Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/CSS Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/Chrome Exrensions Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/Chrome Exrensions Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/Express-Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/Express-Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/Git Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/Git Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/HTML Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/HTML Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/Javascript Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/Javascript Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/MongoDB-CheatSheet .pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/MongoDB-CheatSheet .pdf -------------------------------------------------------------------------------- /Cheatsheets/React Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/React Cheatsheet.pdf -------------------------------------------------------------------------------- /Cheatsheets/Vs Code Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Cheatsheets/Vs Code Cheatsheet.pdf -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/01-q1.html: -------------------------------------------------------------------------------- 1 |

Web Development Master Course

-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/01-solutionQ1.html: -------------------------------------------------------------------------------- 1 |

Web Development Master Course

-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/02-q2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |

CodeHelp

4 |

CodeHelp

5 |

CodeHelp

6 |

CodeHelp

7 |

CodeHelp

8 |

CodeHelp

9 | 10 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/02-solutionQ2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |

CodeHelp

4 |

CodeHelp

5 |

CodeHelp

6 |

CodeHelp

7 |
CodeHelp
8 |
CodeHelp
9 | 10 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/03-q3.html: -------------------------------------------------------------------------------- 1 |

This is a Heading 2 |

This is a paragraph.

-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/03-solutionQ3.html: -------------------------------------------------------------------------------- 1 |

This is a Heading

2 |

This is a paragraph.

-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/04-q4.html: -------------------------------------------------------------------------------- 1 | 2 | My house is red - a little house; 3 | A happy child am I: 4 | I laugh and play the whole day long, 5 | I hardly ever cry. 6 | 7 | I have a tree, a green, green tree, 8 | To shade me from the sun; 9 | And under it I often sit, 10 | When all my play is done. 11 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/04-solutionQ4.html: -------------------------------------------------------------------------------- 1 | 
 2 |     My house is red - a little house;
 3 |     A happy child am I:
 4 |     I laugh and play the whole day long,
 5 |     I hardly ever cry.
 6 | 
 7 |     I have a tree, a green, green tree,
 8 |     To shade me from the sun;
 9 |     And under it I often sit,
10 |     When all my play is done.
11 |
-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/05-q5.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/05-solutionQ5.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/06-q6.html: -------------------------------------------------------------------------------- 1 |
2 | Email: 3 |

Submit

4 |
-------------------------------------------------------------------------------- /Debugging Exercise/Exercise1 - HTML/06-solutionQ6.html: -------------------------------------------------------------------------------- 1 |
2 | Email: 3 | 4 |
-------------------------------------------------------------------------------- /Debugging Exercise/Exercise2 - CSS/question1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 20 | 21 | 22 | I am Span 1 23 | I am Span 2 24 | 25 | 26 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise2 - CSS/question2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 42 | 43 | 44 |
45 | 49 |
50 |

This is a Sample Heading

51 |
52 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga 53 | perferendis quia iste nisi ea vero voluptatibus corrupti harum aliquam 54 | modi. 55 |
56 |
57 | 58 | 59 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise2 - CSS/question5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | CSS 8 | 21 | 22 | 23 |
24 |
HTML
25 |
CSS
26 |
JS
27 |
React
28 |
Vue
29 |
Angular
30 |
Express
31 |
Mongo
32 |
33 | 34 | 35 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise2 - CSS/solution1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 21 | 22 | 23 | I am Span 1 24 | I am Span 2 25 | 26 | 27 | -------------------------------------------------------------------------------- /Debugging Exercise/Exercise2 - CSS/solution5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | CSS 8 | 24 | 25 | 26 |
27 |
HTML
28 |
CSS
29 |
JS
30 |
React
31 |
Vue
32 |
Angular
33 |
Express
34 |
Mongo
35 |
36 | 37 | 38 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day1 27th Dec 2022/Learn.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Kuch toh log kahenge

11 | 12 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day1 27th Dec 2022/List.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |

Grocery Items:

5 |
    6 |
  1. Cheeni
    2. 7 |
  2. Peanut Butter
    3. 8 |
  3. Sugar Free
    4. 9 |
10 | 11 |

Second Grocery List :

12 | 17 | 18 | Tofu Picture 23 | 24 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day1 27th Dec 2022/Mango.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 10 | 11 | 12 | 13 |
Kya Haal Hai
14 | Code Help Website 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day1 27th Dec 2022/Resource.txt: -------------------------------------------------------------------------------- 1 | MDN Documentation: 2 | https://developer.mozilla.org/en-US/docs/Web/HTML -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day1 27th Dec 2022/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |

Heading 1

7 |

Heading 2

8 |

Heading 3

9 |

Heading 4

10 |
Heading 5
11 |
Heading 6
12 | 13 | 14 |

This is a paragraph

15 |

This is second paragraph

16 |
17 |

This is Third paragraph

18 | 19 | 20 |
This is a DIV Tag
21 | 22 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day2 29th Dec 2022/Tagpractice/Form.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Welcome to CoDeHeLp :

11 | 12 |
13 | 14 | 15 |

16 | 17 | 18 | 19 |

20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day2 29th Dec 2022/Tagpractice/tables.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 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 | 42 | 43 | 44 | 45 | 46 |
My First Saving
MonthSavings
January100
February300
March400
Total800
47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day2 29th Dec 2022/resouces.txt: -------------------------------------------------------------------------------- 1 | 1) Ask doubts worldwide 2 | https://stackoverflow.com/ 3 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day3 3rd Jan 2023/CreatingRowColSpanTable.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 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 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 |
State of HealthFasting ValueAfter eating
MinimumMaximum2 hrs after eating
healthy70100less than 140
Pre-diab101126140 to 200
Diabetesmore than 126NAMore than 200
55 | 56 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day3 3rd Jan 2023/LearnTable.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 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 |
MonthAmount
Jan100
Feb200
March300
Total600
39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day3 3rd Jan 2023/Span.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 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 | 45 | 46 | 47 | 48 |
My First Table
abcdabcd
abcdabcdabcd
abcdabcd
abcdabcd
abcdabcd
abcd
49 | 50 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day4 5th Jan 2023/TagPracticeLink.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Link Tag Practice

11 | 12 | Click Here 13 |
14 | 15 | Call Me 16 |
17 | 18 | Mail Me 19 | 20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/Day4 5th Jan 2023/divspan.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 20 | 21 | 22 | 23 | 24 |
This is Inside Div
25 |
This is Inside Div
26 | First Span 27 | Second Span 28 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/HTML Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 1 - HTML Basics/HTML Cheatsheet.pdf -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 1 7th Jan 2023/Addstyle.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 25 | 26 | 27 | 28 | 29 |

Hello G , Kese Ho Saare !!!

30 | 31 |

USING INLINE CSS IN THIS

32 | 33 |

THIS CODE IS FOR EXTERNAL CSS

34 | 35 | 36 |

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Maxime, laudantium?

37 | 38 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 1 7th Jan 2023/boxmodel.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 32 | 33 | 34 |
A
35 |
B
36 |
C
37 | 38 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 1 7th Jan 2023/pixel.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 32 | 33 | 34 | 35 |
36 |
37 |
38 | 39 |

My First Paragraph

40 | 41 | 42 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 1 7th Jan 2023/styles.css: -------------------------------------------------------------------------------- 1 | h2{ 2 | color: blue; 3 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Dimension/style.css: -------------------------------------------------------------------------------- 1 | div{ 2 | max-height: 100px; 3 | border: 1px solid black; 4 | overflow: scroll; 5 | } 6 | 7 | .minheight { 8 | min-height: 100px; 9 | margin: 10px; 10 | border: 1px solid black; 11 | } 12 | 13 | #divoverflow { 14 | height: 50px; 15 | border : 1px solid black; 16 | overflow: visible; 17 | } 18 | 19 | .fixed{ 20 | background-color: aqua; 21 | position: fixed; 22 | } 23 | 24 | .divc{ 25 | border : 1px solid black; 26 | color: white; 27 | background-color: brown; 28 | position: sticky; 29 | top:170px; 30 | left:60px; 31 | 32 | 33 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Gradient/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
This is a div
12 |
This is radial gradient
13 | 14 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Gradient/style.css: -------------------------------------------------------------------------------- 1 | .box{ 2 | border: 1px solid black; 3 | height: 200px; 4 | width: 150px; 5 | background-image: linear-gradient(red, blue); 6 | background-image: linear-gradient(to right , red, blue, green); 7 | background-image: linear-gradient(90deg, red, blue); 8 | background-image: linear-gradient(to bottom, rgba(25,0,0,0),rgba(0,0,255,1)); 9 | } 10 | 11 | .mydiv{ 12 | border: 1px solid black; 13 | margin: 10px; 14 | height: 300px; 15 | width: 150px; 16 | background-image: radial-gradient(red,blue,orange); 17 | background-image: radial-gradient(circle, red,blue,orange); 18 | background-image: radial-gradient( red 10%,blue 5%,orange 6%); 19 | 20 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Position/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 | 13 |
This is Me, Turwash
14 |
15 | 16 | 17 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Position/style.css: -------------------------------------------------------------------------------- 1 | div{ 2 | border: 1px solid black; 3 | margin:10px; 4 | left: 50px; 5 | } 6 | 7 | .box{ 8 | border: 1px solid black; 9 | position: relative; 10 | left: 50px; /* This works due to position Relative */ 11 | right: 50px; 12 | top: 50px; 13 | 14 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Shadows/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

This is my heading

12 |
13 | This is for box shadow 14 |
15 | 16 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Shadows/style.css: -------------------------------------------------------------------------------- 1 | h1{ 2 | text-shadow: 3px 3px 3px red; 3 | text-shadow:3px 3px 3px red, 3px 1px 1px green; 4 | } 5 | 6 | div{ 7 | background-color: aqua; 8 | width: 200px; 9 | height: 200px; 10 | box-shadow: 10px 10px 10px green; 11 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Transforms/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 |
14 | ABCD 15 |
16 | 17 | 18 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 2 10th Jan 2023/Transforms/style.css: -------------------------------------------------------------------------------- 1 | .box{ 2 | background-color: aqua; 3 | /* margin: 200px; */ 4 | /* transform: translate(100px,200px); */ 5 | /* transform: rotate(45deg); */ 6 | /* transform: scale(2,5); */ 7 | /* transform: skew(20deg); */ 8 | 9 | 10 | /* 3d transformation */ 11 | /* transform: perspective(10px) translateZ(10px); */ 12 | /* transform: translateX(100px);*/ 13 | /* transform: translateY(100px); */ 14 | /* transform: translate3d(100px 100px 10px); */ 15 | 16 | /* transform: perspective(10px) scaleZ(5); */ 17 | 18 | /* transform: rotateX(45deg); 19 | transform: rotateY(45deg); 20 | transform: rotateZ(45deg); */ 21 | 22 | } 23 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS BASICS - 3 12th Jan 2023/Flex Properties/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |
Box 1
13 |
Box 2
14 |
Box 3
15 |
Box 4
16 |
17 | 18 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/CSS Cheatsheet.pdf -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/background.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/foreground.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/foreground.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-1.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-2.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 2 - CSS Basics/ParallaxWebsite/sport-3.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/AdvGrid/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Grid Template Area 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 |
Content
16 | 17 | 18 | 19 |
20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/AdvGrid/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | height: 700px; 3 | border: 1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | grid-gap: 10px; 8 | 9 | grid-auto-rows: minmax(100px , auto); 10 | /* grid-template-rows: repeat(2,1fr); */ 11 | grid-template-columns: repeat(4, 1fr); 12 | 13 | 14 | } 15 | 16 | .box{ 17 | border: 1px solid green; 18 | 19 | background-color: aqua; 20 | /* height: 100px; 21 | width: 100px; */ 22 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/BlogWebsiteLayout/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Blog Website 8 | 9 | 10 | 11 |
12 | 15 | 16 |
Content
17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/BlogWebsiteLayout/post.css: -------------------------------------------------------------------------------- 1 | .container { 2 | border: 1px solid black; 3 | height: 700px; 4 | width: 504px; 5 | background-color: yellow; 6 | 7 | display: grid; 8 | 9 | grid-template-rows: 30px 1fr 1fr 30px; 10 | grid-template-columns: 1fr; 11 | 12 | grid-gap: 4px; 13 | 14 | grid-template-areas: 15 | "hd" 16 | "side" 17 | "main" 18 | "ft"; 19 | } 20 | 21 | .box { 22 | border: 1px solid red; 23 | background-color: aqua; 24 | } 25 | 26 | #header { 27 | grid-area: hd; 28 | } 29 | 30 | #footer { 31 | grid-area: ft; 32 | } 33 | 34 | #sidebar { 35 | grid-area: side; 36 | } 37 | 38 | #content { 39 | grid-area: main; 40 | } 41 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/BlogWebsiteLayout/post.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Post 8 | 9 | 10 | 11 | 12 |
13 | 16 | 17 |
Content
18 | 19 |
20 | 21 | 22 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/BlogWebsiteLayout/styles.css: -------------------------------------------------------------------------------- 1 | .container { 2 | border: 1px solid black; 3 | height: 700px; 4 | width: 504px; 5 | background-color: yellow; 6 | 7 | display: grid; 8 | 9 | grid-template-rows: 30px 1fr 30px; 10 | grid-template-columns: 100px 400px; 11 | 12 | grid-gap: 4px; 13 | 14 | grid-template-areas: 15 | "hd hd" 16 | "side main" 17 | "ft ft"; 18 | } 19 | 20 | .box { 21 | border: 1px solid red; 22 | background-color: aqua; 23 | } 24 | 25 | #header { 26 | grid-area: hd; 27 | } 28 | 29 | #footer { 30 | grid-area: ft; 31 | } 32 | 33 | #sidebar { 34 | grid-area: side; 35 | } 36 | 37 | #content { 38 | grid-area: main; 39 | } 40 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/Class Slide Grid and Responsiveness.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/Class Slide Grid and Responsiveness.pdf -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/Grid and Responsivness/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Grid 8 | 9 | 10 | 11 |
12 |
Box 1
13 |
Box 1
14 |
Box 1
15 |
Box 1
16 |
Box 1
17 |
Box 1
18 |
Box 1
19 |
Box 1
20 |
Box 1
21 |
Box 1
22 |
23 | 24 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/Grid and Responsivness/styles.css: -------------------------------------------------------------------------------- 1 | .container { 2 | height: 700px; 3 | border: 1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | 8 | grid-template-rows: repeat(4, 1fr); 9 | grid-template-columns: repeat(3, 1fr); 10 | grid-gap: 10px; 11 | } 12 | 13 | .box { 14 | border: 1px solid green; 15 | 16 | background-color: aqua; 17 | /* height: 100px; 18 | width: 100px; */ 19 | } 20 | 21 | #box1 { 22 | /* grid-column-start: 1; 23 | grid-column-end: 4; 24 | 25 | grid-row-start: 1 ; 26 | grid-row-end: 3; */ 27 | 28 | grid-area: 1/1/3/4; /*row column extended by this property in one line */ 29 | } 30 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/GridProperties/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 | 20 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/GridProperties/styles.css: -------------------------------------------------------------------------------- 1 | .container { 2 | 3 | border: 1px solid brown; 4 | background-color: yellow; 5 | height: 700px; 6 | width: 600px; 7 | display: grid; 8 | grid-template-columns: 100px 100px 100px; 9 | grid-template-rows: 100px 100px; 10 | 11 | grid-gap: 100px; 12 | 13 | 14 | /* justify-content: start; */ /* content shift to left in hotizontal axis */ 15 | /* justify-content: end; 16 | justify-content: center; 17 | justify-content: space-between; 18 | justify-content: space-around; 19 | justify-content: space-evenly; */ 20 | 21 | /* align-items: start; 22 | align-items: end; 23 | align-items: baseline; 24 | align-items: stretch; */ /*(Default) */ 25 | 26 | 27 | 28 | } 29 | 30 | .box { 31 | 32 | border: 1px solid red; 33 | background-color: aqua; 34 | 35 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/GridTemplateArea/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Grid Template Area 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 |
Content
16 | 17 | 18 | 19 |
20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/GridTemplateArea/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | height: 700px; 3 | border: 1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | /* grid-template-rows: 30px 150px 400px 30px; 8 | grid-template-columns: 400px; 9 | 10 | grid-template-areas: 11 | "hd" 12 | "side" 13 | "main" 14 | "ft"; */ 15 | 16 | 17 | /* grid-template-rows: 30px 500px 30px; 18 | grid-template-columns: 200px 400px; 19 | grid-template-areas: 20 | "hd" "hd" 21 | "side" "side" 22 | "ft" "ft"; */ 23 | 24 | grid-template-rows: 300px 300px 300px; 25 | grid-template-columns: 250px 600px; 26 | grid-template-areas: 27 | "hd hd hd hd hd hd hd hd" 28 | "side side main main main main main main" 29 | "ft ft ft ft ft ft ft ft"; 30 | 31 | } 32 | 33 | .box{ 34 | border: 1px solid green; 35 | 36 | background-color: aqua; 37 | /* height: 100px; 38 | width: 100px; */ 39 | } 40 | 41 | #header { 42 | grid-area: hd; 43 | } 44 | 45 | #footer{ 46 | grid-area:ft; 47 | } 48 | 49 | #sidebar{ 50 | grid-area: side; 51 | } 52 | 53 | #content { 54 | grid-area: main; 55 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/advGrids/grid.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | GRID TEMPLATE AREA 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 |
Content
17 | 18 |
Content2
19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 |
35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/advGrids/grids.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | height:700px; 3 | border:1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | grid-gap:10px; 8 | 9 | grid-template-rows: repeat(2,1fr); 10 | grid-template-columns: repeat(4,1fr); 11 | 12 | } 13 | 14 | .box{ 15 | border:1px solid green; 16 | background-color: aqua; 17 | /* height:100px; 18 | width:100px; */ 19 | } 20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/blogWebsite/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BLOG WEBSITE 8 | 9 | 10 | 11 |
12 | 15 | 16 |
CONTENT
17 | 18 |
19 | 20 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/blogWebsite/post.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | POST 8 | 9 | 10 | 11 |
12 | 16 | 17 |
CONTENT
18 | 19 |
20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/blogWebsite/posts.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | border:1px solid black; 3 | background-color: yellow; 4 | height:700px; 5 | width:504px; 6 | display:grid; 7 | grid-template-rows: 30px 1fr 1fr 30px; 8 | grid-template-columns: 1fr; 9 | 10 | grid-gap:4px; 11 | 12 | grid-template-areas: 13 | "hd" 14 | "side" 15 | "main" 16 | "ft"; 17 | 18 | } 19 | 20 | 21 | .box{ 22 | border:1px solid red; 23 | background-color: aqua; 24 | } 25 | 26 | #header{ 27 | grid-area: hd; 28 | } 29 | 30 | #footer{ 31 | grid-area: ft; 32 | } 33 | 34 | #sidebar{ 35 | grid-area: side; 36 | } 37 | 38 | #content{ 39 | grid-area: main; 40 | } 41 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/blogWebsite/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | border:1px solid black; 3 | background-color: yellow; 4 | height:700px; 5 | width:504px; 6 | display:grid; 7 | grid-template-rows: 30px 1fr 30px; 8 | grid-template-columns: 100px 400px; 9 | 10 | grid-gap:4px; 11 | 12 | grid-template-areas: 13 | "hd hd" 14 | "side main" 15 | "ft ft"; 16 | 17 | } 18 | 19 | 20 | .box{ 21 | border:1px solid red; 22 | background-color: aqua; 23 | } 24 | 25 | #header{ 26 | grid-area: hd; 27 | } 28 | 29 | #footer{ 30 | grid-area: ft; 31 | } 32 | 33 | #sidebar{ 34 | grid-area: side; 35 | } 36 | 37 | #content{ 38 | grid-area: main; 39 | } 40 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | GRIDS 8 | 9 | 10 | 11 |
12 |
box1
13 |
box2
14 |
box3
15 |
box4
16 |
box5
17 |
box6
18 |
box7
19 |
box8
20 |
box9
21 |
box10
22 |
box11
23 |
box12
24 |
25 | 26 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/mediaQueries/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BLOG WEBSITE 8 | 9 | 10 | 11 |
12 | 13 | 14 |
CONTENT
15 | 16 |
17 | 18 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/mediaQueries/styles.css: -------------------------------------------------------------------------------- 1 | /* *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } */ 6 | 7 | .container{ 8 | border:1px solid black; 9 | background-color: yellow; 10 | height:700px; 11 | width:504px; 12 | display:grid; 13 | grid-template-rows: 30px 1fr 30px; 14 | grid-template-columns: 100px 400px; 15 | 16 | grid-gap:4px; 17 | 18 | grid-template-areas: 19 | "hd hd" 20 | "side main" 21 | "ft ft"; 22 | 23 | } 24 | 25 | 26 | .box{ 27 | border:1px solid red; 28 | background-color: aqua; 29 | } 30 | 31 | #header{ 32 | grid-area: hd; 33 | } 34 | 35 | #footer{ 36 | grid-area: ft; 37 | } 38 | 39 | #sidebar{ 40 | grid-area: side; 41 | } 42 | 43 | #content{ 44 | grid-area: main; 45 | } 46 | 47 | /* @media(max-width:400px) { 48 | .container{ 49 | grid-gap:100px; 50 | } 51 | } 52 | 53 | */ 54 | 55 | 56 | @media(max-width:350px){ 57 | .container{ 58 | grid-template-rows: 30px 1fr 1fr 30px; 59 | grid-template-columns: 1fr; 60 | 61 | grid-gap:2px; 62 | 63 | grid-template-areas: 64 | "hd" 65 | "side" 66 | "main" 67 | "ft"; 68 | } 69 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/nestedgrids/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Nested Grids 8 | 9 | 10 | 11 |
12 | 13 | 14 |
15 | 16 |
17 |
IMG1
18 |
IMG2
19 |
IMG3
20 |
IMG4
21 |
22 | 23 |
24 | 25 |
26 | 27 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/nestedgrids/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | border:1px solid black; 3 | background-color: yellow; 4 | height:700px; 5 | width:504px; 6 | display:grid; 7 | grid-template-rows: 30px 1fr 30px; 8 | grid-template-columns: 100px 400px; 9 | 10 | grid-gap:4px; 11 | 12 | grid-template-areas: 13 | "hd hd" 14 | "side main" 15 | "ft ft"; 16 | 17 | } 18 | 19 | 20 | .box{ 21 | border:1px solid red; 22 | background-color: aqua; 23 | } 24 | 25 | #header{ 26 | grid-area: hd; 27 | } 28 | 29 | #footer{ 30 | grid-area: ft; 31 | } 32 | 33 | #sidebar{ 34 | grid-area: side; 35 | } 36 | 37 | #content{ 38 | grid-area: main; 39 | } 40 | 41 | .childgrid{ 42 | height:100%; 43 | width:100%; 44 | display:grid; 45 | 46 | grid-template-columns: 1fr 1fr; 47 | grid-template-rows: repeat(2,1fr); 48 | 49 | grid-gap:5px; 50 | } 51 | 52 | .element{ 53 | border: 2px solid green; 54 | background-color: hotpink; 55 | } 56 | 57 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/properties/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Properties 8 | 9 | 10 | 11 |
12 |
B1
13 |
B2
14 |
B3
15 |
B4
16 |
B5
17 |
B6
18 |
19 | 20 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/properties/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | border:1px solid brown; 3 | background-color: yellow; 4 | height:700px; 5 | width:600px; 6 | display:grid; 7 | grid-template-columns: 100px 100px 100px; 8 | grid-template-rows: 100px 100px; 9 | /* 10 | grid-gap:10px; */ 11 | /* 12 | justify-content: start; 13 | justify-content: end; 14 | justify-content: center; 15 | justify-content: space-between; 16 | justify-content: space-around; 17 | justify-content: space-evenly; */ 18 | 19 | /* align-items: start; 20 | align-items: end; 21 | align-items: baseline; 22 | align-items: stretch; */ 23 | /* 24 | align-content: space-around; */ 25 | /* justify-content: center; 26 | align-content: center; */ 27 | 28 | /* place-content: center; */ 29 | 30 | /* justify-items: center; 31 | align-items: center; */ 32 | 33 | place-items:center; 34 | 35 | } 36 | 37 | .box{ 38 | border:1px solid red; 39 | background-color: aqua; 40 | } 41 | 42 | #box1{ 43 | /* justify-self: start; 44 | justify-self: end; 45 | justify-self: center; */ 46 | 47 | /* align-self:center; */ 48 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | height:700px; 3 | border:1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | 8 | grid-template-rows: repeat(4, 1fr); 9 | grid-template-columns: repeat(3,1fr); 10 | grid-gap:10px; 11 | 12 | } 13 | 14 | .box{ 15 | border:1px solid green; 16 | background-color: aqua; 17 | /* height:100px; 18 | width:100px; */ 19 | } 20 | 21 | #box1{ 22 | /* grid-column-start:1; 23 | grid-column-end:4 ; 24 | 25 | grid-row-start: 1; 26 | grid-row-end: 3; */ 27 | 28 | grid-area:1/1/3/4; 29 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/templateArea/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | GRID TEMPLATE AREA 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 |
Content
17 | 18 | 19 |
20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/17th Jan 2023 - Grid And Responsiveness/templateArea/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | height:700px; 3 | border:1px solid red; 4 | background-color: yellow; 5 | 6 | display: grid; 7 | 8 | grid-template-rows: 30px 150px 400px 30px; 9 | grid-template-columns: 400px; 10 | 11 | grid-template-areas: 12 | "hd" 13 | "side" 14 | "main" 15 | "ft"; 16 | /* 17 | grid-template-columns: 200px 400px; 18 | grid-template-rows: 30px 500px 30px; 19 | 20 | grid-template-areas: 21 | "hd hd" 22 | "side main" 23 | "ft ft"; 24 | 25 | */ 26 | 27 | grid-template-columns: 300px 300px 300px; 28 | grid-template-rows: 250px 600px; 29 | 30 | grid-template-areas: 31 | "hd hd hd hd hd hd hd hd " 32 | "side main main main main main main main" 33 | "ft ft ft ft ft ft ft ft" 34 | "ft ft ft ft ft ft ft ft"; 35 | 36 | } 37 | 38 | .box{ 39 | border:1px solid green; 40 | background-color: aqua; 41 | /* height:100px; 42 | width:100px; */ 43 | } 44 | 45 | #header{ 46 | grid-area:ft; 47 | } 48 | #footer{ 49 | grid-area:hd; 50 | } 51 | 52 | #sidebar{ 53 | grid-area: side; 54 | 55 | } 56 | 57 | #content{ 58 | grid-area: main; 59 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/19th_January_2023_Handwritten_Notes.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/19th_January_2023_Handwritten_Notes.pdf -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/Animation/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 |
Box 1
13 |
14 | 15 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/Animation/styles.css: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 215px; 4 | background-color: yellow; 5 | border: 2px solid red; 6 | 7 | } 8 | 9 | .box { 10 | 11 | height: 212px; 12 | width: 212px; 13 | border: 2px solid green; 14 | background-color: aqua; 15 | 16 | animation-name: Turwash; 17 | animation-duration: 5s; 18 | /* animation-iteration-count: infinite; */ 19 | animation-timing-function: ease-out; 20 | animation-delay: 1s; 21 | /* animation-direction: alternate; */ 22 | animation-fill-mode: forwards; /*where animation stops */ 23 | 24 | } 25 | 26 | 27 | /* @keyframes Turwash { 28 | 0% { 29 | width: 212px; 30 | background-color: orange; 31 | 32 | } 33 | 34 | 50%{ 35 | width: 50%; 36 | background-color: white; 37 | 38 | } 39 | 100%{ 40 | width: 100%; 41 | background-color: green; 42 | 43 | } 44 | } */ 45 | 46 | 47 | @keyframes Turwash { 48 | 0% { 49 | width: 212px; 50 | background-color: aqua; 51 | 52 | } 53 | 30%{ 54 | width: 35%; 55 | background-color: aquamarine; 56 | 57 | } 58 | 65%{ 59 | width: 70%; 60 | background-color: blue; 61 | 62 | } 63 | 100%{ 64 | width: 100%; 65 | background-color: violet; 66 | 67 | } 68 | } 69 | 70 | 71 | 72 | /* @keyframes Turwash { 73 | 74 | from{ 75 | 76 | width: 212px; 77 | 78 | } 79 | 80 | to { 81 | 82 | width: 100%; 83 | 84 | } 85 | 86 | } */ -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/HireMeButtonHomework/Hiremebtn.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 53 | 54 | 55 |
56 |
Hire me
57 |
58 | 59 | 60 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/Transition/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 | Mai ek box hu 14 |
15 | 16 | 17 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/Transition/styles.css: -------------------------------------------------------------------------------- 1 | .container{ 2 | 3 | height: 500px; 4 | width: 500px; 5 | border: 3px solid red; 6 | background-color: green; 7 | display: flex; 8 | } 9 | 10 | .box{ 11 | height: 150px; 12 | width: 150px; 13 | margin: 20px; 14 | border: 2px solid orange; 15 | background-color: aqua; 16 | 17 | /* transition: 2s; /*adding transition smoothness */ 18 | /* transition-property: background-color; /* transition on which property */ 19 | /* transition-property: all; /* All Transition , it is bad practice because impacts performance */ 20 | /* transition-delay: 5s; /* animation will work after 5sec */ 21 | /* transition: background-color 1s ease 1s; */ 22 | /* transition: all 1s ease 1s; */ 23 | 24 | transition: all 3s cubic-bezier(1 , -0.09 , 0 , 1.68) ; /* using cubic bezier from inspect */ 25 | 26 | 27 | } 28 | 29 | .box:hover{ 30 | 31 | 32 | background-color: brown; 33 | /* transform: rotate(45deg); */ 34 | 35 | transform: scale(2) translateX(500px) rotate(80deg); 36 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 |
13 |
Box 1
14 |
Box 2
15 |
Box 3
16 |
Box 4
17 |
18 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/19th Jan 2023 - Animations/styles.css: -------------------------------------------------------------------------------- 1 | .container { 2 | 3 | border: 1px solid brown; 4 | background-color: red; 5 | height: 300px; 6 | width: 300px; 7 | } 8 | 9 | .box { 10 | border: 2px solid green; 11 | background-color: aqua; 12 | --dark-red: #981a2c; 13 | color: var(--dark-red); 14 | 15 | } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair1.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair2.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair3.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair4.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair5.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/chair6.png -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color1.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color2.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color3.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color4.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color5.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/color6.jpg -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Dot-Batch(Weekly-Codes)/Week 3 - Animations and Responsiveness/22nd Jan 2023 - Unwrapp Modern Chair/images/favicon.ico -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 4 - Tailwind CSS/24th Jan - Class 1/InstallingTailwindFromNode.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Tailwind` 8 | 9 | 10 | 11 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 4 - Tailwind CSS/24th Jan - Class 1/TailwindUsingCDN.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Tailwind 8 | 9 | 10 | 11 | 12 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 4 - Tailwind CSS/Resources.txt: -------------------------------------------------------------------------------- 1 | RESOURCES FOR TODAY 2 | 3 | 1)RayzorPay Website We Will Clone Using Tailwind CSS 4 | https://razorpay.com/ 5 | 6 | 2)Must READ Use Tailwind CSS Documentations 7 | https://tailwindcss.com/ 8 | 9 | 3)Tailwind Installation 10 | https://tailwindcss.com/docs/installation 11 | 12 | 4) Installing Node From 13 | https://nodejs.org/en/download/ 14 | 15 | 5) Installing Tailwind Step By Step (with Images) 16 | https://tailwindcss.com/docs/installation/using-postcss -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 5 - Javascript Codes/Javacript - Basics 1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Javascript Tutorial 8 | 9 | 10 |

Hello Jeee!!!

11 | 12 | 13 | 14 | 17 | 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 5 - Javascript Codes/Javascript - Basics 2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Hellow Jiii Class 2

11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 5 - Javascript Codes/Javascript - Basics 3/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

Hello

11 | 12 | 13 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 5 - Javascript Codes/Javascript - Basics 4/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Class 4 8 | 9 | 10 |

Heyyyyy Everyone

11 | 12 | 13 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 5 - Javascript Codes/Javascript - Basics 4/tempCodeRunnerFile.js: -------------------------------------------------------------------------------- 1 | let person1 = { 2 | // fname : 'Love', 3 | // lanem: 'Babbar', 4 | 5 | // get fullName() { 6 | // return `${person.fname} ${person.lname}`; 7 | 8 | // }, 9 | // set fullName (value) { 10 | // if(typeof value !== String){ 11 | // throw new Error ("Not a string"); 12 | // } 13 | // let parts = value.split(' '); 14 | // this.fname = parts[0]; 15 | // this.lname = parts[1]; 16 | // } 17 | // }; 18 | 19 | // // to call 20 | // console.log(person1.fullName); //getter 21 | // person1.fullName = 'Rahul Kumar'; // setter 22 | // console.log(person1.fullName); 23 | 24 | 25 | 26 | // // try catch to throw error 27 | // try { 28 | // person1.fullName = true; 29 | // } 30 | // catch (e){ 31 | // alert(e) 32 | // } -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 6 - DOM+MODERNJS/Class 2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 16 |
17 |

Para span

18 |

Para span

19 |

Para span

20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 6 - DOM+MODERNJS/Class 2/index.js: -------------------------------------------------------------------------------- 1 | 2 | // function eventFunction() { 3 | // console.log('I have clicked on the docuemnt'); 4 | // } 5 | 6 | // document.addEventListener('click', eventFunction); 7 | 8 | // document.removeEventListener('click', eventFunction); 9 | 10 | // const content = document.querySelector('#wrapper'); 11 | 12 | // content.addEventListener('click', function(babbar) { 13 | // console.log(babbar); 14 | // }) 15 | 16 | // let links = document.querySelectorAll('a'); 17 | // let thirdLink = links[2]; 18 | 19 | // thirdLink.addEventListener('click', function(event) { 20 | // event.preventDefault(); 21 | // console.log('maza aaya, accha laga'); 22 | // }); 23 | 24 | // let myDiv = document.createElement('div'); 25 | 26 | // function paraStatus(event) { 27 | // console.log('Para ' + event.target.textContent); 28 | // } 29 | // myDiv.addEventListener('click', paraStatus); 30 | 31 | // for(let i=1; i<=100; i++) { 32 | // let newElement = document.createElement('p'); 33 | // newElement.textContent = 'This is para ' + i; 34 | 35 | // myDiv.appendChild(newElement); 36 | // } 37 | // document.body.appendChild(myDiv); 38 | 39 | let element = document.querySelector('#wrapper'); 40 | 41 | element.addEventListener('click', function(event) { 42 | if(event.target.nodeName === 'SPAN') { 43 | console.log('span pr click kia hai' + event.target.textContent); 44 | } 45 | }); -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 6 - DOM+MODERNJS/Class 3/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 |

DOM + MODERN JS CLASS 3 👇

11 | 12 | 13 | -------------------------------------------------------------------------------- /Dot-Batch(Weekly-Codes)/Week 6 - DOM+MODERNJS/Class 4/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

Hello Jee

12 | 13 | 14 | -------------------------------------------------------------------------------- /FlexGame/LEVEL 1.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 1.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 10.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 10.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 11.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 11.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 12.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 12.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 13.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 13.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 14.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 14.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 15.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 15.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 16.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 16.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 17.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 17.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 18.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 18.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 19.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 19.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 2 .jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 2 .jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 20.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 20.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 21.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 21.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 22.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 22.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 23.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 23.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 24.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 24.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 3 .jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 3 .jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 4.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 4.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 5.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 5.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 6.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 6.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 7 .jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 7 .jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 8.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 8.jpeg -------------------------------------------------------------------------------- /FlexGame/LEVEL 9.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/FlexGame/LEVEL 9.jpeg -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/ALL IN ONE CSS WITH ANIMATIONS.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/ALL IN ONE CSS WITH ANIMATIONS.pdf -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/ALL IN ONE HTML.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/ALL IN ONE HTML.pdf -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/DOM+MODERN JS CLASS 1 - HANDWRITTEN NOTES.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/DOM+MODERN JS CLASS 1 - HANDWRITTEN NOTES.pdf -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/DOM+MODERN JS CLASS 3 - HANDWRITTEN NOTES.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/DOM+MODERN JS CLASS 3 - HANDWRITTEN NOTES.pdf -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/DOM+MODERN JS CLASS 4 - HANDWRITTEN NOTES.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/DOM+MODERN JS CLASS 4 - HANDWRITTEN NOTES.pdf -------------------------------------------------------------------------------- /Handwritten Notes by Turwash/DOM+MODERNJS CLASS 2 - HANDWRITTEN NOTES.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Handwritten Notes by Turwash/DOM+MODERNJS CLASS 2 - HANDWRITTEN NOTES.pdf -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Animations.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Animations 7 | 44 | 45 | 46 |
47 |
Box
48 |
49 | 50 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Blog_website_layout.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 35 | 36 | 37 |
38 | 39 | 40 |
Content
41 | 42 |
43 | 44 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Grid_properties.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 38 | 39 | 40 |
41 |
B1
42 |
B2
43 |
B3
44 |
B4
45 |
B5
46 |
B6
47 |
48 | 49 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Grid_template_area.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Grid template area 7 | 38 | 39 | 40 |
41 | 42 | 43 |
Content
44 | 45 |
46 | 47 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Homework Questions: -------------------------------------------------------------------------------- 1 | 1) Is there anything like grid-auto-columns? 2 | 2) What is the difference between grid and inline-grid? 3 | 3) Build a layout using flex + grid. 4 | 4) Blog 2 page application on 1:48:20 in Video - 1. 5 | 5) Explore : https://gridbyexample.com/examples/example21/ 6 | 6) Declaring variable in * and :root? 7 | 7) Explore i tag + font awesome. 8 | 8) Apply media queries on portfolio website. 9 | 9) text-align values? 10 | 10) Explore rows and columns of textarea field. 11 | 11) What is both which is used in shake animation in Modern Chair Project? 12 | 12) What is display : inline-flex? 13 | 13) Apply media queries in Modern Chair Project. 14 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/ModernButton.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | #wrapper{ 7 | height: 100vh; 8 | width: 100vw; 9 | display:flex; 10 | justify-content: center; 11 | align-items: center; 12 | } 13 | .pink-btn{ 14 | position: relative; 15 | background-color: #e84949; 16 | color: white; 17 | padding: 0.8rem 2.3rem; 18 | font-size: 18px; 19 | box-shadow: 5px 5px 7px 0px #0000003f; 20 | cursor: pointer; 21 | z-index: 1; 22 | } 23 | .pink-btn::before{ 24 | /* No content to be added and hence is set as empty */ 25 | content: ""; 26 | background-color: #1f1f1f; 27 | position: absolute; 28 | top: 0; 29 | left:0; 30 | bottom: 0; 31 | right: 0; 32 | /* The black slide is moving in x-direction */ 33 | transform: scaleX(0); 34 | /* As we need slide from left to right */ 35 | transform-origin: left; 36 | transition: all 0.8s; 37 | z-index: -1; 38 | } 39 | .pink-btn:hover::before{ 40 | transform: scaleX(1); 41 | } -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/MordernButton.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Modern Button 7 | 8 | 9 | 10 |
11 |
Hire me
12 |
13 | 14 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Transitions.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Transitions 7 | 35 | 36 | 37 |
38 |
Box
39 |
40 | 41 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/Variables.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Variables 7 | 24 | 25 | 26 |
27 |
Box-1
28 |
Box-2
29 |
Box-3
30 |
Box-4
31 |
32 | 33 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/Details: -------------------------------------------------------------------------------- 1 | The images used in Modern Chair Project are uploaded in this folder. 2 | -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair1.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair2.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair3.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair4.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair5.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/chair6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/chair6.png -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color1.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color2.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color3.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color4.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color5.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/color6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/color6.jpg -------------------------------------------------------------------------------- /Homework and all codes/Animations_and_Responsiveness/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Animations_and_Responsiveness/images/favicon.ico -------------------------------------------------------------------------------- /Homework and all codes/Backend/Homework Questions: -------------------------------------------------------------------------------- 1 | 1) What is idempotent? Out of 4 requests of HTTP, which are idempotent? 2 | 2) What is process.exit(1) in Backend Class 2 in config folder. 3 | 3) What is cookie parser? Why we need cookie parser? 4 | 4) Explore verify,compare and sign functions used in auth app. 5 | 5) Why header is considered as most secure way to fetch token? 6 | 6) Study about cookie hijacking and token hijacking. 7 | 7) What is difference between Relational and Non relational DB? Out of these 2, MongoDB comes under? 8 | 8) Why name of the image changed when we uploaded on cloudinary? 9 | 9) Add upper limit of 5MB as validation in videoupload of FileUpload Project. 10 | 10) Compress image by defining height and width of image. 11 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Document 10 | 23 | 24 | 25 |
I am Span 1
26 |
I am Span 2
27 | 28 | 29 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | CSS 8 | 26 | 27 | 28 |
29 |
HTML
30 |
CSS
31 |
JS
32 |
React
33 |
Vue
34 |
Angular
35 |
Express
36 |
Mongo
37 |
38 | 39 | 40 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/CSS_Units.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 23 | 24 | 25 |
Hello 26 |
Hello
27 |
28 | 29 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Dimension_Properties.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 25 | 26 | 27 |
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro a ipsam voluptatibus, est reiciendis et aperiam Lorem ipsum dolor sit amet consectetur adipisicing elit. Inventore, voluptate.
28 |
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nam obcaecati cumque repudiandae deleniti iusto veritatis explicabo cupiditate nobis ut maxime natus, incidunt odit nihil officia impedit ratione inventore? Sapiente, aperiam.
29 | 30 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Flex.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 36 | 37 | 38 |
39 |
box-1
40 |
box-2
41 |
box-3
42 |
box-4
43 |
44 | 45 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Gradients.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 26 | 27 | 28 |
This is a DIV element
29 |
This is a DIV element
30 | 31 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Homework Questions: -------------------------------------------------------------------------------- 1 | 1) What are universal, nested and attribute selectors? 2 | 2) Explore font-family,font-weight,font-style,emphasis and importance,add external fonts (google fonts). 3 | 3) Make a box of size 100x100 px and then put in 1000 words content. What will happen? (Think in terms of overflow) 4 | 4) Difference between 1% and 1viewport width. 5 | 5) Make web development bootcamp card. 6 | 6) Explore conic gradients. 7 | 7) How can we add border using shadows? 8 | 8) What is spread radius in shadows? 9 | 9) Position text in all corners and center of an image. 10 | 10) Learn about matrix in 2D transforms. 11 | 11) Why no need to turn on the perspective in case of rotateZ? 12 | 12) Was there a need of giving z-index : -1; in container when we were trying to make sure that Adventure text is visible? (Parallax Effect Website) 13 | 13) Was there a need of position : relative; in container? 14 | 14) Apply external font to Adventure text in Parallax Effect Website. (Poppins , sans serif) 15 | 15) What is the difference between img and background-image tab ? (Maybe check the difference between the print of both of these) 16 | 16) Study grid row , grid column shorthand notations. 17 | 17) Explore some properties - justify content, align content, justify self, justify items, align items, align self, place items, place self 18 | 18) Make : https://codehelp-product-card.netlify.app/ 19 | 19) Figma Assignment Link : https://www.figma.com/file/yCb8S93CG1ckFBLeFQy98l/CodeHelp-Figma-Assignment--1 20 | 20) Complete image gallery project using grids. 21 | 21) Attempt CSS Quiz and Debugging Exercises. 22 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Positioning_Properties.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 35 | 36 | 37 |
38 |
A
39 |
B
40 |
C
41 |
D
42 |
43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Shadows.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 21 | 22 | 23 |

This is my heading

24 |
Hi
25 | 26 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Transforms.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 41 | 42 | 43 | 44 | 45 | 46 |
Static
47 |
Translated
48 |
Scaled
49 |
Rotated
50 | 51 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/Ways_to_add_css.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 23 | 24 | 25 | 26 | 27 | 28 |

Hello jee

29 |

Hello sir

30 |

Hello sir jee

31 |

Checking Specificity

32 | 33 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/box_model.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 31 | 32 | 33 |
A
34 |
B
35 |
C
36 | 37 | 38 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/colors.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 16 | 17 | 18 |

Hello sir

19 | 20 | -------------------------------------------------------------------------------- /Homework and all codes/CSS/imageGallery.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | #wrapper{ 7 | height: 100vh; 8 | overflow-x: hidden; 9 | overflow-y: auto; 10 | } 11 | .container{ 12 | height: 100%; 13 | max-width: 1200px; 14 | margin: 0 auto; 15 | padding: 20px; 16 | } 17 | .container h1{ 18 | margin: 20px 0; 19 | text-align: center; 20 | margin-bottom:20px ; 21 | font-size: 3rem; 22 | } 23 | .gallery{ 24 | display: flex; 25 | flex-wrap: wrap; 26 | justify-content: space-between; 27 | } 28 | .card{ 29 | /* 32 * 3 = 96% and 4% is left and hence is used for spacing */ 30 | width: 32%; 31 | /* Text to be overlapped over the image and hence parent should be non-static */ 32 | position: relative; 33 | margin-bottom: 20px; 34 | border-radius: 10px; 35 | overflow: hidden; 36 | } 37 | .card img{ 38 | width: 100%; 39 | height: 100%; 40 | filter: grayscale(100%); 41 | box-shadow: 0 0 20px #333; 42 | } 43 | .card:hover{ 44 | transform: scale(1.03); 45 | transition: 2s; 46 | filter: drop-shadow(0 0 10px #333); 47 | transition: 0.3s; 48 | } 49 | .card:hover img{ 50 | filter: grayscale(0%); 51 | } 52 | .card figcaption{ 53 | /* We need to overlap the text over the image */ 54 | position: absolute; 55 | bottom: 0; 56 | left: 0; 57 | padding: 25px; 58 | width: 100%; 59 | height: 20%; 60 | font-size: 16px; 61 | font-weight: 500; 62 | color: #fff; 63 | /* To apply hidden property */ 64 | opacity: 0; 65 | border-radius: 0 0 10px 10px; 66 | background-color: linear-gradient(0deg , rgba(0,0,0,0.5) 0%,rgba(255,255,255,0) 100%); 67 | transition: 0.3s; 68 | } 69 | .card:hover figcaption{ 70 | opacity: 1; 71 | transform: scale(1.03); 72 | } 73 | -------------------------------------------------------------------------------- /Homework and all codes/Git_and_GitHub/Git_and_GitHub_Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Git_and_GitHub/Git_and_GitHub_Cheatsheet.pdf -------------------------------------------------------------------------------- /Homework and all codes/Git_and_GitHub/Git_and_GitHub_Notes.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Git_and_GitHub/Git_and_GitHub_Notes.pdf -------------------------------------------------------------------------------- /Homework and all codes/Git_and_GitHub/Homework Questions: -------------------------------------------------------------------------------- 1 | 1) Implement the git commands practically. 2 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

Web Development Master Course

12 | 13 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

CodeHelp

12 |

CodeHelp

13 |

CodeHelp

14 |

CodeHelp

15 |
CodeHelp
16 |
CodeHelp
17 | 18 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |

This is a Heading 12 |

This is a paragraph.

13 | 14 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/4.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 
12 |         My house is red - a little house;
13 |         A happy child am I:
14 |         I laugh and play the whole day long,
15 |         I hardly ever cry.
16 |     
17 |         I have a tree, a green, green tree,
18 |         To shade me from the sun;
19 |         And under it I often sit,
20 |         When all my play is done.
21 |
22 | 23 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/5.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/6.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
12 | Email: 13 | 14 |
15 | 16 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Div_and_Span.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 |
This is div tag

12 | 13 | This is span tag 14 | 15 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Forms.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 |
Welcome to Codehelp
18 | 19 | 21 | 22 |
27 | 28 | 30 | 31 |
34 | 35 | 36 |

Welcome to codehelp

37 |
38 | 39 | 40 | 41 |

42 | 43 | 44 | 45 |

46 | 47 | 48 |
49 | 50 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/HTML_Cheatsheet.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/HTML_Cheatsheet.pdf -------------------------------------------------------------------------------- /Homework and all codes/HTML/HTML_Notes.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/HTML_Notes.pdf -------------------------------------------------------------------------------- /Homework and all codes/HTML/Links.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | Call me 12 |
13 | 14 | Mail me 15 | 16 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Semantic_Tags.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 13 | 14 | 15 | 16 |
17 |

We are inside header tag

18 |
19 | 20 | 25 | 26 |
27 |

We are inside the article tag

28 |
29 | 30 | 31 | 32 | 35 | 36 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Starter_Code.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | Document 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Table1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 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 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 |
Time Table
HoursMonTueWedThuFri
ScienceMathsScienceMathsArts
SocialHistoryEnglishSocialSports
Lunch
ScienceMathsScienceMathsProject
SocialHistoryEnglishSocial
60 | 61 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Tables.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Tables 8 | 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 | 42 | 43 | 44 | 45 | 46 |
My Table
MonthsSavings
Jan100
Feb200
Mar300
Total900
47 | 48 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Tables_Classwork_Exercise.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 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 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 |
State of healthFasting ValueAfter eating
MinimumMaximum2 hours after eating
Healthy70100Less than 140
Pre-diabetes101126140 to 200
DiabetesMore than 126N/AMore than 200
53 | 54 | 55 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/Tables_Depth.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 |
Month
Jan100
Feb200
300
600
35 | 36 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/android-chrome-192x192.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/android-chrome-512x512.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/apple-touch-icon.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/browserconfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | #da532c 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/favicon-16x16.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/favicon-32x32.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/favicon.ico -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/HTML/favicon/mstile-150x150.png -------------------------------------------------------------------------------- /Homework and all codes/HTML/favicon/site.webmanifest: -------------------------------------------------------------------------------- 1 | { 2 | "name": "", 3 | "short_name": "", 4 | "icons": [ 5 | { 6 | "src": "/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "theme_color": "#ffffff", 17 | "background_color": "#ffffff", 18 | "display": "standalone" 19 | } 20 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/Homework Questions: -------------------------------------------------------------------------------- 1 | 1) Do we need an active internet connection to write code of JS in console window of Browswer? 2 | 2) Java vs Javascript. 3 | 3) Redeclaration of variable via var keyword is possible or not? 4 | 4) Why was there a strike on variable name? 5 | 5) Do combining and slicing on objects. 6 | 6) Try sorting on objects. 7 | 7) Sort the numbers using callback function such that string nature is ignored. 8 | 8) Explore finally block in error handling. 9 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/Homework.js: -------------------------------------------------------------------------------- 1 | // Redeclaration of variable using var keyword 2 | var name = 'Love'; 3 | function walk(){ 4 | var name = 'Bhavya'; 5 | console.log(name); 6 | } 7 | walk(); 8 | // Combining method on objects present in arrays 9 | let arr1 = [{1:'Bhavya'},{2:'Love'}]; 10 | let arr2 = [{3:'Rahul'},{4:'Shardul'}]; 11 | let combined = arr1.concat(arr2); 12 | console.log(combined); 13 | // Slicing method on objects present in arrays 14 | let sliced = combined.slice(1,3); 15 | console.log(sliced); 16 | // Sorting in objects 17 | let arr3 = [{2:'Bhavya'},{3:'Love'},{1:'Rahul'}]; 18 | arr3.sort((a, b) => { 19 | const keyA = parseInt(Object.keys(a)[0]); 20 | const keyB = parseInt(Object.keys(b)[0]); 21 | 22 | return keyA - keyB; 23 | }); 24 | console.log(arr3); 25 | // Sorting on numbers 26 | let nums = [10,1,4,40]; 27 | nums.sort((a,b)=>(a-b)); 28 | console.log(nums); 29 | // Finally block -> Executed regardless of the result of try block -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS1.js: -------------------------------------------------------------------------------- 1 | // Print on console 2 | console.log('Hello jee'); 3 | 4 | // Variable in JS 5 | let a = 5; 6 | console.log(a); 7 | let b = 'Bhavya'; 8 | console.log(b); 9 | 10 | // Constants in JS 11 | const c = 5; 12 | // c=6; // This gives an error 13 | 14 | // Dyanamic Typing 15 | let number = 5; 16 | number = 'Sir'; 17 | console.log(number); // Sir will be printed here 18 | 19 | // Operators in JS 20 | // Arithemetic Operators 21 | let x = 2; 22 | let y = 3; 23 | console.log(x+y); 24 | console.log(x-y); 25 | console.log(x*y); 26 | console.log(x/y); 27 | console.log(x%y); 28 | console.log(x**y); 29 | // Comparasion operators 30 | console.log(x>y); 31 | console.log(x>=y); 32 | console.log(x=18) ? 'I can vote' : 'I can not vote'; 39 | console.log(status); 40 | 41 | // Control statements 42 | // if else 43 | let marks = 96; 44 | if(marks >= 90){ 45 | console.log('Grade = A'); 46 | } 47 | else if(marks >= 80){ 48 | console.log('Grade = B'); 49 | } 50 | else{ 51 | console.log('Grade = C'); 52 | } 53 | // switch case 54 | let num = 2; 55 | switch(num){ 56 | case 1 : console.log('a'); break; 57 | case 2 : console.log('b');break; 58 | default : console.log('d'); 59 | } 60 | 61 | // Loops 62 | // for loop 63 | for(let i = 0;i<5;i++){ 64 | console.log(i); 65 | } 66 | // while loop 67 | let i = 0; 68 | while(i<5){ 69 | console.log(i); 70 | i++; 71 | } 72 | // do while loop 73 | let j = 0; 74 | do{ 75 | console.log(j); 76 | j++; 77 | } 78 | while(j<10); 79 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS2.js: -------------------------------------------------------------------------------- 1 | // Creation of object 2 | const rectangle = { 3 | length:1, 4 | breadth:2, 5 | // Defining the method 6 | // draw : function(){ 7 | // console.log('draw'); 8 | // } 9 | draw(){ 10 | console.log('draw'); 11 | } 12 | } 13 | // Factory function 14 | function createRectangle(l,b){ 15 | let rectangle = { 16 | length:l, 17 | breadth:b 18 | } 19 | return rectangle; 20 | }; 21 | let a = createRectangle(5,6); 22 | console.log(a.length); 23 | // Constructor function 24 | function Rectangle(l,b){ 25 | this.length = l; 26 | this.breadth = b; 27 | this.draw = function(){ 28 | console.log('drawing'); 29 | } 30 | } 31 | let rectangleObj = new Rectangle(5,6); 32 | console.log(rectangleObj.length); 33 | console.log(rectangleObj.breadth); 34 | // Dyanamic nature of object 35 | let obj = { 36 | a : 1, 37 | b : 2 38 | } 39 | obj.c = 3; 40 | delete obj.c; 41 | // Iterating through objects 42 | let rectangle1 = { 43 | length : 2, 44 | breadth : 4 45 | } 46 | // for in loop 47 | for(let key in rectangle1){ 48 | console.log(key,rectangle1[key]); 49 | } 50 | // for of loop 51 | for(let key of Object.entries(rectangle1)){ 52 | console.log(key); 53 | } 54 | // Way to find whether a particular property exist in object or not 55 | if('color' in rectangle1){ 56 | console.log('Present'); 57 | } 58 | else{ 59 | console.log('Absent'); 60 | } 61 | // Object cloning 62 | // Iteration 63 | let src = {value : 10}; 64 | let dest = {}; 65 | for(let key in src){ 66 | dest[key] = src[key]; 67 | } 68 | // Assign 69 | let dest1 = Object.assign({},src); 70 | // Spread 71 | let dest2 = {...src}; -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS4.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript Basics/JS4.js: -------------------------------------------------------------------------------- 1 | // Creating functions in Javascript 2 | // Method - 1 3 | function run(){ 4 | console.log('running'); 5 | } 6 | // function invoke 7 | run(); 8 | // Method - 2 9 | // Named function assignment 10 | let stand = function walk(){ 11 | console.log('walking'); 12 | } 13 | stand(); 14 | // Anonymous function assignment 15 | let stand1 = function (){ // function name not present 16 | console.log('walking1'); 17 | } 18 | stand1(); 19 | // Dyanamic nature in JS 20 | function sum(a,b){ 21 | let total = 0; 22 | for(let val of arguments){ 23 | total += val; 24 | } 25 | return total; 26 | } 27 | console.log(sum(1,2,3,4,5)); 28 | // Rest operator 29 | function sum(...args){ 30 | console.log(args); 31 | } 32 | sum(1,2,3,4,5); 33 | // Default parameters 34 | function sum(a,b=2,c=3){ 35 | return a + b + c; 36 | } 37 | console.log(sum(1)); 38 | // Getter and setter 39 | let person = { 40 | fName : 'Bhavya', 41 | lName : 'Bhalla', 42 | get fullName(){ 43 | return `${person.fName} ${person.lName}`; 44 | }, 45 | set setName(val){ 46 | // if(typeof(val) !== String){ 47 | // throw new Error("You have not passed a string sir"); 48 | // } 49 | let parts = val.split(' '); 50 | this.fName = parts[0]; 51 | this.lName = parts[1]; 52 | } 53 | } 54 | console.log(person.fullName); 55 | person.setName = 'Love Babbar'; 56 | console.log(person.fullName); 57 | // Error handling 58 | try{ 59 | person.setName = 1; 60 | } 61 | catch(e){ 62 | alert('You have not passed a string'); 63 | } 64 | 65 | // Reducing an array 66 | let arr = [1,2,3,4]; 67 | let totalSum = arr.reduce((accumulator,currentValue)=>accumulator + currentValue,0); 68 | console.log(totalSum); 69 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript DOM Manipulation and Modern Javascript/Counter.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Counter APP 7 | 8 | 9 | 10 | 11 |
12 |
Increment and Decrement
13 |
14 | 15 | 18 | 19 |
-1
20 | 21 | 24 |
25 |
26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript DOM Manipulation and Modern Javascript/Counter.js: -------------------------------------------------------------------------------- 1 | const countValue = document.querySelector('#counter'); 2 | const increment = () => { 3 | let value = countValue.innerText; 4 | // Here the text will be in form of string and hence convert it to integer 5 | intValue = parseInt(value); 6 | intValue = intValue + 1; 7 | countValue.innerText = intValue; 8 | } 9 | const decrement = () => { 10 | let value = countValue.innerText; 11 | // Here the text will be in form of string and hence convert it to integer 12 | intValue = parseInt(value); 13 | intValue = intValue - 1; 14 | countValue.innerText = intValue; 15 | } 16 | -------------------------------------------------------------------------------- /Homework and all codes/Javascript DOM Manipulation and Modern Javascript/DOM_ClassI.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
This is a heading
11 |
12 |

13 | 

14 |         
15 |     

16 |     

17 |         Hello World
18 |     

19 | 
20 |     
21 |     

22 |         
Hello World

23 |     

24 | 
25 |     
26 |     

27 |         This is red in color and has background color aqua
28 |     

29 |     
30 | 
31 | 
32 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/DOM_ClassII.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 |     
 5 |     
 6 |     Document
 7 | 
 8 | 
 9 |     
Hello

10 |     
11 |     Go to codehelp
12 |     
13 |     

14 |         
Para Span

15 |     

16 |     
17 | 
18 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/DOM_ClassIII.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 |     
 5 |     
 6 |     Document
 7 | 
 8 | 
 9 |     
10 | 
11 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/DOM_ClassIII.js:
--------------------------------------------------------------------------------
 1 | // Performance
 2 | 
 3 | // Initial code
 4 | const t1 = performance.now();
 5 | for(let i = 1;i<=10;i++){
 6 |     let newElement = document.createElement('p');
 7 |     newElement.textContent = 'This is para - ' + i;
 8 |     document.body.appendChild(newElement);
 9 | }
10 | const t2 = performance.now();
11 | console.log(t2-t1);
12 | // Optimizing code
13 | const t3 = performance.now();
14 | let myDiv = document.createElement('div');
15 | for(let i = 1;i<=10;i++){
16 |     let element = document.createElement('p');
17 |     element.textContent = 'This is para - ' + i;
18 |     myDiv.appendChild(element);
19 | }
20 | document.body.appendChild(myDiv);
21 | const t4 = performance.now();
22 | console.log(t4-t3);
23 | // Using document fragment
24 | const t5 = performance.now();
25 | let fragment = document.createDocumentFragment();
26 | for(let i = 1;i<=10;i++){
27 |     let element = document.createElement('p');
28 |     element.textContent = 'This is para - ' + i;
29 |     fragment.appendChild(element);
30 | }
31 | document.body.appendChild(fragment);
32 | const t6 = performance.now();
33 | console.log(t6-t5);
34 | // setTimeout method
35 | setTimeout(function(){
36 |     console.log('Hello jee');
37 | },4000);


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/DOM_ClassIV.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 |     
 5 |     
 6 |     Document
 7 | 
 8 | 
 9 |     
10 |     
11 | 
12 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/Homework Question:
--------------------------------------------------------------------------------
1 | 1) Study outerHTML (Rarely used)
2 | 2) Study remove method to remove the child element as it does not require parent element to be known already.
3 | 3) Explore dispatchEvent
4 | 4) How to enable event listener in target phase?
5 | 5) Watch Philip Roberts video on event loop
6 | 6) get/post/put/delete in API
7 | 7) classes and export modules in JS.
8 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/Homework.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 |     
 5 |     
 6 |     Document
 7 | 
 8 | 
 9 |     
10 |     
Hello Jee

11 |     
12 |     
13 |     

14 |         
Hello jee

15 |     

16 |     
17 |     
Hello Sir Jee

18 |     
19 |     
20 | 
21 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/Homework.js:
--------------------------------------------------------------------------------
 1 | // Outer HTML
 2 | let element = document.querySelector('.para');
 3 | // Comment all the below code to make sure change function runs
 4 | function change(){
 5 |     element.outerHTML = '
Hello jee
';
 6 | }
 7 | // // Remove method
 8 | // let childElement = document.querySelector('.child');
 9 | // childElement.remove();
10 | // // dispatchEvent
11 | // let event1 = new Event('Click');
12 | // let element1 = document.querySelector('.para1');
13 | // element.dispatchEvent(event1);
14 | // // Importing a function
15 | // import sum from './add.js';
16 | // const result = sum(2,3);
17 | // console.log(result);
18 | // // Importing a class
19 | // import {Person} from './person.js';
20 | // const john = new Person('John',30);
21 | // john.sayHello();
22 | 


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/ShareModal.js:
--------------------------------------------------------------------------------
 1 | const modal = document.querySelector('.modal');
 2 | const overlay = document.querySelector('.overlay');
 3 | 
 4 | // Modal open function
 5 | function openModal(){
 6 |     modal.classList.add('active');
 7 |     // overlay is the blurry filter
 8 |     overlay.classList.add('overlayactive');
 9 | }
10 | // Modal close function
11 | function closeModal(){
12 |     modal.classList.remove('active');
13 |     overlay.classList.remove('overlayactive'); 
14 | }


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/add.js:
--------------------------------------------------------------------------------
1 | // exporting a function 
2 | export default function sum(a,b){
3 |     return a + b;
4 | }


--------------------------------------------------------------------------------
/Homework and all codes/Javascript DOM Manipulation and Modern Javascript/person.js:
--------------------------------------------------------------------------------
1 | export class Person{
2 |     constructor(name,age){
3 |         this.name = name;
4 |         this.age = age;
5 |     }
6 |     sayHello(){
7 |         console.log(`Hello, My name is ${this.name} and age is ${this.age}`);
8 |     }
9 | }


--------------------------------------------------------------------------------
/Homework and all codes/Javascript Mini Projects/Homework Questions:
--------------------------------------------------------------------------------
1 | 1) Password Generator
2 |   --> Apply box shadow to div of strength showing color.
3 | 2) Weather App
4 |   --> code catch block of fetchUserWeatherInfo
5 |   --> Difference between JSON String and JSON Object. ALso understand difference between res.json() and JSON.parse().
6 |   --> Show an alert when no geolocation service supported.
7 |   --> Implement catch block of fetchSearchWeatherInfo.
8 | 


--------------------------------------------------------------------------------
/Homework and all codes/React/Homework Questions:
--------------------------------------------------------------------------------
1 | 1) Explore about props.className.
2 | 2) Why const is written in const [title,setTitle] = useState(props.title);
3 | 3) setTitle('popcorn') is immediate or take some time i.e. scheduled?
4 | 4) Update window size on UI after dragging.
5 | 5) Study documentation of forms. Explore fieldset and legend tag in forms in react.
6 | 6) Style form app : https://codehelp-form-demo.netlify.app/
7 | 7) In signup form, when we click eye button, both the password becomes text. Fix this.
8 | 8) Study about state,action and action.payload in reducers in redux.
9 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Discord Clone/Details:
--------------------------------------------------------------------------------
1 | 1) Code for Discord Clone without Responsiveness code.
2 | 2) You need to install the node modules folder
3 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Discord Clone/main.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Discord Clone/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "scripts": {
 3 |     "start": "vite"
 4 |   },
 5 |   "devDependencies": {
 6 |     "autoprefixer": "^10.4.14",
 7 |     "postcss": "^8.4.24",
 8 |     "tailwindcss": "^3.3.2",
 9 |     "vite": "^4.3.9"
10 |   },
11 |   "dependencies": {
12 |     "feather": "^0.0.6"
13 |   }
14 | }
15 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Discord Clone/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: {
3 |     tailwindcss: {},
4 |     autoprefixer: {},
5 |   },
6 | }
7 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Discord Clone/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('tailwindcss').Config} */
 2 | module.exports = {
 3 |   content: ["*"],
 4 |   theme: {
 5 |     extend: {},
 6 |   },
 7 |   plugins: [],
 8 | }
 9 | 
10 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Homework Questions:
--------------------------------------------------------------------------------
1 | 1) In box section of Razorpay Clone, add the properties which comes when hover is done.
2 | 2) Code footer section of Razorpay website.
3 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/Details:
--------------------------------------------------------------------------------
1 | 1) Here is the code for razorpay clone without responsiveness
2 | 2) You need to add the node modules folder as well
3 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/CTABg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/Details:
--------------------------------------------------------------------------------
1 | Here are all the images that we used in the Razorpay Clone.
2 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/Xicon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 
5 | 
6 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/autopay-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 
5 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/buisness-banking.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/buisness-banking.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/capital-credit-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/comanies.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/comanies.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/core-features-sectionBg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/dashboard-reporting-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/facebook-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/fake-company-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/fake-company-logo.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/favicon.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/feature-section-2BG.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/feature-section1-dottedrows.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/feature-section1-dottedrows.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/features-wave.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/features2-wave.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/footer-certificate-1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/footer-certificate-1.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/footer-certificate-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/footer-certificate-2.jpg


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/github-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/hero-illustration.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/hero-illustration.jpg


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/hero-shape.svg:
--------------------------------------------------------------------------------
 1 | 
 8 |           
12 |         


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/industry-support-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instagram-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instant-activation-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instant-settlement-bg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instant-settlement-bghover.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instant-settlement-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/instantsettlement-bg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/linkedin-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/magic-checkout-bg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-button-bg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-button.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-buttons-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-gateway.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-suite.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payment-suite.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/payouts-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/quotes.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/route-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/secure-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/simple-pricing.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/smart-collect-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/subscriptions-icon.svg:
--------------------------------------------------------------------------------
1 | 
2 | 
3 | 
4 | 
5 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/testimonial.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/testimonial.jpg


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/twitter-icon.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/upi-autopay-bg.svg:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/x-flame-1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/x-flame-1.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/images/x-flame-2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/Homework and all codes/Tailwind CSS/Razorpay Clone/images/x-flame-2.png


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/main.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "scripts": {
 3 |     "start": "vite"
 4 |   },
 5 |   "devDependencies": {
 6 |     "autoprefixer": "^10.4.14",
 7 |     "postcss": "^8.4.24",
 8 |     "tailwindcss": "^3.3.2",
 9 |     "vite": "^4.3.9"
10 |   },
11 |   "dependencies": {
12 |     "feather": "^0.0.6"
13 |   }
14 | }
15 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: {
3 |     tailwindcss: {},
4 |     autoprefixer: {},
5 |   },
6 | }
7 | 


--------------------------------------------------------------------------------
/Homework and all codes/Tailwind CSS/Razorpay Clone/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('tailwindcss').Config} */
 2 | module.exports = {
 3 |   content: ["*"],
 4 |   theme: {
 5 |     extend: {fontFamily: {
 6 |       mullish: ["Mulish", "sans-serif"],
 7 |     },
 8 |     colors: {
 9 |       deepBlue: "#02042a",
10 |       lightBlue: "#2b84ea",
11 |       lightBlue300: "#4b94ed",
12 |       lightBlue500: "#0b72e7",
13 |       greenLight: "#61cea6",
14 |       grayText: "#818597",
15 |       lightGray: "#e2e2e2",
16 |       grayBlue: "#344a6c",
17 |       deepBlueHead: "#162f56",
18 |       gray2: "#525a76",
19 |     },},
20 |   },
21 |   plugins: [],
22 | }
23 | 
24 | 


--------------------------------------------------------------------------------
/Homework and all codes/readme-style:
--------------------------------------------------------------------------------
 1 | 
38 | 


--------------------------------------------------------------------------------
/index Web Dev Batch.docx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SaurabSharma09/Dot-Batch-All-Content/92a71a9c2e3bb48d48b87d8363c046df7bcb2888/index Web Dev Batch.docx


--------------------------------------------------------------------------------