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

a few design issues/optimizations #333

Closed
10 tasks done
Marcellaoo opened this issue Jan 4, 2017 · 7 comments
Closed
10 tasks done

a few design issues/optimizations #333

Marcellaoo opened this issue Jan 4, 2017 · 7 comments
Labels
Fixed In Next Release

Comments

@Marcellaoo
Copy link

Marcellaoo commented Jan 4, 2017 •
edited by AzureMarker

  • left menue: Donate link should open in a new window/tab
  • footer: Donate link should open in a new window/tab
  • footer: on small devices/browser windows: information " Pi-hole Version v2.11 Web Interface Version v2.3 " is missing
  • layer on click pi-hole button: Links "GitHub, Details, Updates" should open in a new window/tab
  • layer on click pi-hole button: remove square around logo - not consistent with logo in header, theres no square either
  • layer on click pi-hole button: make 23:48 (time information) bold in String "Session is valid for 23:48"
  • layer on click pi-hole button: on small devices/browser windows not alignd right (see screenshot1.png)
  • on small devices/browser windows: design issue left side (see screenshot1.png)
  • on some smaller devices/browser windows: the text is behind the "Log in" Button" (see screenshot2.png and screenshot3.png)
  • left menu: menu/site indicator stays on "main page" althoug i am on the login page (see screenshot4.png)

screenshot1
screenshot2
screenshot3
screenshot4
@Marcellaoo
Copy link
Author

if you want i can complete the review of the existing webinterface. dont know...

@DL6ER
Copy link
Member

DL6ER commented Jan 4, 2017 •
edited

Some of those are already known and will be fixed by the release that is scheduled for today.

@AzureMarker
Copy link
Contributor

Thanks for this! We'll look through these when we can.

This was referenced May 19, 2017
Merged
Merged
Merged
@Th3M3
Copy link
Contributor

Th3M3 commented May 28, 2017 •
edited

Actually I am looking how to solve this point:

footer: on small devices/browser windows: information " Pi-hole Version v2.11 Web Interface Version v2.3 " is missing

Of course, it is possitble to let the version info continuous visible in the footer.

I tried this out and think it would be better to move the version infos in the header's dropdown-menu on small screens (e.g. smart phones).
Therefore are changes in header.php, footer.php & footer.js necessary.

Finally it would look like this on small screens:
suppgest1

What do the Developers think about it?

@Th3M3 Th3M3 mentioned this issue Jun 2, 2017
Merged
5 tasks
DL6ER added a commit that referenced this issue Jun 3, 2017
@DL6ER
Add version info to dropdown menu (top right) for viewing on small sc…
baed89e 
…reens. Addresses #333 partially
DL6ER added a commit that referenced this issue Jun 3, 2017
@DL6ER
Add version info to dropdown menu (top right) for viewing on small sc…
a3e375f 
…reens. Addresses #333 partially
@DL6ER DL6ER mentioned this issue Jun 3, 2017
Merged
5 tasks
@AzureMarker
Copy link
Contributor

All of the issues have been fixed by the next release.

PromoFaux added a commit that referenced this issue Jun 20, 2017
@PromoFaux
[Staging] 3.1 (#514)
f204b71 
* Remove double click handler

* ~Today~ Over Last 24 Hours

* Rename Top Advertisers to Top Blocked Domains

* percentage should be a float instead of an integer

* Define $over_time as array. Fixes #501

* Add hover/hit radius for Forward Destinations over Time graph

* Add custom callback for tooltips and disable legend for Forward Destinations over Time graph

* Remove legend, add tooltips and increase hit/hover radius for Query Types over Time graph. Fixes #502

* Don't hide detailed graphs on small screens any longer

*  🌮 is the new :shipit: squirrel

* revise wording on main page

shorter text to fit in one line on smaller screens

* Show warning in browser when fopen() failed

* open links in new tab

* open links in new tab

* Update header.php

* select 'Login' in Navbar when showing loginpage

using the same term as it is already used to show up the loginpage (in line 565)

* set the mainbox wider on smaller screens

solves issue of overlapping text with loginbutton when using smaller screens

* also fix overlapping loginpage on footerbar

* remove border on logo

* add link feedback (on hover)

* sessiontimer in bold letters

* use AdminLTE function to toggle dropdown-menu

AdminLTE has already an implemented function to toggle the user menu.
So there is no need to use an own script in footer.js
 
Benefit: The dropdown-menu closes if you click on a blank Place

* align donate-url with url in footerbar

* remove function to open user menu

AdminLTE has already an implemented function to toggle the user menu.
So there is no need to use an own script in footer.js

Benefit: The dropdown-menu closes if you click on a blank Place

* Update LICENSE of the project to EUPL v1.2

* Major overhaul of update checker - checks only every 30 minutes to reduce number of GitHub API requests

* Add version info to dropdown menu (top right) for viewing on small screens. Addresses #333 partially

* Fix typo

* footer.php: improve and clean up

move animation-stylesheet to pi-hole.css (Have you noticed that there is even a text- and text-shadow animation set, but for webkit-browsers only)
added <!-- Version Infos -->
correct continuous hide of version info (AdminLTEs classed widths as `xs` > `sm` > `md` > `lg`)
display Donate-text alwas in one line (do not wrap in between when version info string gets very long)

* pi-hole.css: pasted animation stylesheet

and improved the text-shadow-animation to work correctly with and without -webkit-prefix
(for me this wasn't working until now)

* header.php: some corrections & improvements

pull dropdown-menu always to right side
changed <!-- Update alerts --> to <!-- Version Infos --> (just like it is in footer)
hide version infos in dropdown-menu if it gets shown in footer
repaired update-urls, they also should open up in new tab & gets underlined on hover
`background:none` is needed because AdminLTE adds dark bg on hover to links when using it on smallscreen (xs)

* Minor change to make the dashboard's javascript compatible with escaped characters (like apostrophe) in client names

* Add the same for the top domains

* ... and Top Ads

* Minor change to comments

* footer.php: edited as discussed

* header.php: edited as discussed

* Update queryads.js

* Update list.js

* queryads.js: codacy fixes

* list.js: codacy fixes

* list.js: small correction

* queryads.js: small correction

* Be able to interpret status 5

* Sort list entries (black-/whitelist) alphabetically before creating the table

* queryads.js: Update*

* removed double comment and updated code to center and separate the buttons on small screens, like in my last screenshot.

* list.js: update*

updated code to center and separate the buttons on small screens, like in my last screenshot.
@jacobsalmela
Copy link
Contributor

@Mcat12 can this be closed based on your last comment?

@jacobsalmela
Copy link
Contributor

Looks like this is all fixed in v3.2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Fixed In Next Release
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@jacobsalmela @AzureMarker @DL6ER @Marcellaoo @Th3M3