Browse Source

change the description in sidebar + add edit mode on this description in the File page

AlexiCauvin 7 years ago
parent
commit
8656999dd7
2 changed files with 44 additions and 29 deletions
  1. 11 23
      src/component/Workspace/FileType/File.jsx
  2. 33 6
      src/css/File.styl

+ 11 - 23
src/component/Workspace/FileType/File.jsx View File

49
           </div>
49
           </div>
50
           <div className='wsFileFile__contentpage__preview__sidebar__property'>
50
           <div className='wsFileFile__contentpage__preview__sidebar__property'>
51
             <div className='wsFileFile__contentpage__preview__sidebar__property__detail'>
51
             <div className='wsFileFile__contentpage__preview__sidebar__property__detail'>
52
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__label'>
53
-                  Fichier :
52
+              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__size'>
53
+                Taille : 500Ko
54
               </div>
54
               </div>
55
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__info'>
56
-                  Planning Intégration de Tracim
57
-              </div>
58
-
59
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__label'>
55
+              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__description'>
56
+                <label>
60
                   Description :
57
                   Description :
58
+                </label>
59
+                <form className='wsFileFile__contentpage__preview__sidebar__property__detail__description__editiondesc'>
60
+                  <textarea />
61
+                  <input type='submit' className='wsFileFile__contentpage__preview__sidebar__property__detail__description__editiondesc__validate form-control' />
62
+                </form>
61
               </div>
63
               </div>
62
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__info'>
63
-                  Fichier excel et pdf du planning
64
-              </div>
65
-
66
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__label'>
67
-                  Taille :
68
-              </div>
69
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__info'>
70
-                  500ko
71
-              </div>
72
-
73
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__label'>
74
-                  Equipe :
75
-              </div>
76
-              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__info'>
77
-                  Bastien, Côme, Damien, Philippe.
64
+              <div className='wsFileFile__contentpage__preview__sidebar__property__detail__btndesc btn btn-primary'>
65
+                Changer la Description
78
               </div>
66
               </div>
79
             </div>
67
             </div>
80
           </div>
68
           </div>

+ 33 - 6
src/css/File.styl View File

3
   height calc(100% - 85px)
3
   height calc(100% - 85px)
4
   &__header
4
   &__header
5
     background-color fileColor
5
     background-color fileColor
6
+    &__editionmode
7
+      display none
6
     .fa-file-image-o
8
     .fa-file-image-o
7
       color white
9
       color white
8
   &__option
10
   &__option
63
           &__detail
65
           &__detail
64
             padding 20px
66
             padding 20px
65
             width 410px
67
             width 410px
66
-            &__label
67
-              font-size 18px
68
-              text-decoration underline
69
-            &__info
70
-              margin 10px 0 25px 0
68
+            &__size
69
+              margin-bottom 20px
70
+            &__description
71
+              &__editiondesc
72
+                display none
73
+                margin 20px 0
74
+                textarea
75
+                  width 100%
76
+                  height 250px
77
+                &__validate
78
+                  margin 30px auto
79
+                  width 150px
80
+            &__btndesc
81
+              display block
82
+              margin 15px 0
83
+              width 200px
71
       &__dloption
84
       &__dloption
72
         display flex
85
         display flex
73
         justify-content center
86
         justify-content center
77
           font-size 20px
90
           font-size 20px
78
           cursor pointer
91
           cursor pointer
79
           &:hover , &:focus
92
           &:hover , &:focus
80
-            font-size 25px
81
             color fileColor
93
             color fileColor
82
       &__slider
94
       &__slider
83
         display flex
95
         display flex
144
         overflow-Y auto
156
         overflow-Y auto
145
         color fileColor
157
         color fileColor
146
 
158
 
159
+.activeEditionTitle
160
+  .wsFileFile__header
161
+    &__editionmode
162
+      display block
163
+    &__title
164
+      display none
165
+
166
+.activeEditionDesc
167
+  .wsFileFile__contentpage__preview__sidebar__property__detail
168
+    &__description
169
+      &__editiondesc
170
+        display block
171
+    &__btndesc
172
+      display none
173
+
147
 /****** MEDIA QUERIES ********/
174
 /****** MEDIA QUERIES ********/
148
 
175
 
149
 // Regroup the common css rules mediaqueries into a single media to lighten the code
176
 // Regroup the common css rules mediaqueries into a single media to lighten the code