Docs
Tesla Core
HUD Position

HUD Position

Getting started

You have to play in fullscreen mode otherwise the config won't be applied.

To set your custom HUD Position you need to know your screen size. After you got your screen size you can open the following file playlolly-tesla-core/files/hud/styles/responsive.css you only need some minor css knowledge to set it up.

Maybe this small tutorial is enough ;)

CSS Explanation

In the .css File you can scroll down to your desired screen resolution.

If there isn't your exact Resolution you can simply create one as following.

@media (width: YOURWIDTHpx) and (height: YOURHEIGHTpx) {
  #teslaHUD {
    transform: scale(0.7);
    transform-origin: 0 0;
    margin-top: 730px;
    margin-left: 1580px;
  }
}

Setting the postition

For this Tutorial we are using the screen resolution 1920x1080px

With the pixel margin you are setting the position of the top left corner from the Tesla HUD.

margin-top: NUMBERpx is setting the Space between the top of the HUD and the top of your screen.
margin-left: NUMBERpx is setting the Space between the left side of the HUD and the left side of your screen.

The code block below sets the HUD to the bottom right position.

@media (width: 1920px) and (height: 1080px) {
  #teslaHUD {
    transform: scale(0.7);
    transform-origin: 0 0;
    margin-top: 730px;
    margin-left: 1580px;
  }
}

You may tweak the setting to your desire

Helping the Community

Finally! If you see that there isn't a setting for your screen and you want to help us, you may send uf your config so we can help future Community members by giving them a correct working HUD for there screens.