annotate client/src/components/ui/UIBoxHeader.vue @ 2462:9ae2a2f758bb

client: make use of new table header/body components
author Markus Kottlaender <markus@intevation.de>
date Mon, 04 Mar 2019 14:50:23 +0100
parents 02d30251d594
children 9bf6b767a56a
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2408
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 <template>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
2 <h6 class="box-header">
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
3 <span class="box-title">
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
4 <font-awesome-icon
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
5 :icon="icon"
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
6 class="box-icon"
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
7 v-if="icon"
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
8 fixed-width
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
9 />
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
10 {{ $gettext(title) }}
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
11 </span>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
12 <span class="box-close" @click="closeCallback" v-if="closeCallback">
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
13 <font-awesome-icon icon="times" />
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
14 </span>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
15 </h6>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
16 </template>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
17
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
18 <style lang="sass">
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
19 .box-header
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
20 display: flex
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
21 justify-content: space-between
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
22 align-items: center
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 min-height: 35px
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24 padding-left: .5rem
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
25 border-bottom: 1px solid #dee2e6
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
26 color: $color-info
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
27 margin-bottom: 0
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
28 padding: 0.25rem
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
29 font-weight: bold
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
30 .box-title
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
31 padding-left: 0.25rem
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
32 .box-icon
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
33 margin-right: 0.25rem
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
34 .box-close
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
35 color: #888
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 padding: 3px 7px
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
37 border-radius: 0.25rem
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 cursor: pointer
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 transition: background-color 0.3s, color 0.3s
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
40 &:hover
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
41 color: #666
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
42 background-color: #eee
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
43 </style>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
44
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
45 <script>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
46 /* This is Free Software under GNU Affero General Public License v >= 3.0
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
47 * without warranty, see README.md and license for details.
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
48 *
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
49 * SPDX-License-Identifier: AGPL-3.0-or-later
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
50 * License-Filename: LICENSES/AGPL-3.0.txt
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
51 *
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
52 * Copyright (C) 2018 by via donau
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
53 * – Österreichische Wasserstraßen-Gesellschaft mbH
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
54 * Software engineering by Intevation GmbH
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
55 *
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
56 * Author(s):
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
57 * Markus Kottländer <markus.kottlaender@intevation.de>
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
58 */
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
59
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
60 export default {
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
61 props: ["icon", "title", "closeCallback"]
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
62 };
02d30251d594 client: table component for unified style
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
63 </script>