A short update: I was able to move the modules manually using css. It seems to work but it’s not an elegant solution. Any ideas/suggestions how to do it right?
[image: 1558509939648-screenshot-2019-05-21-at-23.30.34.png]
tml {
height: 1080px;
width: 1920px;
}
header {
text-transform: uppercase;
font-size: 26px;
font-family: "Roboto Condensed";
font-weight: 600;
border-bottom: 1px solid white;
line-height: 15px;
padding-bottom: 5px;
margin-bottom: 10px;
color: cadetblue;
}
body {
margin: 10px;
position: absolute;
height: 1080;
width: 1920px;
background-color: rgba(214, 214, 214, 0.8);
background-repeat: no-repeat;
/*background-size: 1920;*/
font-family: "Roboto Condensed", sans-serif;
font-weight: 400;
font-size: 2em;
line-height: 1.5em;
-webkit-font-smoothing: antialiased;
}
.region.top.left .container .module.currentweather {
width: 400px;
height: 250px;
position: absolute;
left: 90px;
top: 90px;
background-color: rgba(20, 102, 186, 0.5); /*kek*/
}
.module.clock {
width: 400px;
height: 400px;
position: absolute;
left: 760px;
top: 90px;
background-color: rgba(80, 196, 0, 0.5); /*zold*/
}
.region.top.right .container .module.MMM-SL-PublicTransport {
width: 400px;
height: 500px;
position: absolute;
left: 1490px;
top: -00px;
background-color: rgba(20, 102, 186, 0.5);
}
.region.bottom.bar .container {
width: 1740px;
height: 310px;
position: absolute;
left: 90px;
top: 680px;
background-color: rgba(247, 173, 236, 0.5); /*magente*/
}
