|
- .uiMenu{position:absolute;right:10px;bottom:10px;width:336px;height:144px;padding:8px;background-color:rgba(55,48,65,.9)}.uiMenu [class^=btn]{width:64px;height:64px;margin:0 8px;float:left;cursor:pointer;position:relative}.uiMenu [class^=btn]:hover{background-color:rgba(252,252,252,.1)}.uiMenu [class^=btn] .icon{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%}.uiMenu [class^=btn].btnCollapse{display:none}.uiMenu [class^=btn].btnInventory .icon{background:url(../../../images/uiIcons.png) 0 0}.uiMenu [class^=btn].btnEquipment .icon{background:url(../../../images/uiIcons.png) -192px 0}.uiMenu [class^=btn].btnSmithing .icon{background:url(../../../images/uiIcons.png) -128px -64px}.uiMenu [class^=btn].btnPassives{position:relative}.uiMenu [class^=btn].btnPassives .points{width:100%;text-align:center;left:0;bottom:23px;position:absolute;color:#fcfcfc;filter:drop-shadow(0 -2px 0 #312136) drop-shadow(0 2px 0 #312136) drop-shadow(2px 0 0 #312136) drop-shadow(-2px 0 0 #312136)}.uiMenu [class^=btn].btnPassives .icon{background:url(../../../images/uiIcons.png) -320px -64px}.uiMenu [class^=btn].btnOnline .icon{background:url(../../../images/uiIcons.png) -64px 0}.uiMenu [class^=btn].btnHelp .icon{background:url(../../../images/uiIcons.png) -128px 0}.uiMenu [class^=btn].btnLeaderboard .icon{background:url(../../../images/uiIcons.png) -256px 0}.uiMenu [class^=btn].btnReputation .icon{background:url(../../../images/uiIcons.png) -320px 0}.uiMenu [class^=btn].btnMainMenu .icon{background:url(../../../images/uiIcons.png) 0 -64px}.mobile .uiMenu{bottom:auto;top:10px;right:10px;width:64px;height:64px}.mobile .uiMenu:after{content:'';position:absolute;left:0;top:0;background:url(../../../images/uiIcons.png);background-position:0 -64px;width:64px;height:64px}.mobile .uiMenu>*{display:none}.mobile .uiMenu.active{display:flex;flex-direction:column;height:calc(100% - 20px);width:200px;z-index:2;flex-wrap:wrap-reverse;align-items:center;justify-content:center}.mobile .uiMenu.active:after{display:none}.mobile .uiMenu.active>*{display:block;margin:0}.mobile .uiMenu.active .btnCollapse{display:block;position:absolute;right:calc(100% + 10px);top:50%;transform:translateY(-50%);background-color:rgba(55,48,65,.9);width:64px;height:64px}.mobile .uiMenu.active .btnCollapse .icon{width:100%;height:100%;background:url(../../../images/uiIcons.png) -448px 0}
|
