Index Page

[toni-santos]

Closes #33

[toni-santos]

This is a WIP, most elements are not correctly aligned and are not yet mobile ready. Help and suggestions appreciated :)

[toni-santos]

Desktop is mostly done, there is only a small issue that I've not been able to fix.
When scrolling through the speakers a small transition plays where a speaker's image increases in size whilst the current one becomes smaller, this makes the carousel height to change which makes the entire page's height shift. Any help regarding this issue is greatly appreciated!

[Naapperas]

@toni-santos remember: se are already using Typescript, so we should.make.use of the type system. When defining props, teu to use a type as a genéric instead of an object.

[CiscoPr]

I'm being quite nitpicky, but I believe in the footer, "niaefeup" should be capitalized as it represents the name of an organization, and it's predominantly presented this way on other platforms.

[pedronunes19]

I'm being quite nitpicky, but I believe in the footer, "niaefeup" should be capitalized as it represents the name of an organization, and it's predominantly presented this way on other platforms.

That's my fault really (it's copied from the design team's mocks)

[pedronunes19]

I believe you're aware of this @toni-santos but the alignment here seems a bit odd

[Naapperas]

@toni-santos I just thought of this: we should have the beginning and end dates not be hardcoded in the markup. They could be defined externally or added as attributes to an edition (in the last case, the website could just always use the latest edition available, regardless of whether it is active or not, food for thought)

[Naapperas]

This is not scoped to this PR but I'll leave it here due to context; the dates part could/should still be handled here IMO.

Basically, if we had more attributes to an edition, we could define the site's theme as a JSON attribute (SQL standard has those now and PgSQL supports then already if I'm not mistaken) of the editon, as well as any other important data that might be needed.

[toni-santos]

I believe you're aware of this @toni-santos but the alignment here seems a bit odd

I'm not able to get a better screenshot, but I've changed the code so that the position of the titles, where applicable, are not computed by me but instead by CSS centering mechanisms which I then just add a margin in order to take into account the shadow when centering.

[toni-santos]

@toni-santos I just thought of this: we should have the beginning and end dates not be hardcoded in the markup. They could be defined externally or added as attributes to an edition (in the last case, the website could just always use the latest edition available, regardless of whether it is active or not, food for thought)

That's a great idea, in fact all pages should just be receiving information from the database and then displaying them through the mechanisms and interfaces that are respective to each edition. For this PR however, my idea was to keep it frontend only, seeing as the information being displayed here comes from sources from the database that are yet to be implemented in the backend, mainly, the speakers.

This is not scoped to this PR but I'll leave it here due to context; the dates part could/should still be handled here IMO.

Basically, if we had more attributes to an edition, we could define the site's theme as a JSON attribute (SQL standard has those now and PgSQL supports then already if I'm not mistaken) of the editon, as well as any other important data that might be needed.

Agreed, and related to what I said regarding the first point :)

[toni-santos]

I have fixed the issue I reported at the beginning where the carousel's changing height would make the rest of the page grow and shrink in size, however due to the fact that it made it impossible to achieve a clean transition I have disabled the animation/transition on the change of size of the image, furthermore it made the carousel look really weird when switching images. We could revisit this if we deem that the size transition is relevant and enhances the page, however due to its appearance I'd suggest against it.

Following this I believe there aren't anymore tweaks or fixes left. Please test the page out, mainly the speaker's carousel and its behavior when resizing and interacting with the page in responsive ways.

[toni-santos]

I may have not noticed or it may have been recently added, but there were some modals missing that provide some more information about the sponsors, this is now implemented with this package. It seems to be lightweight and easy to use, a good option whenever we need to use any modals!

[Naapperas]

Inertia apparently has modal components

[Naapperas]

I saw a lot of px units and I'm kinda of scared: are they really necessary?

Other than that, I'm going to assume that you are waiting for #36 for the navbar: currently the "about us" section is half-cut and it could look better.

[toni-santos]

Branch has been rebased and is ready for review :) Please check it out!

[Naapperas]

Don't forget to rebase this branch

[ttoino]

LGTM, I just have two very slight nitpicks:

At small screen sizes, maybe this title should be centered, and the grid reduced to one column.

Also at very small screen sizes, the speakers should either be smaller or the main speaker should have a higher z-index to appear on top.