Comments (13)
another centering problem: text in button may not quite be centered vertically (recently played with this in custom.css
and fixed a horizontal centering problem and it seems to be okay but I want verification that it's not a pixel off or something silly like that):
from home.
New PR will fix Issue 1
from home.
oh i see now... (got confused by stuff from issue 2 being in the same PR), you did fix everything in the first image, and the second image is still a WIP.
is the third image addressed? I can't quite tell.
from home.
Yes, Third image is addressed
from home.
Ill test the even number of menus and wide titles later tonight. I did notice the highlight on press is the wrong size (not full width/height of menu item)
from home.
in addition to the highlighting on hover there is also the boldness of the lines here:
from home.
even number of menu items still not working quite right either... but we're getting close.
from home.
I'd also expect the following situation to lead to a vertical alignment (all boxes should all be the same width as each other) rather than the weird displacement:
from home.
@mpilosov
Ill look into the highlight issue.
About all menu links being the same width as the largest. I can do that. But bear in mind that it will create responsiveness issues.
How?
The overall menu width, will turn out to be wider that the viewport width. Hence cutting some menu links out and offscreen.
I wrote a media query that allows menu links to take equal width. But this would only work for screen sizes larger than 1000px.
After this is done. I'll probe the site for animation controls and point you there
from home.
menu links should never get cut offscreen. I don't quite understand. If the menu width exceeds viewport width, that should trigger the "vertical stacking" as it does when the screen is narrow (in other words, I expect the last screenshot in my last comment) to have a vertical menu, not horizontal.
based on what you're saying I would guess the logic for whether the menu is horizontal or vertical is based solely on the width of the screen, not the width of the potential menu size, and since you can't make it aware of the latter, you're triggering "equal width only when the screen is wide enough to support it"?
can you please propose this media query change in isolation in its own PR, but put the other fixes separate? I want to be able to revert that commit easily.
from home.
@ccthecode in order of importance:
-
thick right-hand-side on vertical stack (overlapping borders)
-
highlight issue on menu items
-
menu item boxes should be uniform width
-
even number of menus should have center bar "in middle"
from home.
I just sent a message via your website form. Lets schedule a Demo. I figure that'll be the best way to explain things
from home.
I understand that fixing the navigation requires a re-factor with grid css, so we'll close this for the time being given that we have a solution in place.
I'm really particular about having all the nav boxes have the same width all the time, no matter what.
I think the only solution for the time being that isn't a "hack" based on page width or having even/odd numbers behave differently is to use the current "vertical stack" approach at all page widths. This gives uniform widths already and would satisfy my requirement of equality. The "horizontal stack" is indeed nice for wide screens though.
from home.
Related Issues (20)
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
- Link Checker Report
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from home.