| Index: sky/examples/flights-app/app-toast.sky
|
| diff --git a/sky/examples/flights-app/app-toast.sky b/sky/examples/flights-app/app-toast.sky
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..f04db163b483fe5c96bf861c074a05f9e69fef9c
|
| --- /dev/null
|
| +++ b/sky/examples/flights-app/app-toast.sky
|
| @@ -0,0 +1,36 @@
|
| +<import src="../../framework/sky-element/sky-element.sky" as="SkyElement" />
|
| +<template>
|
| + <style>
|
| + :host {
|
| + position: absolute;
|
| + bottom: 32px;
|
| + right: 32px;
|
| + max-width: 55%;
|
| + box-shadow: 0px 0px 12px 2px rgba(22, 22, 22, 0.4);
|
| + background-color: #b0281a;
|
| + background-image: linear-gradient(#E5D658, #DFCF43);
|
| + border: 1px solid #AEA477;
|
| + padding: 6px;
|
| + border-radius: 2px;
|
| + display: flex;
|
| + align-items: center;
|
| + font-size: 0.8em;
|
| + }
|
| +
|
| + .header {
|
| + flex-shrink: 0;
|
| + margin-right: 6px;
|
| + }
|
| + </style>
|
| + <div class="header">
|
| + <content select=".toast-icon" />
|
| + </div>
|
| + <div class="content">
|
| + <content select=".toast-content" />
|
| + </div>
|
| +</template>
|
| +<script>
|
| +SkyElement({
|
| + name: "app-toast"
|
| +});
|
| +</script>
|
|
|