Enable users to jump to the global search bar by pressing the "/" key from anywhere. Open modals block this shortcut. This PR also introduces a generic system for declaring global shortcuts by utilizing the third-party library mousetrap.
On some pages with pagination, the user is led to believe that no data is available if a page with page number which it too high is accessed. However, since we show the page number to the outside and the user can access it through the URL, we must also provide appropriate handling. The underlying data can change and so can the number of pages. Now, if a bookmark was saved from an older version, the link should still lead to a destination.
Introduce tailwind as new frontend styling library to replace bulma in the longer run. Also create the first new ui library `ui-buttons` which will be the new standard for buttons ins SCM-Manager. In this library we reconsidered which types of buttons should be used to create a clean and consistent ui.
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Passwords should be checked when created or changed in the frontend just as they are in the backend for REST and CLI.
Also extend the password validation to allow upto 1024 characters instead of 32.
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
The landing-page-plugin is using the CardColumnSmall component from ui-components to display event as tiles. Most events have a link, but some, like the RepositoryDeletedEvent do not. For a better UX it is therefore necessary, to have a CardColumnSmall that is not internally wrapped in a link.
The toggle icon in the secondary navigation points in the wrong direction.
In the changeset and code view, the current status is displayed with the icon. This should also be the case for this component.
Currently there is a link to Theme with the name Profile in the footer. Another link should be added which is called Theme and points to Theme. In addition, Profile should now point to Information.
Users need to understand which option they are choosing in an confirmation dialog. Buttons for primary and secondary actions should be visually discernible when one is focused/hovered.
The changes remove default-styling from buttons in confirmation dialogues. The style is set in the element using this dialog to better visually separate the primary and secondary action.
Resolves#2049
Adds a new initialization step after setting up the initial administration account that allows administrators to initialize the instance with a selection of plugin sets.
Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Co-authored-by: Matthias Thieroff <matthias.thieroff@cloudogu.com>
The styling for the focused line (e.g. permalink) in the source view with syntax highlighting was hard-coded and did not meet accessibility standards, especially in high-contrast mode. This pull request introduces two new css variables that are fine-tuned to meet contrast requirements for each theme. An additional "bar" with specifically high contrast has been added to the left of the focused line, because it was impossible to find one background color that would provide sufficient contrast with both the page background as well as all highlighting colors.
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
In .card-tables there was an action area that had a darker background. Now this area only contains the delete action. Also, users mistakenly assumed that the hovered area could be clicked. It has therefore been removed and the icons themselves have received a hover effect.
The way the tool tip implements passed class names is mistakable. The passed classes broke the tool tip and are removed. The same issue led to a broken tool tip for the code search and is fixed as well. Unnecessary code is removed from help.
Fixes#2025
We unified syntax highlighting and extracted it into a low level module. Syntax highlighting from now on takes place in a web worker, so that the user interface stays responsive. The web worker stops automatically if the number of nodes which should be highlighted exceeds the defined limit we believe the browser can handle.
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
Co-authored-by: Konstantin Schaper <konstantin.schaper@cloudogu.com>
If entities like users, groups or repository namespaces contains parenthesis the frontend router gets confused and doesn't work properly. To fix this issue we escape the chars in the url which may cause such problems because they are reserved by the http url schema.
Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
Co-authored-by: Florian Scholdei <florian.scholdei@cloudogu.com>
Avoid unnecessary re-rendering of markdown view which e.g. caused an embedded secure code warrior video to reload on every page interaction.
Co-authored-by: Konstantin Schaper <konstantin.schaper@cloudogu.com>
* The scss variable $popover-border-color is now also used throughout the internal styles
* Derived css variable is exported only once
* Scss definitions are now organized and structured with descriptive comments
* Fix incorrect styling due to a too dark and at the same time very thick border in the CreateButton component
* Darken $border-light a little, so that it is not brighter than the border in dark mode
At certain screen sizes the table in code view breaks if more than one action is available in a row. The fix enables the list of actions to wrap if the table is displayed on smaller sizes.
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Co-authored-by: Matthias Thieroff <matthias.thieroff@cloudogu.com>
This pull request converts the current incomplete textual documentation of the available frontend extension points to in-code definitions that act both as documentation and as type helpers for improving overall code quality. All extension points available in the SCM-Manager core are now available, but no plugin was updated and only those parts of the core codebase had the new types added that did not require runtime changes. The only exception to this is the breadcrumbs, which was a simple change that is fully backwards-compatible.
This commit introduces a new more relaxed theme, the dark theme!
In addition, the theme can now be selected according to the system defaults.
And the other themes, as well as the general structure were unified/simplified.
Co-authored-by: Philipp Ahrendt <philipp.ahrendt@cloudogu.com>
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
Co-authored-by: Matthias Thieroff <matthias.thieroff@cloudogu.com>
Enable breaking of content to be fully available on small screens or highly zoomed displays. This should help improve accessibility.
Co-authored-by: Florian Scholdei <florian.scholdei@cloudogu.com>
Co-authored-by: Konstantin Schaper <konstantin.schaper@cloudogu.com>
Split large frontend components into own bundles. This way we decrease loading times and load the bundles right as they are used. We replace SystemJS with our own implementation to load the lazy modules right as there are required.
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
Fixes several accessibility issues:
- Provide a style for empty table column headers
- Add aria references and aria-labels
- Remove aria references if the referenced element is not rendered
There has been the requirement to improve accessibility for our tooltips by allowing tooltips to be closed via the escape key as well as allowing users to hover over the tooltip text. These combined requirements were not possible with the previous implementation that used a bulma-tooltip extension. That meant we had to implement the full tooltip html and css from scratch. A declared goal was to keep the new implementation as close to the previous look-and-feel as possible. The redundant dependency has been removed in the process.
This is the fixed re-commit of #1938 (Commit 67bd96ea81)
Co-authored-by: Konstantin Schaper <konstantin.schaper@cloudogu.com>
Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
If the plugin center authentication fails,
the plugins are fetched without authentication
and a warning is displayed on the plugin page.
Co-authored-by: Konstantin Schaper <konstantin.schaper@cloudogu.com>
There has been the requirement to improve accessibility for our tooltips by allowing tooltips to be closed via the escape key as well as allowing users to hover over the tooltip text. These combined requirements were not possible with the previous implementation that used a bulma-tooltip extension. That meant we had to implement the full tooltip html and css from scratch. A declared goal was to keep the new implementation as close to the previous look-and-feel as possible. The redundant dependency has been removed in the process.
A recent update added a button that lets users copy source code. In markdown files, the toggle button covers the copy button visually which does not look good and makes it hard/impossible to use. Additionally, larger markdown files with multiple code blocks have too many visible buttons that clutter the screen. This PR moves the markdown toggle above the actual display and only shows the copy button upon hovering the code that is to be copied.
Implement initial focus for modals. Change all modals including forms to put initial focus on the first input. When Enter is pressed on any input (CTRL + Enter for Textareas), the form is submitted if it is valid.
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
Users, groups, repositories and repository roles have been sorted in the rest layer by default if no other sort option was given. In the layers "below" (aka the manager classes or the dao), the collections have been unsorted. This led to the effect, that the autocomplete resource, which did not sort all values beforehand, returned unsorted results. As a sideeffect, direct matches for an input could occur at a random position or not at all (as reported in #1695), when there were enough other matches.
With this pull request the databases for users, groups, repositories and repository roles will use instances of TreeMap instead of LinkedHashMap internally, so that these values are sorted implicitly (by id respectively name for users, groups and repository roles and namespace/name for repositories).
Due to this change the default sort applied in the rest layer could be removed.
Changes the "namespace" input in the repository creation form or the "rename repository" dialog to an
autocomplete input. Of course this is only available for the "custom" namespace strategy.
Make breadcrumb not clickable with new property. This is useful to show the breadcrumb for path that does not exist yet.
Co-authored-by: René Pfeuffer <rene.pfeuffer@cloudogu.com>
Further fixes for the high contrast mode, modly regarded to the autocomplete component.
This is a fixup for #1892
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
Fix syntax highlighting on non highlighted fields. Fix ellipsis on new lines in code syntax highlighting. Fix ellipsis on content start or end in non code fields.
Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>
