local root = lvgl.Object()

local width = 336
local height = 480
local val_color = "#ce9178"
local font = lvgl.Font("montserrat", 20, "normal")

root:set { w = width, h = height, pad_all = 0, scrollbar_mode = 0 }

local bg = root:Image {
   src = SCRIPT_PATH .. "assets/bg.png",
   x = 0,
   y = 0,
   pad_all = 0
}



local day = bg:Label {
    x = 165,
    y = 75,
    text = string.format("%02d", 15),
    text_font = font,
    text_color = val_color,
}

local month = bg:Label {
    x = 190,
    y = 100,
    text = string.format("%02d", 15),
    text_font = font,
    text_color = val_color,
}

local year = bg:Label {
    x = 175,
    y = 125,
    text = string.format("%02d", 15),
    text_font = font,
    text_color = val_color,
}

local weekday = bg:Label {
    x = 215,
    y = 150,
    text = string.format('"MON"'),
    text_font = font,
    text_color = val_color,
}

local time = bg:Label {
    x = 175,
    y = 175,
    text = string.format('"00:00:00"'),
    text_font = font,
    text_color = val_color,
}

local steps = bg:Label {
    x = 215,
    y = 225,
    text = string.format("%02d", 5000),
    text_font = font,
    text_color = val_color,
}

local heart = bg:Label {
    x = 215,
    y = 250,
    text = string.format("%02d", 60),
    text_font = font,
    text_color = val_color,
}

local calories = bg:Label {
    x = 250,
    y = 275,
    text = string.format("%02d", 800),
    text_font = font,
    text_color = val_color,
}

--[[
local battery = bg:Label {
    x = 200,
    y = 280
    text = string.format("%02d", 80),
    text_font = font,
    -- or builtin font:
    -- text_font = lvgl.BUILTIN_FONT.MONTSERRAT_22,
    text_color = val_color,
}
]]--