-
-
Save dugite-code/ce068c75110e08cd669f016be65bf55e to your computer and use it in GitHub Desktop.
| @media only screen and (min-width: 768px) { | |
| .app-mail #app-navigation { | |
| min-width: 250px !important; | |
| } | |
| #mail-new-message-fixed, #app-navigation-accounts, .app-mail #app #app-navigation #app-settings #app-settings-header, .app-mail #app #app-navigation #app-settings #app-settings-content { | |
| width: 300px !important; | |
| } | |
| .app-mail #app-content { | |
| height: calc(100vh - 50px); | |
| display: flex; | |
| flex-direction: column; | |
| flex-grow: 0; | |
| overflow-x: hidden; | |
| } | |
| .app-mail #app-content #app-content-wrapper { | |
| flex-direction: column; | |
| overflow: hidden; | |
| } | |
| .app-mail #app-content #app-content-wrapper .app-content-list { | |
| top: auto !important; | |
| width: auto !important; | |
| max-width: 100vw !important; | |
| min-height: 10% !important; | |
| height: 30%; | |
| border-right: none !important; | |
| border-bottom: 4px solid #ebebeb !important; | |
| resize: vertical; | |
| flex: unset; | |
| } | |
| .app-mail #app-content #app-content-wrapper .app-content-details { | |
| max-height: 90% !important; | |
| min-height: 20% !important; | |
| flex: 1; | |
| overflow-y: auto; | |
| } | |
| #mail-message, .app-content-details{ | |
| max-width: revert !important; | |
| margin: revert !important; | |
| } | |
| #mail-message-header { | |
| top: auto !important; | |
| position: relative !important; | |
| background: #ebebeb !important; | |
| width: 100% !important; | |
| } | |
| #mail-message-header h2 { | |
| font-weight: bold; | |
| } | |
| #mail-content, .mail-message-attachments { | |
| margin: 10px 10px 50px 30px !important; | |
| } | |
| #emptycontent { | |
| margin-top: 5vh; | |
| } | |
| #load-more-mail-messages { | |
| margin-top: 5px !important; | |
| margin-bottom: 5px !important; | |
| } | |
| .special-inbox.collapsible > .folder, .special-drafts.collapsible > .folder, .special-flagged.collapsible > .folder, .special-sent.collapsible > .folder { | |
| flex: auto !important; | |
| margin-left: 20px !important; | |
| box-shadow: none !important; | |
| } | |
| .app-mail #app-navigation .collapsible:not(.open) .app-navigation-entry-utils{ | |
| border-bottom: #0082C9 solid 2px !important; | |
| } | |
| .app-mail #app-navigation .collapsible.open { | |
| background-color: #ebebeb !important; | |
| border-top: #fff 5px solid; | |
| } | |
| .app-mail #app-navigation .collapsible.open > .folder { | |
| font-weight: bold; | |
| border-bottom: #0082C9 solid 2px !important; | |
| } | |
| #mail-message-has-blocked-content { | |
| border: 1px solid #ffd480 !important; | |
| background: #ffff99 !important; | |
| padding: 10px !important; | |
| } | |
| iframe table{ | |
| table-layout: inherit !important; | |
| } | |
| } |
dugite-code
commented
Nov 30, 2017
Updated for Nextcloud 13 See the revisions page for Nextcloud 12
Updated for Nextcloud 14. Note: Not backwards compatible
Tested with Nextcloud 15
Does the file still run on NC 20.7? I followed the instructions but don't see a difference. Thanks for your help!
Hi, Unfortunately I haven't been using the mail app for a few versions. I'll re-install it and give it a shot, if it's not too much work I'll do an update
Exact same problem here using Nextcloud 20.0.7
Not sure if I did it right but I replaced #app-content selector by #app-content-vue everywhere in horizontal.css an it appeared to work properly. I might have some bias so please confirm I did it right.
@onclefranck That's part of the fix, looks like the scroll on the content iframe and the reply container need tweaking as they are currently stuck
Thank you so much for coming up with this in the first place, and even now looking at it again. It seems such a fundamental thing I can't believe it's not baked in in the first place.
Does it work with 23.0.x?
I have no luck to make it work.
@pm-pm No it currently doesn't work in 23.0.x I'm planning on working to get it working as I've started using Nextcloud mail again
@pm-pm On further inspection it appears this is no longer possible (at least with the flexible split panes) as the app is no longer using css for managing the pane sizing. The project is now using the https://github.com/antoniandre/splitpanes project and this breaks the method I was using quite completely.