<template>
  <!--
        Flex 1 1
        This is a fluid layout that displays 2 colums in 1:1 ratio.
        The content slots will be displayed in flex:1o
    -->
  <b-container class="c-layout-flex-1-1 d-flex" fluid no-gutters="true">
    <slot name="left" />
    <slot name="right" />
  </b-container>
</template>
<script>
export default {
  name: 'Flex11',
}
</script>
<style scoped>
.c-layout-flex-1-1 > * {
  flex: 1;
  position: relative;
  flex-direction: column;
}

.c-layout-flex-1-1 > * > * {
  flex-direction: row;
}
</style>
