diff options
| author | Ferdinand Thiessen <opensource@fthiessen.de> | 2024-10-16 12:04:52 +0200 |
|---|---|---|
| committer | Ferdinand Thiessen <opensource@fthiessen.de> | 2024-10-21 22:56:11 +0200 |
| commit | d0c660a1da614b3d9739f9166245044c3277fd75 (patch) | |
| tree | c4364714a49f7020519048bdf15fa03a7e68f282 /apps | |
| parent | 5b6dd47fef31377530ea4cde2e0ad7a77a2ab956 (diff) | |
| download | nextcloud-server-d0c660a1da614b3d9739f9166245044c3277fd75.tar.gz nextcloud-server-d0c660a1da614b3d9739f9166245044c3277fd75.zip | |
fix(files): Adjust NavigationQuota for Nextcloud 30 design
Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/files/src/components/NavigationQuota.vue | 13 | ||||
| -rw-r--r-- | apps/files/src/views/Navigation.cy.ts | 10 |
2 files changed, 14 insertions, 9 deletions
diff --git a/apps/files/src/components/NavigationQuota.vue b/apps/files/src/components/NavigationQuota.vue index 11a32485952..389d3f346da 100644 --- a/apps/files/src/components/NavigationQuota.vue +++ b/apps/files/src/components/NavigationQuota.vue @@ -167,15 +167,18 @@ export default { // User storage stats display .app-navigation-entry__settings-quota { // Align title with progress and icon - &--not-unlimited::v-deep .app-navigation-entry__name { - margin-top: -6px; + --app-navigation-quota-margin: calc((var(--default-clickable-area) - 24px) / 2); // 20px icon size and 4px progress bar + + &--not-unlimited :deep(.app-navigation-entry__name) { + line-height: 1; + margin-top: var(--app-navigation-quota-margin); } progress { position: absolute; - bottom: 12px; - margin-inline-start: 44px; - width: calc(100% - 44px - 22px); + bottom: var(--app-navigation-quota-margin); + margin-inline-start: var(--default-clickable-area); + width: calc(100% - (1.5 * var(--default-clickable-area))); } } </style> diff --git a/apps/files/src/views/Navigation.cy.ts b/apps/files/src/views/Navigation.cy.ts index 46360a2357a..9c799116650 100644 --- a/apps/files/src/views/Navigation.cy.ts +++ b/apps/files/src/views/Navigation.cy.ts @@ -216,8 +216,9 @@ describe('Quota rendering', () => { cy.get('[data-cy-files-navigation-settings-quota]').should('be.visible') cy.get('[data-cy-files-navigation-settings-quota]').should('contain.text', '1 GB of 5 GB used') - cy.get('[data-cy-files-navigation-settings-quota] progress').should('be.visible') - cy.get('[data-cy-files-navigation-settings-quota] progress').should('have.attr', 'value', '20') + cy.get('[data-cy-files-navigation-settings-quota] progress') + .should('exist') + .and('have.attr', 'value', '20') }) it('Reached quota', () => { @@ -237,7 +238,8 @@ describe('Quota rendering', () => { cy.get('[data-cy-files-navigation-settings-quota]').should('be.visible') cy.get('[data-cy-files-navigation-settings-quota]').should('contain.text', '5 GB of 1 GB used') - cy.get('[data-cy-files-navigation-settings-quota] progress').should('be.visible') - cy.get('[data-cy-files-navigation-settings-quota] progress').should('have.attr', 'value', '100') // progress max is 100 + cy.get('[data-cy-files-navigation-settings-quota] progress') + .should('exist') + .and('have.attr', 'value', '100') // progress max is 100 }) }) |