Skip to content
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

Jump to bottom

static header bar is not working anymore. please check and fix it. #64

Open
devopstoday11 opened this issue Apr 1, 2023 · 20 comments
Open

static header bar is not working anymore. please check and fix it. #64

devopstoday11 opened this issue Apr 1, 2023 · 20 comments
Assignees
@tfsojon
Labels
bug Something isn't working

Comments

@devopstoday11
Copy link
Contributor

when scrolling the pages today, I noticed that the static header bar is not working anymore. please check and fix it.

Also, can you give me screenshots for this - If I want to change header bar colors, which file and where to change it?

@tfsojon
@devopstoday11 devopstoday11 added the bug Something isn't working label Apr 1, 2023
@tfsojon
Copy link
Collaborator

tfsojon commented Apr 2, 2023

@devopstoday11 Please review this PR - #67 and let me know

@devopstoday11
Copy link
Contributor Author

@tfsojon
I can see the static header bar now. But the header bar color is not consistent for all pages. Please check it. For Platform & Open Source pages header bar color is white; please change it to the same color as on the home page and check all pages once before submitting the PR.

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 3, 2023

@devopstoday11 Done

@tfsojon I can see the static header bar now. But the header bar color is not consistent for all pages. Please check it. For Platform & Open Source pages header bar color is white; please change it to the same color as on the home page and check all pages once before submitting the PR.

@devopstoday11
Copy link
Contributor Author

@tfsojon header bar color looks fine, but both the primary and secondary header bars' vertical height is too much. How can I reduce that?

@devopstoday11 devopstoday11 mentioned this issue Apr 3, 2023
Merged
@devopstoday11
Copy link
Contributor Author

devopstoday11 commented Apr 3, 2023 •
edited
Loading

This issue still exists. Just letting you know so that you don't confuse with the merged status showing in the above auto-comment.

#64 (comment)
@tfsojon

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 4, 2023

By adding this bottom of your _navigation.scss file

.navigation-alt .navbar {
  padding-bottom: 2px;
}
.navigation-bottom .navbar {
  padding-top: 2px;
}

@devopstoday11
Copy link
Contributor Author

@tfsojon
when can you make this change regarding the secondary header bar menu items? How they show up depends on the scrolling. as shown in the sample screenshots.

Before scrolling
image

After scrolling
image

@devopstoday11
Copy link
Contributor Author

@tfsojon , also please make header bar little bit more slim (reduce vertical height). I think you can reduce 1/4th of the size.
Indicated what I meant by vertical height in this screenshot,
image

Reduce that vertical height by 1/4 th.

@devopstoday11
Copy link
Contributor Author

@tfsojon,
there is a difference between local and live website dropdown items' appearance.
This is how drop-down items look in my local -
image

But on the Netlify hosted live website, it doesn't look the same. it looks like this -
image

image

Even the text is not correctly visible in that dropdown item.

Why is the difference? What might be the cause?

@devopstoday11
Copy link
Contributor Author

I wasn't able to figure this. When I added that code to the file and saved and reloaded my local site, I did not see any size changes in both primary or secondary header bars. I tried different number, but still no luck.
@tfsojon
I explained what I wanted in the above, with screenshots, regarding the header bar vertical size.
here - #64 (comment)

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 5, 2023

Ok I'm checking.

@devopstoday11
Copy link
Contributor Author

@tfsojon,
please modify the header bars' shape a little bit. Currently, both header bars are horizontally in full length.
Make them smaller in length with curved edges and leave an equal amount of space on both sides.
Showing a sample in the screenshot.

image

@devopstoday11
Copy link
Contributor Author

devopstoday11 commented Apr 5, 2023 •
edited
Loading

@tfsojon , I added many items above; please work on them all.

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 5, 2023

image

when the scroll amount is ((header-top-height + header-bottom-height) * 2) that moment the secondary header bar showing.
I have to do this because, we have our brand logo on the left side on bottom header.
image

@tfsojon when can you make this change regarding the secondary header bar menu items? How they show up depends on the scrolling. as shown in the sample screenshots.

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 5, 2023

@tfsojon , also please make header bar little bit more slim (reduce vertical height). I think you can reduce 1/4th of the size. Indicated what I meant by vertical height in this screenshot, image

Reduce that vertical height by 1/4 th.

After my push you will be able to change the vertical height by changing the padding value in _navigation.scss file.

image

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 5, 2023 •
edited
Loading

@tfsojon, there is a difference between local and live website dropdown items' appearance. This is how drop-down items look in my local -

But on the Netlify hosted live website, it doesn't look the same. it looks like this - image

Even the text is not correctly visible in that dropdown item.

Why is the difference? What might be the cause?

Not really sure now. but I think for the hugo version on the netlify setting. Updated hugo version on chandu branch. you can check after my PR.

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 5, 2023

@tfsojon, please modify the header bars' shape a little bit. Currently, both header bars are horizontally in full length. Make them smaller in length with curved edges and leave an equal amount of space on both sides. Showing a sample in the screenshot.

I will look odd.

ex: in homepage
image

ex: in compage page
image

@devopstoday11 what do you think?

tfsojon added a commit to tfsojon/intelops-website that referenced this issue Apr 5, 2023
@tfsojon
update added on intelops#64
15aae9f
@devopstoday11
Copy link
Contributor Author

devopstoday11 commented Apr 10, 2023 •
edited
Loading

@tfsojon, please modify the header bars' shape a little bit. Currently, both header bars are horizontally in full length. Make them smaller in length with curved edges and leave an equal amount of space on both sides. Showing a sample in the screenshot.

I will look odd.

ex: in homepage image

ex: in compage page image

@devopstoday11 what do you think?

It looks good, when the banner horizontal size and header horizontal size are matching. @tfsojon

Another option which I saw is in your delta template. I just checked it. Your template style is good.
I like to see the header bar (both primary and secondary) in the banner area itself as it was in your "delta template" ; and with that same style, can you still make the header bar sticky when scrolling is done?

image

Note:- In your template, above the banner area, there is too much empty space. Reduce it, as I showed in the screenshot. And, this header bar change is not a priority now. You can do this after finishing all other changes requested. @tfsojon

devopstoday11 added a commit that referenced this issue Apr 10, 2023
@devopstoday11
Merge pull request #73 from tfsojon/chandu
a763bd9 
Updated added on issue #56 and #64
@devopstoday11
Copy link
Contributor Author

devopstoday11 commented Apr 10, 2023 •
edited
Loading

@tfsojon
How to get the name next to the logo where I pointed in this screenshot?
image

In the below screenshot, see how "Compage" is visible next to Compage's logo. I want this please.
https://user-images.githubusercontent.com/59978378/229942503-8e045db2-b3e4-4e5f-94ba-f62e68c3c425.png

@tfsojon
Copy link
Collaborator

tfsojon commented Apr 11, 2023

added logo text-option here - #76

In the below screenshot, see how "Compage" is visible next to Compage's logo. I want this please. https://user-images.githubusercontent.com/59978378/229942503-8e045db2-b3e4-4e5f-94ba-f62e68c3c425.png

devopstoday11 added a commit that referenced this issue Apr 19, 2023
@hannan-khan-intelops @tfsojon
@devopstoday11 @mahendraintelops @azar-intelops
Content (#83)
532c581 
* worked on platform page

* worked on open-source page

* added opty page

* updated platform-banner and dropdown

* updated platform & open-source header

* added internal guide doc

* added draft doc to show saas ui running steps in local

* added compage related first blog about persistent storage using crds

* corrected the wording

* modified images and names

* modified copyrights name

* added image and description for mahendra

* update on #56

added secondary-header && updated content-aria and footer

* update on #66

added support for svg image

* added new image files

* modified image file to svg

* fix image-issue, updated header style && open-source page

* replaced image

* updated names and added tags to blog

* added extra file to resolve conflicts

* removed extra file after conflicts resolved

* added few final images for compage

* added images for Compage product page

* update added on #64

* update added on #56

* added new blog on pixie script

* added logo-text in header-two

* blog: added blog for grpc-interceptors-using-go

* added image and description for azar

* fixed author details display issue

* added enhancing-your-pixie-pxl-script-by-manipulating-data blog

---------

Co-authored-by: Sojon <sojon.themefisher@gmail.com>
Co-authored-by: Chandu Paladugu <59978378+devopstoday11@users.noreply.github.com>
Co-authored-by: Sojon <87603786+tfsojon@users.noreply.github.com>
Co-authored-by: Mahendra <mahendra.b@intelops.dev>
Co-authored-by: Mahendra <110662500+mahendraintelops@users.noreply.github.com>
Co-authored-by: azar-intelops <amohammed@appstekcorp.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@tfsojon tfsojon

Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@devopstoday11 @tfsojon