@eturnity/eturnity_reusable_components 7.6.1 → 7.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
package/src/assets/theme.js
CHANGED
|
@@ -7,7 +7,11 @@
|
|
|
7
7
|
@click="fetchPage(paginationParams.previous)"
|
|
8
8
|
>
|
|
9
9
|
<arrowIconContainer>
|
|
10
|
-
<icon
|
|
10
|
+
<icon
|
|
11
|
+
name="arrow_left"
|
|
12
|
+
:color="getTheme.colors.brightBlue"
|
|
13
|
+
size="12px"
|
|
14
|
+
/>
|
|
11
15
|
</arrowIconContainer>
|
|
12
16
|
<arrowText>{{ $gettext('back') }}</arrowText>
|
|
13
17
|
</paginationLink>
|
|
@@ -55,7 +59,11 @@
|
|
|
55
59
|
>
|
|
56
60
|
<arrowText>{{ $gettext('forward') }}</arrowText>
|
|
57
61
|
<arrowIconContainer>
|
|
58
|
-
<icon
|
|
62
|
+
<icon
|
|
63
|
+
name="arrow_right"
|
|
64
|
+
:color="getTheme.colors.brightBlue"
|
|
65
|
+
size="12px"
|
|
66
|
+
/>
|
|
59
67
|
</arrowIconContainer>
|
|
60
68
|
</paginationLink>
|
|
61
69
|
</paginationWrapper>
|
|
@@ -64,8 +72,10 @@
|
|
|
64
72
|
<script>
|
|
65
73
|
import styled from 'vue-styled-components'
|
|
66
74
|
import icon from '../icon'
|
|
75
|
+
import theme from '@/assets/theme.js'
|
|
76
|
+
|
|
67
77
|
const paginationWrapper = styled.nav`
|
|
68
|
-
color:
|
|
78
|
+
color: ${(props) => props.theme.brightBlue};
|
|
69
79
|
font-size: 13px;
|
|
70
80
|
display: flex;
|
|
71
81
|
flex-wrap: wrap;
|
|
@@ -85,7 +95,7 @@ const paginationLink = styled.div`
|
|
|
85
95
|
|
|
86
96
|
&.active {
|
|
87
97
|
color: #fff;
|
|
88
|
-
background-color:
|
|
98
|
+
background-color: ${(props) => props.theme.brightBlue};
|
|
89
99
|
padding: 7px 12px;
|
|
90
100
|
border-radius: 4px;
|
|
91
101
|
}
|
|
@@ -106,6 +116,11 @@ export default {
|
|
|
106
116
|
arrowIconContainer
|
|
107
117
|
},
|
|
108
118
|
props: ['fetchPage', 'currentPage', 'paginationParams'],
|
|
119
|
+
computed: {
|
|
120
|
+
getTheme() {
|
|
121
|
+
return theme
|
|
122
|
+
}
|
|
123
|
+
},
|
|
109
124
|
methods: {
|
|
110
125
|
getNewProjects(num) {
|
|
111
126
|
this.$emit('on-pagination-change', num)
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
ref="tableRef"
|
|
11
11
|
:isPositionAbsolute="doesTableContainDraggables"
|
|
12
12
|
>
|
|
13
|
-
<table-wrapper :fullWidth="fullWidth">
|
|
13
|
+
<table-wrapper class="main-table-wrapper" :fullWidth="fullWidth">
|
|
14
14
|
<spinner-wrapper v-if="isLoading">
|
|
15
15
|
<spinner />
|
|
16
16
|
</spinner-wrapper>
|
|
@@ -72,7 +72,7 @@ const TableWrapper = styled('div', wrapperAttrs)`
|
|
|
72
72
|
overflow-y: hidden;
|
|
73
73
|
|
|
74
74
|
::-webkit-scrollbar {
|
|
75
|
-
height:
|
|
75
|
+
height: 10px; //height of the whole scrollbar area
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
::-webkit-scrollbar-track {
|
|
@@ -81,7 +81,7 @@ const TableWrapper = styled('div', wrapperAttrs)`
|
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
::-webkit-scrollbar-thumb {
|
|
84
|
-
border-bottom:
|
|
84
|
+
border-bottom: 10px solid ${(props) => props.theme.colors.brightBlue}; // width of the actual scrollbar
|
|
85
85
|
border-radius: 4px;
|
|
86
86
|
}
|
|
87
87
|
`
|