UI: The topbar doesn't scale properly #258

kreyren commented 2020年09月14日 05:18:28 +02:00

i find this very annoying on codeberg:

image

As i have to each time resize the browser window to have access to all the buttons.

1. Suggestion

Make the right user part
image

Always visible on desktop view and hide the other buttons

2. Suggestion

Redesign the top-bar to be integrated in the UI i.e:
image

i find this very annoying on codeberg:  As i have to each time resize the browser window to have access to all the buttons. ### 1. Suggestion Make the right user part  Always visible on desktop view and hide the other buttons ### 2. Suggestion Redesign the top-bar to be integrated in the UI i.e: 

hw commented 2020年09月15日 22:38:00 +02:00

CSS fix to overlap the right hand side on top of the left very welcome! File in question is https://codeberg.org/Codeberg/build-deploy-gitea/src/branch/master/etc/gitea/public/codeberg.css.

CSS fix to overlap the right hand side on top of the left very welcome! File in question is https://codeberg.org/Codeberg/build-deploy-gitea/src/branch/master/etc/gitea/public/codeberg.css.

kreyren commented 2020年09月16日 01:42:46 +02:00

@hw Using

.ui.menu:not(.vertical) .right.item, .ui.menu:not(.vertical) .right.menu {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 margin-left: auto !important;
 position: absolute;
 right: 0;
}

Results in

image

So i've concluded that this requires a HTML change to define another <div> so that the elements in <div class="ui container" id="navbar"> would scale responsibely based on the width of the windows used in relation to the right stackable menu so i assume that this is a Gitea issue assuming that the same problem is present on the try.gitea.io?

image

@hw Using ```css .ui.menu:not(.vertical) .right.item, .ui.menu:not(.vertical) .right.menu { display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: auto !important; position: absolute; right: 0; } ``` Results in  So i've concluded that this requires a HTML change to define another `<div>` so that the elements in `<div class="ui container" id="navbar">` would scale responsibely based on the width of the windows used in relation to the `right stackable menu` so i assume that this is a Gitea issue assuming that the same problem is present on the try.gitea.io? 

kreyren commented 2020年09月16日 01:45:14 +02:00

Also this is probably another issue:

image

Notice the slope

Also this is probably another issue:  Notice the slope

hw commented 2020年09月16日 12:20:32 +02:00

iirc this is switched via media selector, not sure about details

iirc this is switched via media selector, not sure about details

6543 commented 2020年09月18日 02:47:59 +02:00

-> #235

-> #235