diff --git a/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/Sample Code.png b/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/Sample Code.png new file mode 100644 index 0000000..26a6bb0 Binary files /dev/null and b/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/Sample Code.png differ diff --git a/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/index.html b/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/index.html new file mode 100644 index 0000000..35cd95c --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/01_Card_TopImage/index.html @@ -0,0 +1,72 @@ + + + + +
+ + Placeholder image + + +
+ Featured +
+ +
+ +
Fire-Boltt Hurricane 1.3" Cu...
+ +
+

Gray Strap,Free Size

+

₹1,299 ₹8,999 85% off +

+
+ +

Bank offer

+ +
+ + + +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+
+
+ 2 days ago +
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/Sample Code.png b/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/Sample Code.png new file mode 100644 index 0000000..9b6b3d4 Binary files /dev/null and b/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/Sample Code.png differ diff --git a/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/index.html b/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/index.html new file mode 100644 index 0000000..06b6f5d --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/02_Card_BottomImage/index.html @@ -0,0 +1,77 @@ + + + + + +
+ + +
+ Featured +
+ +
+ +
Blog
+ +
+

Some quick example text to build on the card title and make up the bulk of the card's content.

+

Some quick example text to build on the card title and make up the bulk of the card's content.

+
+ +

Last updated 3 mins ago

+ +
+ + + +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+ + +
+ + HTML + + + + React + + + + Laravel + + +
+
+ +
+ 2 days ago +
+ + + Placeholder image + +
diff --git a/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/index.html b/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/index.html new file mode 100644 index 0000000..a4706ed --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/index.html @@ -0,0 +1,74 @@ + + + + +
+
+ +
+ Placeholder image +
+ + +
+ +
+ +
Dell 14 Laptop, 12th Gen Intel Core i3-1215U Processor/8GB/512GB SSD/Intel UHD Graphics/14.0"(35.56cm) FHD/Windows 11 + MSO'21/15 Month McAfee/Spill-Resistant
+ +
+

500+ bought in past month. +

+

₹34,990 M.R.P: ₹57,778 (39% off) +

+
+ +

Flat Rs 1500 Off on ICICI Bank Credit CardFlat Rs 1500 Off on ICICI Bank Credi…

+ +
+ +
    +
  • FREE delivery Fri, 19 Apr
    • +
  • Or fastest delivery Tomorrow,18 Apr
    • +
  • Service: Device Setup
    • +
+ +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+ + +
+ + Add to cart + + + + Twitter + + + + LinkedIn + + +
+
+
+ +
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/sample code.png b/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/sample code.png new file mode 100644 index 0000000..c4bbc3c Binary files /dev/null and b/SubmittedAssignments/Gauri_Madale/03_Card_LeftImage/sample code.png differ diff --git a/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/Sample Code.png b/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/Sample Code.png new file mode 100644 index 0000000..b281be4 Binary files /dev/null and b/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/Sample Code.png differ diff --git a/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/index.html b/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/index.html new file mode 100644 index 0000000..4b616ae --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/04_Card_RightImage/index.html @@ -0,0 +1,72 @@ + + + + +
+
+ +
+ +
+ +
Colour-rich Display
+ +
+

Experience the true essence of colours with a remarkable 12.7 million colour palette and 7 picture modes, ensuring every frame is presented with unparalleled clarity and precision. +

+

Some quick example text to build on the card title and make up the bulk of the card's content +

+
+ +

Last updated 3 mins ago

+ +
+ +
    +
  • An item
    • +
  • A second item
    • +
  • A third item
    • +
+ +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+ + +
+ + Facebook + + + + Twitter + + + + LinkedIn + + +
+
+
+ +
+ Placeholder image +
+
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.css b/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.css new file mode 100644 index 0000000..b6e8097 --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.css @@ -0,0 +1,44 @@ +body { + background-color:black; + color:white; +} +.card{ + --bs-card-border-width:none; + background-color:black; + +} +.card-title { + color:accent-color; + font-size:15px; + + + +} +p:hover{ + --bs-caed-title-color:blue; + font-width:bold; +} +.pb-1 p{ + color:white; + /* font-size:25px; */ + /* font-style:bold; */ + font-size: 24px; + line-height: 30px; + font-weight: 600; + letter-spacing: -1px; + + +} +img:hover { + animation:pulse 1s ease-in-out; + +} +@keyframes pulse { + from {transform:scale(1);} + to {transform:scale(1.1);} + +} +.mb-3{ + font-size:15px; +} + \ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.html b/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.html new file mode 100644 index 0000000..fb7e042 --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/05_CardsSection_Top/index.html @@ -0,0 +1,66 @@ + + + + +
+
+
+
+
+ Placeholder image +
+

Caroline Forsey

+
+

The Top Benefits of AI for Marketers,State of AI Data

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Caroline Forsey

+
+

AI Tools to Help You Grow Your AI Graphic Business. +

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Caroline Forsey

+
+

When Is the Best Time to Post on Instagram in 2023?

+
+
+ +
+
+
+
+
+ +

ABOUT US

+

Architecting the Digital Future

+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmo tempor incididunt ut labore et dolore magna aliqua.

+ + About Us + + +
+ +
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.css b/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.css new file mode 100644 index 0000000..9f63c3d --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.css @@ -0,0 +1,54 @@ + + +.card-title { + font-family: 'Raleway', Verdana, Arial, Helvetica, sans-serif; + font-weight: 500; + text-align: center; + font-size: 4mm; + color: #0066AA; +} +.card-title:hover{ + --bs-card-title-color:red; + +} +.card img{ + + width: 320px; + + aspect-ratio: auto 360 / 360; +} + +.card-body p{ + display: block; + margin-block-start: 1em; + margin-block-end: 1em; + margin-inline-start: 7px; + margin-inline-end: 7px; + font-family:'Raleway', Verdana, Arial, Helvetica, sans-serif; + +} + +.card-body { + margin: 0px 23.2% 9px 0px; + position: relative; + /* width: 22.518%; */ + background-color: #F4F4F4; + border-bottom: 3px solid #e4e4e4; + border-bottom-right-radius: 24px; + +} +.card{ + --bs-card-border-width:none; + +} + + + +.card:hover{ + animation:pulse 1s ease-in-out; + +} +@keyframes pulse { + from{transform:scale(1);} + to {transform:scale(1.1);} +} \ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.html b/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.html new file mode 100644 index 0000000..ff40b6b --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/06_CardsSection_Bottom/index.html @@ -0,0 +1,62 @@ + + + + +
+
+ +

Free HTML CSS Templates

+

this is subheading

+
+

Latest 200+ Templates are responsive HTML5 mobile-ready CSS layouts with Bootstrap framework. All 588+ CSS templates are absolutely 100% free download for your web design. You can use free templates for your commercial or personal or learning purposes. Please contact us if you have any question.

+
+ +
+
+
+ Placeholder image +
+

Villa Agency

+
+

Villa Agency is a professional HTML CSS template with Bootstrap v5.3.0 responsive framework. There are Property Listing page and....

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Topic Listing

+
+

Topic Listing includes 4 HTML pages for home, listing, detail and contact. Homepage features many sections such as search bar,.... +

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Lugx Gaming

+
+

Lugx Gaming Shop Template is based on Bootstrap 5 CSS library. This blue color layout used Bootstrap v5.3.0 alpha 1 specifically.....

+
+
+ +
+
+
+
+
+ +
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.css b/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.css new file mode 100644 index 0000000..eb94bfd --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.css @@ -0,0 +1,64 @@ + + +.card{ + --bs-card-border-width:none; + + +} + .card-title{ align-items: flex-start; + display: flex; + font-size: 16px; + font-weight: 400; + justify-content: space-between; + line-height: 22px; + margin-bottom: 6px; + + } + +.p-3 { + padding: 0rem !important; +} +.card-img, .card-img-bottom, .card-img-top { + width: 170%; + padding-right: 131px; + +} +.card-img-top +{ + opacity: 1; + display: block; + width: 170%; + padding-right: 131px; + height: auto; + transition: .5s ease; + backface-visibility: hidden; +} +.card-img-top:hover{ + opacity: 0.3; +} + +.view{ + position: absolute; + top: 20px; + left: 70px; + display: none; + font-size:3mm; + border-radius: 24px; + +} + +.card:hover .view{ + display: block; +} +.edit{ + position: absolute; + top: 60px; + left: 70px; + display: none; + font-size:3mm; + border-radius: 24px; + +} +.card:hover .edit{ + display: block; +} \ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.html b/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.html new file mode 100644 index 0000000..cf0e9c2 --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/07_CardsSection_Left/index.html @@ -0,0 +1,76 @@ + + + + + +
+
+ +
+
+

Pick the Website Template You Love

+

this is subtitle

+
+

+
+
+
+
+
+
+ + Placeholder image + View + Edit +
+

Cafe

+
+

Think you know your ARRs from your AARRRs?.

+
+
+ +
+
+
+
+
+
+ Placeholder image + View + Edit +
+

Gaming Company

+
+

A fun way to engage your audiences.Scores correct answers as you go +

+
+
+ +
+ +
+
+
+
+
+ Placeholder image + View + Edit +
+

Construction Company

+
+

Entertain your audiences with a stunning templete

+
+
+ +
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.css b/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.css new file mode 100644 index 0000000..98713b0 --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.css @@ -0,0 +1,35 @@ +.card{ + --bs-card-border-width:none; + + +} +.card-title:hover { + color:#ffa40c; +} +.mb-4{ + margin-top:25px; + margin-left:115px; + margin-right:90px; +} + .btn-primary{ + color:white; + background-color:#ffa40c; + border-color:#ffa40c; +} +.btn-primary:hover{ + background-color:#ffa40c; + border-color:#ffa40c; +} +.col-md-6 { + --bs-gutter-x: 1.5rem; + --bs-gutter-y: 7; + +} +.card:hover{ + animation:bounce 1s ease-in; + +} +@keyframes bounce { + from{transform:scale(1);} + to {transform:scale(1.1);} +} \ No newline at end of file diff --git a/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.html b/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.html new file mode 100644 index 0000000..32c6ec0 --- /dev/null +++ b/SubmittedAssignments/Gauri_Madale/08_CardsSection_Right/index.html @@ -0,0 +1,75 @@ + + + + +
+
+ +
+
+
+
+
+ Placeholder image +
+

Image Background

+
+

One disadvantage of Lorum Ipsum is that in certain letters which is said more + than.

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Color Background

+
+

The most well-known dummy text is the 'Lorem', which well-known is said which is + said. +

+
+
+ +
+
+
+
+
+
+ Placeholder image +
+

Video Background

+
+

Moreover, in Latin only words at the beginning of sentences which is said are + capitalized.

+
+
+ +
+
+
+
+
+
+
+

BUILD YOUR
+ MARKETING LANDING PAGE

+

this is subheading

+
+

Vero is a creative marketing landing designed with great attention to details, flexibility and performance.

+ + PURCHASE NOW + + +
+
+ +
+
+
\ No newline at end of file