Refactoring CSS

[devarshishimpi]

Kindly note this issue is not assigned to anyone. This issue will be handled by Noteslify Team.

[devarshishimpi]

@khushi818 You remember the issues you were talking about using classes? This issue is for the same.

[khushi818]

Yes I am doing it

[devarshishimpi]

Partial Fix in https://github.com/dvstechlabs/Noteslify/pull/89

[pedropcamellon]

Hi! I just started looking at app styles and I see in "Noteslify/frontend/src/" two main files: App.css and index.css. What are we using each one for?

[khushi818]

@Pcamellon hi We are using App.cs to declare global CSS and index.css for toggle purpose for now. This has to be changed. We will be doing it.

[pedropcamellon]

I agree. I will be glad to help

[pedropcamellon]

I think we can move most of the rules, or all of them, in LandingPage.css to index.css.

[devarshishimpi]

I think we can move most of the rules, or all of them, in LandingPage.css to index.css.

You can discuss the same with @khushi818 as this issue will be handled by her.

[pedropcamellon]

I will be listing here some personal suggestions:

• Change:

.p-x {
    padding: 4rem 0;
}

to

.p-x {
    padding: xrem;
}

• Change:

.py-x {
    padding: xrem;
}

to

.py-x {
    padding-block: xrem;    // Same as padding: xrem 0;
}

• Add this to index.css:

.mb-x {
    margin-bottom: xrem;
}

• Add this to index.css:

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

• flex class is defined like this:

.flex {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

I prefer:

.flex {
    display: flex;
}

.justify-content-center {
    justify-content: center;
}

.align-items-center {
    align-items: center;
}

[devarshishimpi]

@khushi818

[khushi818]

@pedropcamellon sorry for the late reply I really like the things you listed. It would be nice to do it this way. I will appreciate your suggestions even more. Thank you for contributing.

[devarshishimpi]

@khushi818 Work with the font size on the landing page

[devarshishimpi]

Issue worked in https://github.com/dvstechlabs/Noteslify/issues/237