webcomp-flightdata/demo_customcss.html at main · noi-techpark/webcomp-flightdata · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<!--
SPDX-FileCopyrightText: NOI Techpark <digital@noi.bz.it>

SPDX-License-Identifier: CC0-1.0
-->

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible"
        content="IE=edge" />
  <meta name="viewport"
        content="width=device-width,initial-scale=1.0" />
  <title>Custom-CSS Demo</title>
  <link rel="stylesheet"
        href="https://fonts.googleapis.com/css?family=Open%20Sans">
  <script src="./dist/noi-mobility-atc.min.js"></script>
  <style>
    html,
    body,
    div {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0;
    }

    #customcss {
      width: 1265px;
      height: 480px;
    }

    @media screen and (max-width: 1300px) {
      #customcss {
        width: 400px;
        height: 535px;
      }
    }
  </style>
</head>

<body style="width: 100%; height: 100%">
  <div style="height:100%;display:flex;align-items: center;justify-content: center;">

    <noi-mobility-atc maxforecast="5"
                      styleurl="./demo-assets/custom.css"
                      id="customcss"
                      header="false"
                      map="false"
                      lang="de"
                      realtime="false"
                      departures="true"
                      tableheight="auto"
                      arrivals="true"
                      regionswitch="false"
                      maxage="80"
                      timezone="Europe/Berlin"
                      messages='{
                        "de": {
                          "Arrivals": "Arrivals",
                          "Departures": "Departures",
                          "Date": "Datum",
                          "Time": "Time",
                          "Origin": "Von / Via",
                          "Destination": "Nach / Via",
                          "Gate": "Gate",
                          "Remarks": "Info",
                          "Flight": "Flight",
                          "load more": "mehr anzeigen",
                          "de": "de-DE",
                          "SCHEDULED" : "Scheduled",
                          "LANDED" : "Landed",
                          "STARTED" : "Started",
                          "BOARDING" : "Boarding",
                          "Buy ticket": " "
                        }
                      }'
                      columns='{"morebutton" : false , "date": true,"time": true,"remark": true,"fromto": true,"flightnumber": true, "ticketlink": true }'>
    </noi-mobility-atc>

  </div>
</body>

</html>