TeHyBug_co2.widget.js

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: teal; icon-glyph: magic;
// These must be at the very top of the file. Do not edit.
// icon-color: deep-blue; icon-glyph: magic;
// replace locale with yours
let locale = 'de-DE'

const tehybug_data = await get_tehybug_data()
const widget = new ListWidget()
await createWidget()

// used for debugging if script runs inside the app
if (!config.runsInWidget) {
    await widget.presentSmall()
}
Script.setWidget(widget)
Script.complete()

// build the content of the widget
async function createWidget() {

    
    const logoReq = new Request('https://tehybug.com/site/static/images/tehybug-logo-white.png')
    const logoImg = await logoReq.loadImage()

    //widget.setPadding(5,5,5,5)
    widget.url = "https://tehybug.com"
    widget.backgroundColor = new Color("#1fa67a", 1.0)
    const title_row = widget.addStack()
    title_row.layoutHorizontally()
    const title = title_row.addText("TeHyBug CO2")
    title.font = Font.mediumRoundedSystemFont(18)
    title.textColor = new Color("#ffffff")
    widget.addSpacer(5)
    
    
    let row = widget.addStack()
    row.layoutHorizontally()
    
   
   const logoImageStack = row.addStack()
   logoImageStack.layoutVertically()
    logoImageStack.backgroundColor = new Color("#1ca67a", 1.0)
    //logoImageStack.cornerRadius = 8
    const wimg = logoImageStack.addImage(logoImg)
    wimg.imageSize = new Size(40, 40) 
   logoImageStack.adds 
    
    let column = row.addStack()
    column.layoutVertically()
   column.setPadding(0,10,0,0)
    
    let data_font_size = 16
    
    
    if(tehybug_data['temperature']!="")
    {
        let temp = column.addText(parseFloat(tehybug_data['temperature']).toFixed(1).toString()+' °C')
        temp.font = Font.lightMonospacedSystemFont(data_font_size)
        temp.textColor = new Color("#ffffff")
    }
    if(tehybug_data["humidity"]!="")
    {
        let humi = column.addText(parseFloat(tehybug_data['humidity']).toFixed().toString()+' %RH')
        humi.font = Font.lightMonospacedSystemFont(data_font_size)
        humi.textColor = new Color("#ffffff")
    }
    if(tehybug_data["pressure"]!="")
    {
        let press = column.addText(parseFloat(tehybug_data['pressure']).toFixed().toString()+' hPa')
        press.font = Font.lightMonospacedSystemFont(data_font_size)
        press.textColor = new Color("#ffffff")
    }
    if(tehybug_data["co2"]!=null)
    {
        let co2 = column.addText(parseFloat(tehybug_data["co2"]).toFixed().toString()+' ppm')
        co2.font = Font.lightMonospacedSystemFont(data_font_size)
        co2.textColor = new Color("#ffffff")
    }

    widget.addSpacer(5)
    
    
    const row2 = widget.addStack()
    row2.layoutVertically()
    row2.layoutVertically()
    
    // replace de-DE with your locale
    let currentTime = new Date().toLocaleTimeString(locale, { hour: "numeric", minute: "numeric" })
    
    let time = row2.addText(currentTime.toString())
    time.font = Font.lightMonospacedSystemFont(10)
    time.textColor = new Color("#dddddd")

   widget.addSpacer(5)
   
}


// get tehybug data
async function get_tehybug_data() {
    const url = 'http://tehybug.local/'
    const req = new Request(url)
    const apiResult = await req.loadJSON()
    return apiResult
}

Requirements
iOS 14
Scriptable version 1.5 (or higher) https://apps.apple.com/de/app/scriptable/id1405459188

Installation
copy the source code above (click "raw" on the upper right)
open the Scriptable app
click on the "+" symbol in the upper right and paste the script
click on the title at the top and give it a name (i.e. TeHyBug)
save it by clicking "done" in the upper left
go to your homescreen, long press anywhere to enter the "wiggle mode"
press the "+" sign on the upper left, scroll down to "Scriptable", choose the first (small) size and press "Add widget" at the bottom
while still in wiggle mode, tap the widget to enter its setup screen
as a "Script" choose your saved script from above (TeHyBug)