Browse Source

added proper color management

Skylsmoi 6 years ago
parent
commit
0d4a7ff24f
4 changed files with 28 additions and 58 deletions
  1. 2 0
      src/container/PopupCreateThread.jsx
  2. 22 6
      src/container/Thread.jsx
  3. 3 51
      src/css/index.styl
  4. 1 1
      src/helper.js

+ 2 - 0
src/container/PopupCreateThread.jsx View File

65
         if (resSave.apiResponse.status === 200) {
65
         if (resSave.apiResponse.status === 200) {
66
           this.handleClose()
66
           this.handleClose()
67
 
67
 
68
+          GLOBAL_dispatchEvent({ type: 'refreshContentList', data: {} })
69
+
68
           GLOBAL_dispatchEvent({
70
           GLOBAL_dispatchEvent({
69
             type: 'openContentUrl', // handled by tracim_front:src/container/WorkspaceContent.jsx
71
             type: 'openContentUrl', // handled by tracim_front:src/container/WorkspaceContent.jsx
70
             data: {
72
             data: {

+ 22 - 6
src/container/Thread.jsx View File

110
 
110
 
111
     handleFetchResult(await fetchResultSaveThread)
111
     handleFetchResult(await fetchResultSaveThread)
112
       .then(resSave => {
112
       .then(resSave => {
113
-        if (resSave.apiResponse.status === 200) this.loadContent()
114
-        else console.warn('Error saving threads. Result:', resSave, 'content:', content, 'config:', config)
113
+        if (resSave.apiResponse.status === 200) {
114
+          this.loadContent()
115
+          GLOBAL_dispatchEvent({ type: 'refreshContentList', data: {} })
116
+        } else {
117
+          console.warn('Error saving threads. Result:', resSave, 'content:', content, 'config:', config)
118
+        }
115
       })
119
       })
116
   }
120
   }
117
 
121
 
164
     if (!isVisible) return null
168
     if (!isVisible) return null
165
 
169
 
166
     return (
170
     return (
167
-      <PopinFixed customClass={`wsContentThread`}>
171
+      <PopinFixed
172
+        customClass={config.slug}
173
+        customColor={config.hexcolor}
174
+      >
168
         <PopinFixedHeader
175
         <PopinFixedHeader
169
-          customClass={`wsContentThread`}
176
+          customClass={`${config.slug}__contentpage`}
177
+          customColor={config.hexcolor}
170
           faIcon={config.faIcon}
178
           faIcon={config.faIcon}
171
           title={content.label}
179
           title={content.label}
172
           onClickCloseBtn={this.handleClickBtnCloseApp}
180
           onClickCloseBtn={this.handleClickBtnCloseApp}
173
           onValidateChangeTitle={this.handleSaveEditTitle}
181
           onValidateChangeTitle={this.handleSaveEditTitle}
174
         />
182
         />
175
 
183
 
176
-        <PopinFixedOption customClass={`wsContentThread`} i18n={i18n}>
184
+        <PopinFixedOption
185
+          customClass={`${config.slug}__contentpage`}
186
+          customColor={config.hexcolor}
187
+          i18n={i18n}
188
+        >
177
           <div className='justify-content-end'>
189
           <div className='justify-content-end'>
178
             <SelectStatus
190
             <SelectStatus
179
               selectedStatus={config.availableStatuses.find(s => s.slug === content.status)}
191
               selectedStatus={config.availableStatuses.find(s => s.slug === content.status)}
183
             />
195
             />
184
 
196
 
185
             <ArchiveDeleteContent
197
             <ArchiveDeleteContent
198
+              customColor={config.hexcolor}
186
               onClickArchiveBtn={this.handleClickArchive}
199
               onClickArchiveBtn={this.handleClickArchive}
187
               onClickDeleteBtn={this.handleClickDelete}
200
               onClickDeleteBtn={this.handleClickDelete}
188
               disabled={false}
201
               disabled={false}
190
           </div>
203
           </div>
191
         </PopinFixedOption>
204
         </PopinFixedOption>
192
 
205
 
193
-        <PopinFixedContent customClass={`${config.customClass}__contentpage`}>
206
+        <PopinFixedContent
207
+          customClass={`${config.slug}__contentpage`}
208
+        >
194
           <Timeline
209
           <Timeline
195
             customClass={`${config.slug}__contentpage`}
210
             customClass={`${config.slug}__contentpage`}
211
+            customColor={config.hexcolor}
196
             loggedUser={loggedUser}
212
             loggedUser={loggedUser}
197
             timelineData={listMessage}
213
             timelineData={listMessage}
198
             newComment={newComment}
214
             newComment={newComment}

+ 3 - 51
src/css/index.styl View File

1
 @import "../../node_modules/tracim_lib/src/css/Variable.styl"
1
 @import "../../node_modules/tracim_lib/src/css/Variable.styl"
2
 
2
 
3
-btnState()
4
-  background-color darkenThread
5
-  color off-white
6
-
7
-.wsContentThread
3
+.thread
8
   width 1100px
4
   width 1100px
9
   &__header
5
   &__header
10
-    // color white
11
-    background-color threadColor
12
     &__editionmode
6
     &__editionmode
13
       display none
7
       display none
14
     &__icon
8
     &__icon
16
         color white
10
         color white
17
   .selectStatus
11
   .selectStatus
18
     margin-right 15px
12
     margin-right 15px
19
-    .dropdown-item
20
-      &:hover, &:focus, &:active, &visited, &:focus-within
21
-        background-color threadColor
22
-        color off-white!important // @FIXME 04/07/2018 AC - we must use a plugin for this
23
-  .optionicon
24
-    &:hover, &:focus, &:active
25
-      color threadColor
26
   .timeline
13
   .timeline
27
     margin 0
14
     margin 0
28
   .thread
15
   .thread
29
     &__contentpage
16
     &__contentpage
17
+      &__content
18
+        width 100%
30
       &__messagelist
19
       &__messagelist
31
         &__item__avatar
20
         &__item__avatar
32
           border 1px solid darkenThread
21
           border 1px solid darkenThread
33
           background-color off-white
22
           background-color off-white
34
       &__texteditor
23
       &__texteditor
35
         flex 0 0 auto
24
         flex 0 0 auto
36
-        &__advancedtext
37
-          &__btn
38
-            color fontColor
39
-            border-color threadColor
40
-            cursor pointer
41
-            &:hover ,&:focus, &:visited, &:active
42
-              btnState()
43
-              border-color darkenThread
44
-              box-shadow none
45
-        &__submit
46
-          &__btn
47
-            background-color threadColor
48
-            color white
49
-            &:hover, &:focus, &:visited, &:active
50
-              background-color darkenThread
51
-
52
-
53
-.received
54
-  .timeline__messagelist__item__content
55
-    background-color threadColor
56
-
57
-.popupCreateContent
58
-  .cardPopup
59
-    &__header
60
-      background-color threadColor
61
-  .createcontent
62
-    &__contentname
63
-      color threadColor
64
-    &__form
65
-      &__button
66
-        & > button
67
-          border-color threadColor
68
-          background-color threadColor
69
-          &:hover, &:active, &:visited &:focus
70
-            background-color darkenThread
71
-            box-shadow none
72
-
73
 
25
 
74
 @media (min-width: min-lg) and (max-width: max-lg)
26
 @media (min-width: min-lg) and (max-width: max-lg)
75
   .wsContentThread
27
   .wsContentThread

+ 1 - 1
src/helper.js View File

10
     label: 'Thread',
10
     label: 'Thread',
11
     slug: 'thread',
11
     slug: 'thread',
12
     faIcon: 'comments-o',
12
     faIcon: 'comments-o',
13
-    hexcolor: '#65c7f2',
13
+    hexcolor: '#ad4cf9',
14
     creationLabel: 'Write a thread',
14
     creationLabel: 'Write a thread',
15
     domContainer: 'appContainer',
15
     domContainer: 'appContainer',
16
     apiUrl: 'http://localhost:6543/api/v2',
16
     apiUrl: 'http://localhost:6543/api/v2',