.Sidebar { flex: 0 0 230px; display: flex; flex-direction: column; min-height: 100%; background-color: rgb(247, 246, 243); padding: 10px 0; &.hidden { position: absolute; top: 0; left: 0; z-index: 15; min-height: 0; height: 50px; width: 50px; background: none; padding: 0; > div { padding: 0; margin: auto; } } .octo-sidebar-header { display: flex; flex-direction: row; font-weight: 600; padding: 3px 20px; margin-bottom: 5px; } .octo-sidebar-item { display: flex; flex-direction: row; font-weight: 500; padding: 3px 20px; &.subitem { color: rgba(25, 23, 18, 0.6); font-weight: 400; margin-left: 20px; } } .octo-sidebar-title { cursor: pointer; flex-grow: 1; } .octo-sidebar-item { &:hover { background-color: rgba(0, 0, 0, 0.05); } .octo-button { &:hover { background-color: rgba(0, 0, 0, 0.1); } } } }