-
Notifications
You must be signed in to change notification settings - Fork 128
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.
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
no-JS fixes #852
no-JS fixes #852
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Other than the comments below, I would maybe consider hiding the /ticketpricewindows
and /charts
links from the hamburger menu, as those pages are pretty much worthless without js.
I put in a PR on your branch for reference or merge.
views/extras.tmpl
Outdated
@@ -77,7 +77,7 @@ | |||
{{else}} | |||
<a data-keynav-skip href="https://explorer.dcrdata.org/" title="Home">Switch To Mainnet</a> | |||
{{end}} | |||
<span data-keynav-skip data-action="click->menu#onSunClick" class="jsonly d-inline-block"><span id="sun-icon" class="dcricon-sun-fill no-underline pr-2"></span> Night Mode</span> | |||
<span data-keynav-skip data-action="click->menu#onSunClick" class="jsonly d-inline-block"><span id="sun-icon" class="dcricon-sun-fill no-underline pr-2 jsonly"></span> Night Mode</span> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was already a .jsonly
on the containing span, but there were a number of things coming together here to make this not work.
First, bootstrap d-inline-block
's definition is display: inline-block!important;
which is the highest specificity, so .jsonly
's display: none;
was ineffective. Some quick testing indicates that the d-inline-block
tag is unnecessary (maybe due to some change in main.css
), so probably just remove it.
Second, the way .jsonly
elements are shown programmatically is a little blunt. jQuery show()
adds a style
attribute with display: inline;
because that is the default display mode of anchor and span elements. Instead, the .jsonly
class should simply be removed so that non-default display
mode from the stylesheets can take precedence.
$('.jsonly').removeClass('jsonly')
Of course, changes in index.js
will conflict with the SCSS PR, so that stinks.
Third, display: block;
was being assigned with a high specificity here, so .jsonly
was again innefective.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I discovered the d-inline-block issue, as I noted in the PR description, but I see it's quite a bit worse here. I considered trying a removeClass
, but decided not to do anything too drastic. I'll leave this issue until after the bigger PRs go in.
@buck54321 Thanks for your PR. Changes merged in. Testing it out. |
Set fallback fonts of the same class as the webfonts: - monospace for inconsolata-v15-latin-regular - sans-serif for source-sans-pro-v9-latin-regular Hide all "Age" columns with jsonly class since all age values are set via stimulus.js. Also hide all ages in "(X ago)" spots. Hide the sun/moon icon with jsonly since it is also a webfont. Ideally both the Night Mode and Enable Hot Keys menu items would be hidden entirely, but they are difficult to eliminate. Prevent text like Coinbase and Stakebase from being hash-elided by defining a new flag, TextIsHash, that is set in Go to avoid heuristics in the frontend.
main.age -> time.age
…ning span bracket in block.tmpl.
Seems all good now. I had to put the |
This addresses a number of issues in browsers with JavaScript disabled.
Set fallback fonts of the same class as the webfonts:
Hide all "Age" columns with jsonly class since all age values are set
via stimulus.js.
Also hide all ages in "(X ago)" spots.
Hide the sun/moon icon with jsonly since it is also a webfont. Ideally
both the Night Mode and Enable Hot Keys menu items would be hidden
entirely, but they are difficult to eliminate.
d-inline-block
usesdisplay: inline-block !important
, which seems to neutralize jQuery'sshow()
.Hide the "since last block" and websocket status footer elements.
Prevent text like Coinbase and Stakebase from being hash-elided by
defining a new flag, TextIsHash, that is set in Go to avoid heuristics
in the frontend.