<script>
 import {
     Col,
     Container,
     Row,
 } from 'sveltestrap';

 import ExerciceHeader from '$lib/components/ExerciceHeader.svelte';
 import QAItems from '$lib/components/QAItems.svelte';

 export let theme = null;
 export let exercice = {};
 export let qaitems = null;
 export let query_selected = null;
</script>

<ExerciceHeader
    {exercice}
    {query_selected}
    {theme}
/>
<Container fluid class="flex-fill d-flex">
    <Row class="flex-fill">
        <Col md={3} class="px-0 py-2" style="background: #e7e8e9">
        {#key countCreation}
            <QAItems
                {exercice}
                queries={qaitems}
                {query_selected}
                {theme}
            />
        {/key}
        </Col>
        <Col md={9} class="d-flex flex-column py-2">
        <slot></slot>
        </Col>
    </Row>
</Container>
