Of front end changes smalls and big

Last time I only did small changes the HTML project, today with a new front end I found issues that relate to both accessibility and stability.

When experimenting with the new front end, I noticed our close button was not responding as expected on mobile, this issue is surprisingly normal, as areas of effect work differently from phone to phone, you should expect this. That said the button was a bit too small for both noticing- if you believe it my parents did not notice close buttons, and one struggled to read,

The obvious answer was to make it larger. So we went from this?

To this

You will notice, the buttons now have a larger readability on a phone, as well, as having a better structure to be able to be pressed and read. A side by side comparison helps to visualize this a bit better

you can see it in action here


I did howver start prototyping a new version with specific changes on html and css

I am now prototyping a new version? You may ask, well I notice a few issues aesthetically, and in some ways code wise. is a bit strange to explain code wise so Ill do my best

Absolute positioning is an item most developers where i used to work would frown on, unless absolutely necessary. Why? Because we have the ability to position relatively, and absolute is basically overriding and you are opening yourself at having to change an item if something on the UI changes, absolute is mostly focused for “ modal popup” which could well be a function we look into the future of this for what ever reason, maybe views login I would like to keep the option of keeping our absolute functionality to the bare minimum.

Also one of the reasons I decided to also change the structure was because, the way the structure of the menu? It takes a little bit more of the user by forcing mid screen, this way we can make the user less effort and a bit more accessibility. (it sounds small but you be surprised by how this little changes fix engagement so we needed with a model that changes the button structure to stop using absolute and we change the flex to be able to start from top.
The result can be found here on the prototype. Once again you can see the changes from the one currently approved,

A side by side comparison for reference

the buttons are moved up, the close button is slightly larger, AND is not absolute,
the changes are basic we only move one line, and we switch the CSS justify-content to flex-start in the nav CSS. You can see this proposed changes here in


Regardless of what this pet project changes bring I m thinking of a few additional changes to structure, of HTML to add favicon and make sure that this goes well over all front-end 0wise.

My external did not go well I admittedly choked trying to find an issue, It was hard, until I found a bug in a project that i helped before that I am interested with Geo Locations This unfortunately came to a close due to the fact the database to project seems to have issues, and I don’t think I can finish, that said, I accept that, my plan for this protect was to figure out maps with react, something that I have never fully worked with and I was curious about as I have done some geolocation in a very basic concept.

https://github.com/cagomezr/unescomaptesting (for reference about what I was working on)

and I was looking forward to working further with this, the best i could do was lo an issue with project due to Firebase issues


the issue I planed to work with was https://github.com/chrisdesilva/pickup/issues/34 which dealt with changing the pins and also adding the functionality to change this, I’m disappointed in myself if I m honest.

but I think I only have to blame myself for this, teaching you learn from my mistakes, and try to ask for help. and dont be too proud to ask of it. Yes I know do as I say, not as I do but what can I say..,

Im only human.

I think.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s