diff options
author | Vinicius Reis <vinicius.reis@nextcloud.com> | 2022-10-03 10:32:51 +0300 |
---|---|---|
committer | Jonas (Rebase PR Action) <jonas@freesources.org> | 2022-10-03 23:19:15 +0300 |
commit | 787077b1d2c1739a4d9fd081df68a52fb31079b8 (patch) | |
tree | 98c39b55ad6d80377b0d437dc07eb856e2d7726d /src | |
parent | 0e605d9f7e166bf5e2641bdd776da735ffe9c9f0 (diff) |
🎨 format css
Signed-off-by: Vinicius Reis <vinicius.reis@nextcloud.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/nodes/ImageView.vue | 186 |
1 files changed, 93 insertions, 93 deletions
diff --git a/src/nodes/ImageView.vue b/src/nodes/ImageView.vue index 443488836..7d7bf08aa 100644 --- a/src/nodes/ImageView.vue +++ b/src/nodes/ImageView.vue @@ -332,126 +332,126 @@ export default { </script> <style scoped lang="scss"> - .image { - margin: 0; - padding: 0; - } +.image { + margin: 0; + padding: 0; +} - .image__caption { +.image__caption { + text-align: center; + color: var(--color-text-lighter); + display: flex; + align-items: center; + justify-content: center; + &__wrapper { + position: relative; + } + input[type='text'] { + width: 200px; + max-width: 80%; text-align: center; - color: var(--color-text-lighter); - display: flex; - align-items: center; - justify-content: center; - &__wrapper { - position: relative; - } - input[type='text'] { - width: 200px; - max-width: 80%; - text-align: center; - background-color: transparent; - border: none !important; - color: var(--color-text-maxcontrast) !important; + background-color: transparent; + border: none !important; + color: var(--color-text-maxcontrast) !important; - &:focus { - border: 2px solid var(--color-border-dark) !important; - color: var(--color-main-text) !important; - } + &:focus { + border: 2px solid var(--color-border-dark) !important; + color: var(--color-main-text) !important; } } +} - .image__loading { - height: 100px; - } +.image__loading { + height: 100px; +} - .image__main--broken-icon, .image__error-message { - color: var(--color-text-maxcontrast); - } +.image__main--broken-icon, .image__error-message { + color: var(--color-text-maxcontrast); +} - .image__view { - text-align: center; - position: relative; +.image__view { + text-align: center; + position: relative; - img { - max-width: 100%; - } + img { + max-width: 100%; + } - &:hover { - input[type='text'] { - border: 2px solid var(--color-border-dark) !important; - color: var(--color-main-text) !important; - } + &:hover { + input[type='text'] { + border: 2px solid var(--color-border-dark) !important; + color: var(--color-main-text) !important; } } +} - .image__main { - max-height: calc(100vh - 50px - 50px); - } +.image__main { + max-height: calc(100vh - 50px - 50px); +} - .media { +.media { + display: flex; + align-items: center; + justify-content: left; + .media__wrapper { display: flex; - align-items: center; - justify-content: left; - .media__wrapper { - display: flex; - border: 2px solid var(--color-border); - border-radius: var(--border-radius-large); - padding: 8px; + border: 2px solid var(--color-border); + border-radius: var(--border-radius-large); + padding: 8px; - img { - width: 44px; - height: 44px; - } + img { + width: 44px; + height: 44px; + } - .metadata { - margin-left: 8px; - display: flex; - flex-direction: column; - align-items: start; + .metadata { + margin-left: 8px; + display: flex; + flex-direction: column; + align-items: start; - span { - line-height: 20px; - font-weight: normal; + span { + line-height: 20px; + font-weight: normal; - &.size { - color: var(--color-text-maxcontrast); - } + &.size { + color: var(--color-text-maxcontrast); } } } - .buttons { - margin-left: 8px; - } } - - .image__error-message { - display: block; - text-align: center; + .buttons { + margin-left: 8px; } +} - .fade-enter-active { - transition: opacity .3s ease-in-out; - } +.image__error-message { + display: block; + text-align: center; +} - .fade-enter-to { - opacity: 1; - } +.fade-enter-active { + transition: opacity .3s ease-in-out; +} - .fade-enter { - opacity: 0; - } +.fade-enter-to { + opacity: 1; +} - .image__caption__delete { - display: flex; - align-items: center; - width: 20px; - height: 20px; - position: absolute; - right: -6px; - bottom: 10px; - &, svg { - cursor: pointer; - } +.fade-enter { + opacity: 0; +} + +.image__caption__delete { + display: flex; + align-items: center; + width: 20px; + height: 20px; + position: absolute; + right: -6px; + bottom: 10px; + &, svg { + cursor: pointer; } +} </style> |