aboutsummaryrefslogtreecommitdiff
path: root/src_frontend/layout/Desktop.svelte
blob: e90a4a27b559b6b1444117dafe0eb54a4b6c7ca4 (plain) (blame)
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
<script>
    import ControlComponents from "../Components/MainControls/ControlComponents.svelte";
    import MainMenu from "../Components/MainMenu.svelte";
    import NotifsWrapper from "../Components/Notifs/NotifsWrapper.svelte";
</script>

<style>
    .controls {
        background-color: white;
        position: fixed;
        width: 300px;
        padding: 15px;
        left: 50px;
        top: 50px;
        bottom: 50px;

        overflow: auto;
        border-radius: 15px;
        max-height: 500px;
    }

    @media (min-height: 600px) {
        .controls {
            height: 500px;
            top: 50%;
            transform: translateY(-50%);
        }
    }

    .content {
        margin-left: 400px;
        height: 100%;
        overflow: auto;
        margin-top: 35px;
        margin-bottom: 15px;
        margin-right: 185px;
        padding: 15px;
    }
</style>

<NotifsWrapper />
<div>
    <MainMenu />
    <div class="controls drop-shadow"><ControlComponents /></div>
    <div class="content">
        <slot></slot>
    </div>
</div>