# Optimize Obsidian UI for a more seamless experience

**URL:** <https://forum.obsidian.md/t/optimize-obsidian-ui-for-a-more-seamless-experience/155>\
**Category:** Basement\
**Created:** [May 21, 2020, 3:21am UTC](https://forum.obsidian.md/t/optimize-obsidian-ui-for-a-more-seamless-experience/155 "2020-05-21T03:21:42Z")\
**Posts on this page:** 1\
**Showing post:** 5

<div class="post-metadata">

**Author:** ![rsdimitrov](https://forum.obsidian.md/user_avatar/forum.obsidian.md/rsdimitrov/32/746_2.png) [@rsdimitrov](https://forum.obsidian.md/u/rsdimitrov)\
**Post date:** [June 2, 2020, 7:53am UTC](https://forum.obsidian.md/t/optimize-obsidian-ui-for-a-more-seamless-experience/155/5 "2020-06-02T07:53:27Z")

</div>

> [@mjedmonds](#):
>
> ```auto
> /* auto collapses side panels */
> /* .app-container.is-left-sidedock-collapsed .side-dock.mod-left:not(:hover), .app-container.is-right-sidedock-collapsed .side-dock.mod-right:not(:hover) {
> width: 0px !important;
> } */
> 
> ```

Based on your code I did more simplifications:

```
/* auto fades note header controlls */
.view-header:not(:hover) .view-actions {
  opacity: 0.1;
  transition: opacity .25s ease-in-out;
}

/* auto fades status bar items */
.status-bar:not(:hover) .status-bar-item {
  opacity: 0.25;
  transition: opacity .25s ease-in-out;
}

/* smaller scrollbar */
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, ::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

```

Edit1: Updated smaller scrollbar code to fix all scrollbars

---

_[View the full topic](https://forum.obsidian.md/t/optimize-obsidian-ui-for-a-more-seamless-experience/155)._