Coder Social home page Coder Social logo

Comments (39)

nclmrc avatar nclmrc commented on August 18, 2024

If I click on language select there's a problem on the screen

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@Ansuel Could you provide a screenshot and browser/os you tried it on?

On my end it looks like this:
image
image
As soon as there is enough space a new column gets added.

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc Could you proveda screenshot and browser/os you tried this on?

This is how it is supposed to look:
image

from tch-nginx-gui.

emax810 avatar emax810 commented on August 18, 2024

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

@SeproDE i use Firefox. After click on language select.
cattura

cattura

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

Those are the issues I was able to reproduce:

  • openNav is being called while in desktop view when clicking a select Element
  • No visible cards on Safari (at least on my iPad i was still able to interact with them). I found out why they are invisible. Safari treats the overflow property different then other browsers. If i add overflow: visible !important; the cards are visible but the sidemenu is broken. I found a way to make it partially work. On mobile the openNav() and closeNav() function change the scroll property and on larger screens Safari (at least the iOS variant) will have a broken sidebar.
  • On Edge modal footer and header are not at there right position.
  • Internet Explorer doesn't limit width of sidebar
  • Internet Explorer and iOS Safari title is not centered
  • (partial fix) Footer not visible due to vh on mobile.
  • switches in side menu getting moved outside
  • On Edge fixed elements are jumpy. This is a know issue in Edge and supposed to be fixed with the Spring Creators Update
  • On Edge transform on fixed while scrolling looks buggy
  • nav-tabs overflow
  • Mobile view and scrolling via transform on fixed elements not working on Internet Explorer. Something keeps the Javascript from running.
  • Scrolling performance is very bad on mobile devices
  • Tiles not clickable on mobile
  • iOS grey overlay not visible

I will see what I can fix. If I found a solution I will mark them off.

If you found a fix, post either the snippet here or create a pull request.

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc I just created a pull request with a couple of bugfixes. Should be fixed.

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@emax810 This is caused by the way Safari Interpreters the overflow property and how we want a scrollbar for the sidemenu but fixed elements (that we later move) outside the sidemenu.

As far as I can tell there are two options for Safari: either we have a scrollbar for the sidemenu or we have cards.

This is the new behaviour i came up with:

  • On mobile the sidemenu is not visible at the same time as the cards. So Javascript takes care of applying the right overflow property.
  • On desktop this piece _::-webkit-full-page-media, _:future, :root of css hell will (hopefully) show cards but break the scrollbar in Safari while changing nothing for other browsers.

from tch-nginx-gui.

Ansuel avatar Ansuel commented on August 18, 2024

can you find a way to enable the aos animation

the loading animation doesn't show when the loading page is shown

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

Scroll until the end of the page doesn't work in some tab in desktop mode

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@Ansuel I don't think it's easily possible for the card's since they already have a transform property applied to them. For the modal view I have to say that i quite like the snappy feeling of not having to wait the 0.3 seconds until the animation is finished.

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc Could you provide some more information like browser and OS?

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

@SeproDE Google chrome on android

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc Could you give some instructions for how to replicate the bug.

The only thing I was able to find out is that if the screen size varies the modal view has the wrong size and with that the footer may be lost:
image
But I don't think this is what you meant.

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

screenshot_20180426-135005

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc Okay, thank you for reporting this. I was able to fix it, but this breaks something on iOS. Once I figure this out I will create a pull request.

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

the problem instead on firefox on windows 10 when i select language with teh arrow
cattura

cattura

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

@nclmrc I spend the better half of today investigating this issue, with many different possible solutions. Each one breaking something else...

Here is the basic rundown:

The problem occurs because I use max-height: 100vh; on the modal-body (I actually use calc() to also subtract a fixed value but that's besides the point). On mobile devices the vh unit represents the larger viewport (the one without the address bar) and not the currently active one. This is intentional behaviour and was copied by the Chrome team from iOS (more info).

The obvious answer would be to switch to max-height: 100%; and that works great on mobile and every browser I tried except Google Chrome Desktop. Chrome let's the element just overflow, which disables scrolling. This is also by design, because Chrome takes as a reference for 100% not the viewport but the parent element and since this element has height: auto;, max-height computes to none. (more info)

Setting the height to a fixed value is also not possible since the height is dependent on the content inside.

I have also tired applying max-height: 100vh; to Chrome Desktop and max-height: 100%; to everything else, but every CSS-Hack I tried applies to both Chrome variants.

As far as I can see there are two options now:

  1. Modal-footer at wrong position when address bar is hidden on Chrome for Android in forced Desktop mode.
  2. Always maximum size modal view on all browsers.

I would decide for number 1. But maybe I am wrong and there is a third option.

Im just an amateur having a bit of fun with CSS. If anybody knows of a solution to this problem: please share it.

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

@SeproDE in mobile view when I click on tab hasn't effect.

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

screenshot_20180428-174825
Chrome on android

from tch-nginx-gui.

nclmrc avatar nclmrc commented on August 18, 2024

Qualcuno riporta ancora problemi su questo tema?

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

controllai qualche release fa e gli ultimi problemi segnalai c'erano ancora

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

I really like the new stats page. Thought it should be visible in the cards section and since the original Fritz Cards werent that usefull I decided loading the stats page via a iFrame should closere resemble the original Fritz!Box ui. Here is what i made so far: Click

Please leave feeback before I create a PR. Should this be a seperate style or a update to the old one?

from tch-nginx-gui.

Ansuel avatar Ansuel commented on August 18, 2024

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

image

update:
image

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

@SeproDE i like it, do a PR

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

in some modals (where there is a button or something with a tooltip text) under the modal, cards will be shown behind the modal after you hover on the button.
fo example just go to the telephony modal and hover (and take the mouse out) on the bottom righ edit button

when you hover and go out from the button:
image

when you hover again:
image

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

Fixed! Created a PR.

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

can we put a loading spinner when "processing" (for example the one that appear on the end of wizard)
image

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

What Browser/OS and what Tab is the spinner not showing? This is how it looks in Chrome on Windows 10
image

I think this was one of the things i fixed along the way. Try it with the Version from the PR.

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

Same W10 Chrome, tryed a cache clean and just the first time the spinner is shown if i click again (on relay tab for example) the processing page is just blank, pretty strange

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

ps. can we remove the animation on the lateral menu? really boring that i have to wait the full page load (jquery event fired?) to see it

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

I think you are still running the old version. Try runnning the style version from my PR. Then the spinner should always be shown.

Regarding the animation. It's possible to just force the end state of the animation via the !important tag. Not pretty but it works.

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

Some mobile issue I noticed:

  • Login page looks broken
  • the bottom bar with the close button cover some content of the modal (an easy fix can be to move the close button in the upper light blue bar)

from tch-nginx-gui.

FrancYescO avatar FrancYescO commented on August 18, 2024

can we remove the giant word "TIM Modem" as a lot of us are not using a TIM modem? :D
image

Also the issue from #38 (comment) is still not solved, we need some sort of horizontal scrolling for tabs

from tch-nginx-gui.

dga4130-renato avatar dga4130-renato commented on August 18, 2024

Device Model: DGA ( DGA4132 )
Gui Version: 8.8.99
schermata del 2018-10-23 10-08-14
schermata del 2018-10-23 10-12-00

Description of problem:
On dark/midnight theme no diagnostics icons in main menu, only if you hoover on the icon displays
new version but bug still here

from tch-nginx-gui.

kevdagoat avatar kevdagoat commented on August 18, 2024

any news on this?

from tch-nginx-gui.

seproDev avatar seproDev commented on August 18, 2024

Well the question is if we want to have the dark skins as a separately developed fork or as an add on to the Fritz theme.
If its the first this should be separately fixed if its the second someone need to port the changes I made to the Fritz skin to the other two skins.

from tch-nginx-gui.

Ansuel avatar Ansuel commented on August 18, 2024

from tch-nginx-gui.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.