Pārlūkot izejas kodu

[https://github.com/tracim/tracim/issues/809] added lang label on dropdown + moved specific css of dropdownlang into specific file

Skylsmoi 6 gadus atpakaļ
vecāks
revīzija
95121a805a

+ 5 - 2
frontend/src/component/Header/MenuActionListItem/DropdownLang.jsx Parādīt failu

@@ -1,6 +1,8 @@
1 1
 import React from 'react'
2 2
 import PropTypes from 'prop-types'
3 3
 
4
+require('./DropdownLang.styl')
5
+
4 6
 const DropdownLang = props => {
5 7
   return (
6 8
     <li className='header__menu__rightside__itemlanguage'>
@@ -16,9 +18,10 @@ const DropdownLang = props => {
16 18
           <img className='languagedropdown__btnlanguage__imgselected' src={props.langList.find(l => l.id === props.idLangActive).icon} />
17 19
         </button>
18 20
         <div className='languagedropdown__subdropdown dropdown-menu' aria-labelledby='headerDropdownMenuButton'>
19
-          { props.langList.filter(l => l.id !== props.idLangActive).map((l, i) =>
20
-            <div className='subdropdown__link dropdown-item' onClick={() => props.onChangeLang(l.id)} key={i}>
21
+          { props.langList.filter(l => l.id !== props.idLangActive).map(l =>
22
+            <div className='subdropdown__link dropdown-item' onClick={() => props.onChangeLang(l.id)} key={l.id}>
21 23
               <img className='subdropdown__flag' src={l.icon} />
24
+              { l.label }
22 25
             </div>
23 26
           )}
24 27
         </div>

+ 25 - 0
frontend/src/component/Header/MenuActionListItem/DropdownLang.styl Parādīt failu

@@ -0,0 +1,25 @@
1
+@import "../../../../node_modules/tracim_frontend_lib/src/css/Variable.styl"
2
+
3
+.languagedropdown
4
+  &__btnlanguage
5
+    margin-right 25px
6
+    color darkGrey
7
+    &:focus
8
+      box-shadow shadow-all-side-blue
9
+      border-radius 5px
10
+      background-color transparent
11
+    &__imgselected
12
+      margin-right 10px
13
+      width 20px
14
+      height 15px
15
+  &__subdropdown
16
+    padding 0
17
+    min-width 0
18
+    .subdropdown
19
+      &__link
20
+        cursor pointer
21
+      &__flag
22
+        width 25px
23
+        height 18px
24
+        vertical-align text-top
25
+        margin-right 5px

+ 0 - 23
frontend/src/css/Header.styl Parādīt failu

@@ -50,29 +50,6 @@
50 50
         border 1px solid grey
51 51
         background-color transparent
52 52
         cursor pointer
53
-      &__itemlanguage
54
-        &__languagedropdown
55
-          .languagedropdown
56
-            &__btnlanguage
57
-              margin-right 25px
58
-              color darkGrey
59
-              &:focus
60
-                box-shadow shadow-all-side-blue
61
-                border-radius 5px
62
-                background-color transparent
63
-              &__imgselected
64
-                margin-right 10px
65
-                width 20px
66
-                height 15px
67
-            &__subdropdown
68
-              padding 0
69
-              min-width 0
70
-              .subdropdown
71
-                &__link
72
-                  cursor pointer
73
-                &__flag
74
-                  width 25px
75
-                  height 18px
76 53
       &__itemquestion
77 54
         display none
78 55
         &__btnquestion

+ 2 - 0
frontend/src/reducer/lang.js Parādīt failu

@@ -4,9 +4,11 @@ import flagFr from '../img/flag_fr.png'
4 4
 
5 5
 const defaultLang = [{
6 6
   id: 'en',
7
+  label: 'English',
7 8
   icon: flagEn
8 9
 }, {
9 10
   id: 'fr',
11
+  label: 'Français',
10 12
   icon: flagFr
11 13
 }]
12 14