vue-cli/packages/@vue/cli-ui/src/components/content/ContentView.vue at dev · vuejs/vue-cli · GitHub

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<template>
  <div class="content-view">
    <portal v-if="title" to="top-title">{{ title }}</portal>
    <portal to="top-actions">
      <slot name="actions"/>
    </portal>

    <div class="content">
      <div class="wrapper">
        <slot/>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: null
    }
  }
}
</script>

<style lang="stylus" scoped>
.content-view
  height 100%

  .content,
  .wrapper
    width 100%
    height 100%
    box-sizing border-box

  .content
    background $content-bg-secondary-light
    .vue-ui-dark-mode &
      background $content-bg-secondary-dark
    .wrapper
      background $content-bg-primary-light
      position relative
      overflow-x hidden
      overflow-y auto
      .vue-ui-dark-mode &
        background $content-bg-primary-dark

  &.list
    .wrapper
      background $content-bg-list-light
      .vue-ui-dark-mode &
        background $content-bg-list-dark

  &.limit-width
    .wrapper
      @media (min-width 1420px)
        max-width 1200px
        margin auto
        $br2 = ($br * 2)
        border-radius $br2 $br2 0 0
</style>