diff --git a/examples/UEFA/UEFA.en.shtml b/examples/UEFA/UEFA.en.shtml index d0eaf5b7..537317d8 100644 --- a/examples/UEFA/UEFA.en.shtml +++ b/examples/UEFA/UEFA.en.shtml @@ -114,30 +114,42 @@ class Token { } else if(this.props.redeemed === "0") { redeemedMessage = "(Not redeemed)" } - return `
-
- x${this.props._count} - ${this.props.category} - ${redeemedMessage} -
-
- ${this.props.venue} -
-
-   -
-
- - ${date} - - ${this.props.countryA}-${this.props.countryB} - - M${this.props.match} -
-
- ${time},  ${this.props.locality} -
-
`; + return `
+
+
+ + UEFA EURO 2020 HOSPITALITY + + + ${this.props.countryA} - ${this.props.countryB} + + + ${this.props.venue} + +
+
+ + + M${this.props.match} + +
+
+
+
+
+ + + ${date} + +
+
+ + + ${this.props.category} + +
+
+
`; } } diff --git a/examples/UEFA/notes.html b/examples/UEFA/notes.html new file mode 100644 index 00000000..a7972e6e --- /dev/null +++ b/examples/UEFA/notes.html @@ -0,0 +1,24 @@ +
+
+ x${this.props._count} + ${this.props.category} + ${redeemedMessage} +
+
+ ${this.props.venue} +
+
+   +
+
+ + ${date} + + ${this.props.countryA}-${this.props.countryB} + + M${this.props.match} +
+
+ ${time},  ${this.props.locality} +
+
\ No newline at end of file diff --git a/examples/UEFA/shared.css b/examples/UEFA/shared.css index bdd0f91a..202df8c3 100644 --- a/examples/UEFA/shared.css +++ b/examples/UEFA/shared.css @@ -1,46 +1,121 @@ -.tbml-count { - font-family: "SourceSansPro"; - font-weight: bolder; - font-size: 21px; - color: rgb(117, 185, 67); -} .tbml-category { font-family: "SourceSansPro"; - font-weight: lighter; - font-size: 21px; - color: rgb(67, 67, 67); + font-weight: 400; + font-size: 12px; + color: white; } .tbml-venue { font-family: "SourceSansPro"; - font-weight: lighter; - font-size: 16px; - color: rgb(67, 67, 67); + font-weight: 500; + font-size: 15px; + color: white; + display: block; + padding-top: 3%; } -.tbml-date { +.tbml-match { font-family: "SourceSansPro"; font-weight: bold; - font-size: 14px; - color: rgb(112, 112, 112); - margin-left: 7px; - margin-right: 7px; + font-size: 19px; + color: white; + padding: 2%; + background-color: rgb(117, 185, 67); + display: block; + text-align: center; + margin-top: 1px; + width: 80%; + margin: auto; + margin-top: 8%; } .tbml-time { font-family: "SourceSansPro"; font-weight: lighter; - font-size: 16px; - color: rgb(112, 112, 112); + font-size: 15px; + color: white; +} +.data-icon { + height: 20px; + vertical-align: middle; + color: white; +} +.ticket { + background-image: url('data:image/png;base64,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'); + border-radius: 10px; + display: flex; + flex-direction: column; + background-size: cover; + height: -webkit-fill-available; + width: -webkit-fill-available; } -html { +.ticketname { + font-family: "SourceSansPro"; + font-weight: 500; + font-size: 15px; + color: white; + width: 100%; + display: block; + padding-top: 3%; } -body { - padding: 0px; - margin: 0px; +.tbml-city { + font-family: "SourceSansPro"; + font-weight: bolder; + font-size: 25px; + color: white; + display: block; + padding-top: 3%; } -div { - margin: 0px; - padding: 0px; + +.ticket-bottom-section { + padding-left: 3%; + display: flex; + width: 100%; + margin: auto; + padding-bottom: 15%; + align-self: center; } -.data-icon { - height:16px; - vertical-align: middle +.left-column{ + flex: 70%; + align-items: center; + display: block; + padding-top: 5%; +} +.right-column{ + flex: 30%; + display: block; +} +.uefa-logo { + height: -webkit-fill-available; + width: -webkit-fill-available; + display: block; + margin: auto; +} +.date { + font-family: "SourceSansPro"; + font-weight: 400; + font-size: 12px; + color: white; +} +.top-section { + display: flex; + flex-direction: row; + padding: 5%; + margin-bottom: 35%; +} +.local-time { + font-family: "SourceSansPro"; + font-weight: lighter; + font-size: 10px; + color: white; +} + +.left-col { + flex: 50%; + margin-left: 2%; +} +.right-col { + flex: 50%; +} +.white-line { + border: 5% solid white; + width: -webkit-fill-available; + margin-bottom: 3%; } \ No newline at end of file diff --git a/examples/UEFA/test.html b/examples/UEFA/test.html new file mode 100644 index 00000000..f200ad0f --- /dev/null +++ b/examples/UEFA/test.html @@ -0,0 +1,39 @@ + +
+
+
+
+ + UEFA EURO 2020 TICKET + + + USA - POL + + + ANZ Stadium + +
+
+ + + M9 + +
+
+
+
+
+ + + June 20th, 6:00PM + +
+
+ + + Match Club + +
+
+
+