.header { position: absolute; min-width: 100%; min-height: 40px; -webkit-app-region: drag; -webkit-user-select: none; &.no-drag { -webkit-app-region: no-drag; } .logo { position: relative; float: right; top: 10px; right: 10px; z-index: 1000; } .buttons { display: inline-block; position: relative; top: 10px; left: 15px; z-index: 1000; &:hover { .button-minimize.enabled { .at2x('minimize.png', 10px, 10px); } .button-close.enabled { .at2x('close.png', 10px, 10px); } .button-fullscreen.enabled { .at2x('fullscreen.png', 10px, 10px); } .button-fullscreenclose.enabled { .at2x('fullscreenclose.png', 10px, 10px); } } .button { .traffic-light(); &.button-close { background-color: @traffic-light-red; border-color: @traffic-light-red-border; } &.button-minimize { background-color: @traffic-light-yellow; border-color: @traffic-light-yellow-border; } &.button-fullscreen { background-color: @traffic-light-green; border-color: @traffic-light-green-border; } &.button-fullscreenclose { background-color: @traffic-light-green; border-color: @traffic-light-green-border; } &.disabled { background-color: @traffic-light-gray; border-color: @traffic-light-gray-border; } } } }