Popup hotfix
This commit is contained in:
@@ -2,12 +2,12 @@
|
|||||||
import { getContext } from 'svelte';
|
import { getContext } from 'svelte';
|
||||||
import Popup from './Popup.svelte';
|
import Popup from './Popup.svelte';
|
||||||
const { open } = getContext('simple-modal');
|
const { open } = getContext('simple-modal');
|
||||||
const showSurprise = () => open(Popup, { message: "heh" });
|
const showSurprise = () => open(Popup, { message: "It's aff modal!" });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="logout" role="button"
|
<div id="logout" role="button"
|
||||||
tabindex="0"
|
tabindex="0"
|
||||||
on:click={showSurprise()}
|
on:click={showSurprise}
|
||||||
on:keydown={() => console.log("keydown")}>
|
on:keydown={() => console.log("keydown")}>
|
||||||
+
|
Log out
|
||||||
</div>
|
</div>
|
||||||
@@ -2,7 +2,9 @@
|
|||||||
import { onMount, afterUpdate } from 'svelte';
|
import { onMount, afterUpdate } from 'svelte';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { getCookie } from "svelte-cookie";
|
import { getCookie } from "svelte-cookie";
|
||||||
|
|
||||||
import Modal from 'svelte-simple-modal';
|
import Modal from 'svelte-simple-modal';
|
||||||
|
import Content from "./Content.svelte";
|
||||||
|
|
||||||
let data = [];
|
let data = [];
|
||||||
let parentHeight;
|
let parentHeight;
|
||||||
@@ -31,7 +33,11 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="expenseInfo" style="max-height: {parentHeight}px;">
|
<div id="expenseInfo" style="max-height: {parentHeight}px;">
|
||||||
<h2 id="text">Expenses</h2>
|
<div id="options">
|
||||||
|
<h2>Incomes</h2>
|
||||||
|
<Modal><Content /></Modal>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="expenseList">
|
<div id="expenseList">
|
||||||
<ul>
|
<ul>
|
||||||
{#each data as item}
|
{#each data as item}
|
||||||
@@ -46,10 +52,6 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
#text {
|
|
||||||
padding: 0 0 10px;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#expenseInfo {
|
#expenseInfo {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@@ -59,11 +61,12 @@
|
|||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
#options {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: 0;
|
top: 0;
|
||||||
background-color: #f2f2f2;
|
background-color: #f2f2f2;
|
||||||
padding: 10px;
|
padding: 0 0 10px;
|
||||||
|
margin: 0;
|
||||||
border-radius: 10px 10px 0 0;
|
border-radius: 10px 10px 0 0;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -38,6 +38,7 @@
|
|||||||
<Modal><Content /></Modal>
|
<Modal><Content /></Modal>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div id="incomeList">
|
<div id="incomeList">
|
||||||
<ul>
|
<ul>
|
||||||
{#each data as item}
|
{#each data as item}
|
||||||
@@ -53,7 +54,7 @@
|
|||||||
|
|
||||||
<style>
|
<style>
|
||||||
#incomeOptions {
|
#incomeOptions {
|
||||||
position: sticky;
|
|
||||||
top: 0;
|
top: 0;
|
||||||
background-color: #f2f2f2;
|
background-color: #f2f2f2;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
<script>
|
<script>
|
||||||
|
export let message = 'Hi';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div>
|
<p>🎉 {message} 🍾</p>
|
||||||
LOL
|
|
||||||
</div>
|
|
||||||
Reference in New Issue
Block a user