Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: added faq and press cards #5

Merged
merged 7 commits into from
Sep 30, 2020
Merged

feat: added faq and press cards #5

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
82a6694
feat: added faq and press cards
Sep 29, 2020
d18c76d
Merge branch 'development' of https://github.com/ClearTax/littlegiant…
Sep 29, 2020
14d8651
feat: solved comments
Sep 29, 2020
790717f
feat: added reinforcement card
Sep 30, 2020
5d9c1d4
feat: fixed comments
Sep 30, 2020
a0268ea
feat: fixed more comments
Sep 30, 2020
59d796c
Merge branch 'development' into Feat/components-added-cards
anshul-pinto0410 Sep 30, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
43 changes: 43 additions & 0 deletions docs/docs/faq-card.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
---
id: faq-card
title: FAQ Card
sidebar_label: FAQ Card
---

##### FAQ Card

```html live
<>
<div class="lil-flex lil-flex-wrap">
<div class="lil-faqcard">
<div class="lil-faqcard-faq-wrapper">
<div class="lil-faqcard-faq">
<p> Write question here for upto two lines? </p>
</div>
</div>
<div class="lil-faqcard-content">
<p>The Goods and Services Tax is a unified,
multi-stage, and consumption-based tax
levied on the supply of goods or services,
combining all stages such as manufacture </p>
</div>
</div>

<div class="lil-faqcard">
<div class="lil-faqcard-faq-wrapper">
<div class="lil-faqcard-faq">
<p> Write question here for upto two lines? </p>
</div>
</div>
<div class="lil-faqcard-content">
<p>The Goods and Services Tax is a unified,
multi-stage, and consumption-based tax
levied on the supply of goods or services,
combining all stages such as manufacture </p>
</div>
</div>
</div>

</>

```
1 change: 1 addition & 0 deletions docs/docs/font-weight.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ Control the font weight of an element using the `lil-font-{weight}` utilities.
<>
<p class='lil-font-light'>Light</p>
<p class='lil-font-normal'>Normal</p>
<p class='lil-font-semibold'>Semibold</p>
<p class='lil-font-bold'>Bold</p>
</>
```
49 changes: 49 additions & 0 deletions docs/docs/presscard.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
---
id: presscard
title: Press Card
sidebar_label: Press Card
---

##### Press Card

```html live
<>
<div class="lil-flex lil-flex-wrap lil-bg-grey-150 lil-items-center">
<div class="lil-presscard">
<div class="lil-presscard-year">
2019
</div>
<div class = "lil-presscard-award">
BW Disrupt <br/> TechTors
</div>
<div class = "lil-presscard-image">
this is the image
</div>
</div>

<div class="lil-presscard">
<div class="lil-presscard-year">
2019
</div>
<div class = "lil-presscard-award">
Tech leader of <br/>the year </div>
<div class = "lil-presscard-image">
this is the image
</div>
</div>

<div class="lil-presscard">
<div class="lil-presscard-year">
2019
</div>
<div class = "lil-presscard-award">
BW Disrupt <br/>TechTors
</div>
<div class = "lil-presscard-image">
this is the image
</div>
</div>
</div>
</>

```
16 changes: 10 additions & 6 deletions docs/sidebars.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,15 @@ module.exports = {
{
type: "category",
label: "Borders",
items: ["border-radius", "border-width"]
items: ["border-radius", "border-width"],
},
"box-shadow",
"button",
"cards",
{
type: "category",
label: "Cards",
items: ["cards", "faq-card", "presscard"],
},
"colors",
"cursor",
"grid",
Expand All @@ -29,10 +33,10 @@ module.exports = {
"font-color",
"font-weight",
"line-height",
"text-alignment"
]
"text-alignment",
],
},
],
"Responsive Design": ["responsive-design"]
}
"Responsive Design": ["responsive-design"],
},
};
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"scripts": {
"build": "npm-run-all -s build:tailwind build:uglify",
"build:tailwind": "npx postcss src/littlegiant.css -o css/littlegiant.css",
"build:watch": "npx postcss src/littlegiant.css -o css/littlegiant.css --watch",
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
"build:uglify": "uglifycss css/littlegiant.css > css/littlegiant.min.css",
"clean-deps": "clean-deps",
"docs": "cd docs && npm start",
Expand Down
27 changes: 27 additions & 0 deletions src/components/Card/FAQcard.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.lil-faqcard {
/*
background-color needs to be updated
*/
height: 280px;
width: 252px;
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
background-color: #1c314f;

@apply lil-rounded-xl lil-p-5 lil-cursor-pointer lil-text-center lil-m-2;
}

.lil-faqcard > .lil-faqcard-faq-wrapper {
@apply lil-mr-5 lil-w-full;
}

.lil-faqcard-faq-wrapper .lil-faqcard-faq {
height: 33%;
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
white-space: normal;
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
@apply lil-text-s-20 lil-text-left lil-text-white lil-font-semibold lil-mr-5;
}

.lil-faqcard > .lil-faqcard-content {
height: 66%;
opacity: 0.6;
white-space: normal;
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
@apply lil-text-left lil-text-base lil-text-white lil-my-6;
}
20 changes: 20 additions & 0 deletions src/components/Card/presscard.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
.lil-presscard {
height: 280px;
width: 280px;
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
@apply lil-rounded-xl lil-bg-white lil-align-middle lil-m-4;
}

/*
Colors have to be modiefied for .lil-presscard-year & .lil-presscard-award
*/
.lil-presscard > .lil-presscard-year {
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
@apply lil-text-base lil-text-black lil-text-center lil-mx-2 lil-my-3 lil-h-12;
}
.lil-presscard > .lil-presscard-award {
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
white-space: normal;

@apply lil-text-s-24 lil-text-blue-300 lil-text-center lil-font-bold lil-h-24;
}
.lil-presscard > .lil-presscard-image {
@apply lil-flex lil-justify-center lil-items-center lil-mx-2 lil-h-24;
}
2 changes: 2 additions & 0 deletions src/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,3 +2,5 @@
@import "./components/Card/card.css";
@import "./components/Promise/promise.css";
@import "./components/Text/text.css";
@import "./components/Card/FAQcard.css";
@import "./components/Card/presscard.css";
1 change: 1 addition & 0 deletions tailwind.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ module.exports = {
fontWeight: {
light: 300,
normal: 400,
semibold: 600,
anshul-pinto0410 marked this conversation as resolved.
Show resolved Hide resolved
bold: 700,
},
letterSpacing: false,
Expand Down