Skip to content

Responsiveness added #76

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

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Responsiveness added #76

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f811ec1
All categories allignment fixed
piyumaldk Feb 17, 2021
b726b25
Fix Add validations
piyumaldk Mar 7, 2021
1c7fe88
Responsive Fixed
piyumaldk Mar 24, 2021
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
67 changes: 46 additions & 21 deletions com-dict-client/src/components/AddWord/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ function WordForm() {
const user = useSelector((state) => state.firebase.auth);

const handleAddHeadTerm = () => {
if (category === "") {
if (category === "" || category == null) {
return message.error("Please select a category");
}

Expand Down Expand Up @@ -120,7 +120,9 @@ function WordForm() {
<Form onFinish={onSubmit} style={{ paddingTop: "4vmin" }}>
<Form.Item
label="Select the language"
rules={[{ required: true, message: "" }]}
rules={[
{ required: true, message: "Please select a language" },
]}
>
<Select
showSearch
Expand All @@ -135,8 +137,9 @@ function WordForm() {
))}
</Select>
</Form.Item>

<Row>
<Col span={12}>
<Col xs={24} xl={8}>
<Form.Item
label="Head term"
rules={[{ required: true, message: "" }]}
Expand All @@ -156,10 +159,10 @@ function WordForm() {
</Select>
</Form.Item>
</Col>
<Col span={1}>
<Col xs={24} xl={2}>
<Button type="text">Or</Button>
</Col>
<Col span={6}>
<Col xs={24} xl={7}>
<Input
value={newHeadTerm}
onChange={(val) =>
Expand All @@ -168,7 +171,8 @@ function WordForm() {
placeholder="New head term"
/>
</Col>
<Col span={5}>
<Col xs={24} xl={1}></Col>
<Col xs={24} xl={6}>
<Button
type="primary"
// size="large"
Expand All @@ -180,19 +184,24 @@ function WordForm() {
</Button>
</Col>
</Row>

<Form.Item
name="other_language_term"
rules={[{ required: true, message: "" }]}
>
<Input
onChange={(val) => setOtherLanguageTerm(val.target.value)}
placeholder="Word in <selected langauge>"
/>
</Form.Item>

<br />
<Row>
<Col xs={24} xl={24}>
<Form.Item
name="other_language_term"
rules={[{ required: true, message: "Please inut a word" }]}
>
<Input
onChange={(val) => setOtherLanguageTerm(val.target.value)}
placeholder="Word in <selected langauge>"
/>
</Form.Item>
</Col>
</Row>
<Form.Item
// rules={[{ required: true, message: "" }]}
rules={[
{ required: true, message: "Please input a word class" },
]}
name="classes"
label="Select the word class"
>
Expand All @@ -201,7 +210,9 @@ function WordForm() {

<Form.Item
name="other_laguage_def"
rules={[{ required: true, message: "" }]}
rules={[
{ required: true, message: "Please input the definition" },
]}
>
<Input
onChange={(val) => setMeaning(val.target.value)}
Expand All @@ -211,15 +222,29 @@ function WordForm() {

<Form.Item
name="example"
rules={[{ required: true, message: "" }]}
rules={[
{
required: true,
message:
"Please input an example on using the word in a sentence",
},
]}
>
<Input
onChange={(val) => setExample(val.target.value)}
placeholder="Example on using the word in a sentence"
/>
</Form.Item>

<Form.Item name="category">
<Form.Item
name="category"
rules={[
{
required: true,
message: "Please select a category",
},
]}
>
<Select
showSearch
placeholder="Select the category"
Expand Down
14 changes: 9 additions & 5 deletions com-dict-client/src/components/Categories/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,6 @@ function CatView() {
<img alt="1" style={{ maxWidth: "100%" }} src={food} />
</Col>

<Col span={1}></Col>
<Col span={17}>
<Card
style={{
Expand Down Expand Up @@ -189,6 +188,7 @@ function CatView() {
</Row>
</Card>
</Col>
<Col span={1}></Col>
</Row>
<Row style={{ paddingTop: "2vmin" }}>
<Col span={24}>
Expand Down Expand Up @@ -251,13 +251,14 @@ function CatView() {
</Row>
<Row>
<Col span={1}></Col>
<Col span={6}>
<Col span={3}>
<img
alt="1"
style={{ maxWidth: "100%", maxHeight: "auto" }}
src={religion}
/>
</Col>
<Col span={2}></Col>
<Col span={17}>
<Card
borderd
Expand Down Expand Up @@ -287,6 +288,7 @@ function CatView() {
</Row>
</Card>
</Col>
<Col span={1}></Col>
</Row>

<Row style={{ paddingTop: "2vmin" }}>
Expand Down Expand Up @@ -331,9 +333,10 @@ function CatView() {
</Row>
</Card>
</Col>
<Col span={6}>
<Col span={5}>
<img alt="1" style={{ maxWidth: "100%" }} src={music} />
</Col>
<Col span={1}></Col>
</Row>

<Row>
Expand All @@ -350,14 +353,14 @@ function CatView() {
</Row>
<Row>
<Col span={1}></Col>
<Col span={6}>
<Col span={4}>
<img
alt="1"
style={{ maxWidth: "100%", maxHeight: "auto" }}
src={college}
/>
</Col>

<Col span={1}></Col>
<Col span={17}>
<Card
borderd
Expand Down Expand Up @@ -387,6 +390,7 @@ function CatView() {
</Row>
</Card>
</Col>
<Col span={1}></Col>
</Row>
</>
);
Expand Down