Thanks for opening this ticket @shraddhaag. :thumbsup:

@alishapapun Do you want to work on this ticket or do you want to leave it open for someone else to work on? Both are perfectly acceptable. :grinning:

@jflory7 Hi @alishapapun if you don't mind, can I work on this issue if you aren't taking it? Let me know if you're open to that! Thank you 👍👍

@jflory7 Hi @alishapapun if you don't mind, can I work on this issue if you aren't taking it? Let me know if you're open to that! Thank you 👍👍

Hey @anhpham ! Yeah you can work on this issue. Cheers :)

@jflory7 Hi @alishapapun if you don't mind, can I work on this issue if you aren't taking it? Let me know if you're open to that! Thank you 👍👍

Hey @anhpham ! Yeah you can work on this issue. Cheers :)

thank you so much! i'll work hard to solve this issue and ask for help if needed 😃

@jflory7 Hi @anhpham Please let me know if you are not working on this issue and I can take it!!
Thank You :)

@jflory7 Hi @anhpham Please let me know if you are not working on this issue and I can take it!!
Thank You :)

Hi @radhika07 I'm still working on this issue. Thanks! 👍

@jflory7 @shraddhaag hi, i want to make clear of this issue's requirements by providing what I understood from them. Please correct me if I understood anything wrong!
1. For the first bug "The footer doesn't seem to stick at the bottom when the page has less content.", I understood the issue is like these screenshots:

These screenshots showed that the footer did not stick to the very bottom of the page. So I understand my task is to make it stick to the bottom and not adjust itself regardless of how much content the page has? Please let me know if I understood this right :)
2. For the second bug "The footer doesn't seem to be implemented on the Sender Confirmation Page.", I didn't see any issue? At least from my local site the Sender Confirmation Page looks like these:

As far as I know, the footer is still implemented?

@anhpham Hi! You got the first one right :smile:
In the second one, do you see the social buttons at the bottom of the alert message and not in the footer? The footer should be consistent across all pages.
Hope I cleared your doubt! :)

@anhpham In the sender confirmation, If you see the footer, it's missing the 'Share #WeAreFedora' and the next three social buttons.

Those need to be added :smile: :smile: :smile: :smile: :smile:

@shraddhaag @phoenixabhishek hiii thanks so much for your response! I seeee!
In the Sender Confirmation page though:

There are the three social media buttons up there (not in the footer). Do we need to delete those to avoid repetition, or just keep them and add the buttons to the footer to make the footer consistent across all pages?

Currently, we need to add them to the footer, just like in other pages.
I think @jflory7 will let you know if we need to delete them (at the top) or keep them.

@jflory7 hii can you take a look and confirm whether or not we need to delete the social buttons at the top or keep them?

In the Sender Confirmation page though:

There are the three social media buttons up there (not in the footer). Do we need to delete those to avoid repetition, or just keep them and add the buttons to the footer to make the footer consistent across all pages?

@anhpham The footer is only different on the sender confirmation messaging page. Somehow the footer is implemented differently on that page. We should use the same footer on every page.

For example, look at this known good page:

$ cat templates/messaging/archive.html

{% extends 'base.html' %}

{% block content %}

    <div class="page-header">
        <h2>Happiness Archive</h2>
    </div>

    <p>
        When you send a Happiness Packet, you can agree to display your message publicly on
        this website. If both sender and recipient select this option, the message is published
        on this page as a part of our Happiness Archive.
    </p>

    {% include 'messaging/_message_list.html' %}

{% endblock content %}

I would check out the sender confirmation page template and see how it is implemented there.

In the Sender Confirmation page though:
There are the three social media buttons up there (not in the footer). Do we need to delete those to avoid repetition, or just keep them and add the buttons to the footer to make the footer consistent across all pages?

@anhpham The footer is only different on the sender confirmation messaging page. Somehow the footer is implemented differently on that page. We should use the same footer on every page.
For example, look at this known good page:
$ cat templates/messaging/archive.html

{% extends 'base.html' %}

{% block content %}

Happiness Archive

When you send a Happiness Packet, you can agree to display your message publicly on
this website. If both sender and recipient select this option, the message is published
on this page as a part of our Happiness Archive.

{% include 'messaging/_message_list.html' %}

{% endblock content %}

I would check out the sender confirmation page template and see how it is implemented there.

Super! Thank you so much for your guidance 👍👍👍

@jflory7 hiii sorry for my lateness to update! It was because I have been stuck with the first task "The footer does not stick to the bottom of the page when it has less content" for days... I have already fixed the buttons bug, but this particular one I have not yet found a solution.
All the solutions that I have tried in footer at custom.css file are:
1. Here is the original code:

2. So far I have tried to put the following code snippets to test the page:
I added:
// bottom: 0;
position: absolute; //
And it worked for the current page that has less content only, other pages with more content the footer just overlapped or just is not placed the right position.

Also tried adding:
// left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden; //
and couple other hints googled from Stack Overflow, even flex box, but they don't seem to work.
I will try my best to continue to work on finding the solution and overcome this stuck problem, but it would be great if you can give me some hints or guidance to solve it.
Thank you so much!

Updated: PR #195

@jflory7 hi while I was working on this issue, I have had a problem with my testing environment that I initially thought it was not really that big of an issue.
The problem is that my local codebase seems to not reflect all changes from merged branches. I noticed this the most because I did work on the Changing "Packets sent: " to "Total Happiness Spread : " on the navigation bar. It turned out for me that when I changed to master branch and used the command "git pull" to pull the changes, my merged changes was not displayed as you can see here:

when it is supposed to be like this (I used your picture!):

Should I not use the command "git pull" to pull all the changes to my local code base? My knowledge of Git is quite limited, so I think I may have missed out on something.
I think because I haven't been able to pull all the changes to local, I had a hard time fully completing my second pull request (i.e this ticket).
Could you help enlighten me on how to fix this small issue?

Should I not use the command "git pull" to pull all the changes to my local code base? My knowledge of Git is quite limited, so I think I may have missed out on something.
I think because I haven't been able to pull all the changes to local, I had a hard time fully completing my second pull request (i.e this ticket).
Could you help enlighten me on how to fix this small issue?

Let me know if this comment helped any. If it doesn't help, let me know where you are stuck and I can offer some pointers.

Should I not use the command "git pull" to pull all the changes to my local code base? My knowledge of Git is quite limited, so I think I may have missed out on something.
I think because I haven't been able to pull all the changes to local, I had a hard time fully completing my second pull request (i.e this ticket).
Could you help enlighten me on how to fix this small issue?

Let me know if this comment helped any. If it doesn't help, let me know where you are stuck and I can offer some pointers.

Yeees thanks to your recommendation, I was able to solve it just now! So much thanks! Now i will work on wrapping up this Pull Request ☺️

#200 addressed most of this ticket. However, there are a few remaining issues to solve:

When I took a screenshot of the whole page (on- and off-screen) while zoomed out:

When I took a screenshot of the visible screen while zoomed out:

When viewing from a mobile device:

Before closing this ticket as done, I'd like to smooth out these edge cases.

.#200 addressed most of this ticket. However, there are a few remaining issues to solve:
When I took a screenshot of the whole page (on- and off-screen) while zoomed out:

When I took a screenshot of the visible screen while zoomed out:

When viewing from a mobile device:

Before closing this ticket as done, I'd like to smooth out these edge cases.

I was able to fix the last bug! However, I was not able to reproduce the first bug and I was not really sure what to fix in the second bug. Therefore, could you kindly provide me more details regarding what you did for testing that led to the first bug and what in the second bug you would hope to be solved?
What I did in attempt of reproducing the first two bugs was opened the site in my web browser and made the zoom option 30%. May I also ask whether it is what you had done?

I was able to fix the last bug! However, I was not able to reproduce the first bug and I was not really sure what to fix in the second bug. Therefore, could you kindly provide me more details regarding what you did for testing that led to the first bug and what in the second bug you would hope to be solved?

Oops, I should have been more specific. The first and second screenshots are taken at the same time, but from different viewpoints (I wasn't sure why they were different and wasn't sure if seeing both was helpful).

What I did in attempt of reproducing the first two bugs was opened the site in my web browser and made the zoom option 30%. May I also ask whether it is what you had done?

Yes, I did this too. I also tested with television screen dimensions in the Firefox Responsive Design Mode. The use case I want to consider is if the site is ever put onto a large projector screen, like at a conference.

#206 was a follow-up PR to address the issues I mentioned above. I am closing this ticket as complete. :clapper:

Thanks again for working on this one, @anhpham! :tada:

The Sender Confirmation Page still has social icons out of the footer. @jflory7 Should I open a new issue or should we open this one again?

@shraddhaag Oops. Yeah, we should track this. Since this ticket history is already long, we can file a new issue. I'll get this one. :thumbsup:

See #229. :clapper: