Browse Source

update the boutons design in header*

AlexiCauvin 6 years ago
parent
commit
87a62ad6ab

+ 1 - 1
src/component/Header/MenuActionListItem/DropdownLang.jsx View File

8
       <div className='header__menu__rightside__itemlanguage__languagedropdown dropdown'>
8
       <div className='header__menu__rightside__itemlanguage__languagedropdown dropdown'>
9
         <button
9
         <button
10
           type='button'
10
           type='button'
11
-          className='languagedropdown__btnlanguage btnnavbar btn btn-secondary dropdown-toggle'
11
+          className='languagedropdown__btnlanguage btnnavbar btn btn-outline-primary dropdown-toggle'
12
           id='headerDropdownMenuButton'
12
           id='headerDropdownMenuButton'
13
           data-toggle='dropdown'
13
           data-toggle='dropdown'
14
           aria-haspopup='true'
14
           aria-haspopup='true'

+ 1 - 1
src/component/Header/MenuActionListItem/Help.jsx View File

6
     <li className='header__menu__rightside__itemquestion'>
6
     <li className='header__menu__rightside__itemquestion'>
7
       <button
7
       <button
8
         type='button'
8
         type='button'
9
-        className='header__menu__rightside__itemquestion__btnquestion btnnavbar btn btn-primary'
9
+        className='header__menu__rightside__itemquestion__btnquestion btnnavbar btn btn-outline-primary'
10
         onClick={props.onClickHelp}
10
         onClick={props.onClickHelp}
11
       >
11
       >
12
         <i className='btnquestion__icon fa fa-question' />
12
         <i className='btnquestion__icon fa fa-question' />

+ 1 - 1
src/component/Header/MenuActionListItem/MenuProfil.jsx View File

8
     ? (
8
     ? (
9
       <li className='header__menu__rightside__itemprofil'>
9
       <li className='header__menu__rightside__itemprofil'>
10
         <div className='profilgroup dropdown'>
10
         <div className='profilgroup dropdown'>
11
-          <button className='profilgroup__name btn btn-secondary dropdown-toggle' type='button' id='dropdownMenuButton' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false'>
11
+          <button className='profilgroup__name btn btn-outline-primary dropdown-toggle' type='button' id='dropdownMenuButton' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false'>
12
             <img className='profilgroup__name__imgprofil' src={props.user.avatar_url} />
12
             <img className='profilgroup__name__imgprofil' src={props.user.avatar_url} />
13
             <div className='profilgroup__name__text'>
13
             <div className='profilgroup__name__text'>
14
               {props.user.name}
14
               {props.user.name}

+ 1 - 1
src/component/Header/MenuActionListItem/Notification.jsx View File

7
       <div className='header__menu__rightside__itemnotification__timeline dropdown'>
7
       <div className='header__menu__rightside__itemnotification__timeline dropdown'>
8
         <button
8
         <button
9
           type='button'
9
           type='button'
10
-          className='timeline__btnnotif btnnavbar btn btn-secondary dropdown-toggle'
10
+          className='timeline__btnnotif btnnavbar btn btn-outline-primary dropdown-toggle'
11
           id='headerNotificationBtn'
11
           id='headerNotificationBtn'
12
           data-toggle='dropdown'
12
           data-toggle='dropdown'
13
           aria-haspopup='true'
13
           aria-haspopup='true'

+ 13 - 5
src/css/Generic.styl View File

16
   &:hover, &:focus, &:active, &:visited, &:focus-within
16
   &:hover, &:focus, &:active, &:visited, &:focus-within
17
     background-color hover-button
17
     background-color hover-button
18
     border-color hover-button
18
     border-color hover-button
19
-    box-shadow 0 0 1px 2px secondColor
19
+    box-shadow none
20
+    outline none
20
 
21
 
21
 .btn-outline-primary
22
 .btn-outline-primary
22
   color fontColor
23
   color fontColor
25
   &:hover, &:focus, &:active, &:visited, &:focus-within
26
   &:hover, &:focus, &:active, &:visited, &:focus-within
26
     background-color hover-button
27
     background-color hover-button
27
     border-color hover-button
28
     border-color hover-button
28
-    box-shadow 0 0 1px 2px secondColor
29
+    box-shadow none
30
+    outline none
29
 
31
 
30
 .btn-primary.active, .btn-primary:active, .show>.btn-primary.dropdown-toggle
32
 .btn-primary.active, .btn-primary:active, .show>.btn-primary.dropdown-toggle
31
   background-color hover-button
33
   background-color hover-button
32
   border-color hover-button
34
   border-color hover-button
33
-  box-shadow 0 0 1px 2px secondColor
35
+  box-shadow none
34
 
36
 
35
 .btn-outline-primary.active, .btn-outline-primary:active, .show>.btn-outline-primary.dropdown-toggle
37
 .btn-outline-primary.active, .btn-outline-primary:active, .show>.btn-outline-primary.dropdown-toggle
36
   background-color hover-button
38
   background-color hover-button
37
   border-color hover-button
39
   border-color hover-button
38
-  box-shadow 0 0 1px 2px secondColor
40
+  box-shadow none
41
+  outline none
39
 
42
 
40
 .dropdown-item
43
 .dropdown-item
41
-  &:hover, &:focus, &:visited, &:focus-within
44
+  &:hover, &:focus
42
     background-color thirdColor
45
     background-color thirdColor
43
     color off-white
46
     color off-white
47
+    box-shadow none
48
+    outline none
49
+
50
+.btn.disabled, .btn:disabled
51
+  cursor not-allowed
44
 
52
 
45
 .sidebarpagecontainer
53
 .sidebarpagecontainer
46
   display flex
54
   display flex

+ 1 - 6
src/css/Header.styl View File

75
             padding 0 5px
75
             padding 0 5px
76
             background-color transparent
76
             background-color transparent
77
             cursor pointer
77
             cursor pointer
78
-            &:hover
79
-              background-color lightGrey
80
-            &:focus
81
-              box-shadow shadow-all-side-blue
82
-              background-color lightGrey
83
             &::after //bootstrap overrides
78
             &::after //bootstrap overrides
84
               vertical-align middle
79
               vertical-align middle
85
               color darkGrey
80
               color darkGrey
105
             cursor pointer
100
             cursor pointer
106
             .setting__link
101
             .setting__link
107
               padding 10px
102
               padding 10px
108
-              color fontColor
103
+          //     // color fontColor
109
       &__itemnotification
104
       &__itemnotification
110
         &__timeline
105
         &__timeline
111
           margin-right 30px
106
           margin-right 30px