Scribd
Upload
15 views

vs code extenttion commands

The document contains various code snippets and images related to a responsive website for a food service. It includes navigation bar configurations, sections for banners, menus, healthy options, delivery and payment methods, and customer appreciation. Additionally, it provides Git configuration commands and dependencies for a React application.

Uploaded by

tamadaashokkumar4
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
15 views

vs code extenttion commands

The document contains various code snippets and images related to a responsive website for a food service. It includes navigation bar configurations, sections for banners, menus, healthy options, delivery and payment methods, and customer appreciation. Additionally, it provides Git configuration commands and dependencies for a React application.

Uploaded by

tamadaashokkumar4
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

cntrl + swift + p ==> code snap take beautiful screen shots

cntrl + backspace => hungry delete delete spaces

extrasmall <576
small >= 576
md >= 768
lg >= 992
xl >= 1200
xxl >= 1400

Banner Section

navicon ="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/food-munch-
img.png"
backgroundImage =
"https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/foodmunch-banner-
bg.png

why choose us

https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/food-serve.png
https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/fruits-img.png
https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/offers-img.png

explore menu

1 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-ginger-fried-
img.png
2 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-veg-starters-
img.png
3 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-soup-img.png
4 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-grilled-seafood-
img.png
5 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-hyderabadi-
biryani-img.png
6 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-mushroom-
noodles-img.png
7 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-gluten-img.png
8 https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/em-coffee-bourbon-
img.png

healthy section

https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/healthy-food-plate-
img.png

delivery and payment section


https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/delivery-payment-
section-img.png
<div class="mt-3">
<img src="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-
responsive-website/visa-card-img.png" class="payment-card-img" />
<img src="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-
responsive-website/master-card-img.png" class="payment-card-img" />
<img src="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-
responsive-website/paypal-card-img.png" class="payment-card-img" />
<img src="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-
responsive-website/american-express-img.png" class="payment-card-img" />
</div>

footer section
"https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/food-munch-logo-
light.png"

thanking customers section


https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/thanking-customers-
section-img.png

git config --global user.email "[email protected]"


git config --global user.username "Tamadaashokkumar"

git remote remove origin

"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-icons": "^5.5.0",
"react-loader-spinner": "^6.1.6",
"react-router-dom": "^7.4.1"

npm install --legacy-peer-deps

<nav class="fixed-top navbar navbar-expand-lg navbar-light bg-light NavBarSection


p-3">
<div class="container">
<a class="navbar-brand" href="" id="navbarLogo">
Ashok
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav ml-auto">
<a class="nav-link active" href="#">
Login <span class="sr-only">(current)</span>
</a>
<a class="nav-link" href="#">
SignUp
</a>
</div>
</div>
</div>
</nav>
);
<nav
class="fixed-top navbar navbar-expand-lg navbar-light bg-light navContainer"
>
<div class="container">
<a class="navbar-brand" href="#bannerSection">
<img
src="https://d1tgh8fmlzexmh.cloudfront.net/ccbp-responsive-website/
food-munch-img.png"
class="navbar-image"
alt="navbarimage"
/>
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav ml-auto">
<a class="nav-link active" href="#whyChooseUsSection">
Why Choose Us? <span class="sr-only">(current)</span>
</a>
<a class="nav-link" href="#exploreMenuSection">Explore Menu</a>
<a class="nav-link" href="#deliveryAndPaymentSection"
>Delivery & Payment</a
>
<a class="nav-link" href="#FloowUsSection">Follow Us</a>
</div>
</div>
</div>
</nav>

.itemSection {
width: 100%;
display: flex;
align-items: center;
margin-top: 100px;
}
.gallery {
width: 150px;
}
.gallery img {

<div class="sc-dtBdUo gzvYBM sc-kOPcWz fFPUzA"><div class="sc-aXZVg iwOBvp sc-


kOHTFB jKfDUb"></div><div class="sc-aXZVg kCePhW sc-kOHTFB jKfDUb"> 50% OFF UPTO
₹100</div><div class="sc-aXZVg cZfNzk sc-kOHTFB jKfDUb"></div></div>
width: 100%;
}

You might also like