瀏覽代碼

change the className='wrapper' in to className='container'

AlexiCauvin 7 年之前
父節點
當前提交
3377106a91
共有 3 個文件被更改,包括 37 次插入36 次删除
  1. 8 8
      src/container/FlashMessage.jsx
  2. 1 0
      src/container/Tracim.jsx
  3. 28 28
      src/css/FlashMessage.styl

+ 8 - 8
src/container/FlashMessage.jsx 查看文件

4
   render() {
4
   render() {
5
     return(
5
     return(
6
       <div className='flashmessage'>
6
       <div className='flashmessage'>
7
-        <div className='flashmessage__wrapper card'>
8
-          <div className='flashmessage__header' />
7
+        <div className='flashmessage__container card'>
8
+          <div className='flashmessage__container__header' />
9
 
9
 
10
           <div className='card-body nopadding'>
10
           <div className='card-body nopadding'>
11
 
11
 
12
-            <div className='flashmessage__close'>
12
+            <div className='flashmessage__container__close'>
13
               <i className='fa fa-times' />
13
               <i className='fa fa-times' />
14
             </div>
14
             </div>
15
 
15
 
16
-            <div className='flashmessage__content'>
17
-              <div className='flashmessage__content__icon'>
16
+            <div className='flashmessage__container__content'>
17
+              <div className='flashmessage__container__content__icon'>
18
                 <i className='fa fa-times-circle' />
18
                 <i className='fa fa-times-circle' />
19
               </div>
19
               </div>
20
 
20
 
21
-              <div className='flashmessage__content__text'>
22
-                <div className='flashmessage__content__text__title'>
21
+              <div className='flashmessage__container__content__text'>
22
+                <div className='flashmessage__container__content__text__title'>
23
                   Sorry !
23
                   Sorry !
24
                 </div>
24
                 </div>
25
-                <div className='flashmessage__content__text__paragraph'>
25
+                <div className='flashmessage__container__content__text__paragraph'>
26
                   Reprehenderit reprehenderit veniam dolore velit dolor velit in occaecat dolor veniam nisi officia velit consequat amet cupidatat.
26
                   Reprehenderit reprehenderit veniam dolore velit dolor velit in occaecat dolor veniam nisi officia velit consequat amet cupidatat.
27
                   Reprehenderit reprehenderit veniam dolore velit dolor velit in occaecat dolor veniam nisi officia velit consequat amet cupidatat.
27
                   Reprehenderit reprehenderit veniam dolore velit dolor velit in occaecat dolor veniam nisi officia velit consequat amet cupidatat.
28
                 </div>
28
                 </div>

+ 1 - 0
src/container/Tracim.jsx 查看文件

6
 import Login from './Login.jsx'
6
 import Login from './Login.jsx'
7
 import Dashboard from './Dashboard.jsx'
7
 import Dashboard from './Dashboard.jsx'
8
 import AccountPage from './AccountPage.jsx'
8
 import AccountPage from './AccountPage.jsx'
9
+import FlashMessage from './FlashMessage.jsx'
9
 import WorkspaceContent from './WorkspaceContent.jsx'
10
 import WorkspaceContent from './WorkspaceContent.jsx'
10
 import {
11
 import {
11
   Route,
12
   Route,

+ 28 - 28
src/css/FlashMessage.styl 查看文件

4
   justify-content center
4
   justify-content center
5
   width 100%
5
   width 100%
6
   z-index 3
6
   z-index 3
7
-  &__wrapper
7
+  &__container
8
     margin-top 120px
8
     margin-top 120px
9
     border 0
9
     border 0
10
     border-radius 10px
10
     border-radius 10px
11
     width 800px
11
     width 800px
12
     background lightGrey
12
     background lightGrey
13
     box-shadow shadow-all
13
     box-shadow shadow-all
14
-  &__header
15
-    border-top-right-radius 10px
16
-    border-top-left-radius 10px
17
-    width 100%
18
-    height 8px
19
-    background-color calendar
20
-  &__close
21
-    display flex
22
-    justify-content flex-end
23
-    margin 5px
24
-    cursor pointer
25
-  &__content
26
-    display flex
27
-    align-items center
28
-    margin 10px 0 35px 0
29
-    &__icon
30
-      padding 0 30px
31
-      font-size 60px
32
-      color calendar
33
-    &__text
34
-      &__title
35
-        margin-bottom 10px
36
-        font-size 20px
37
-        font-weight 600
14
+    &__header
15
+      border-top-right-radius 10px
16
+      border-top-left-radius 10px
17
+      width 100%
18
+      height 8px
19
+      background-color calendar
20
+    &__close
21
+      display flex
22
+      justify-content flex-end
23
+      margin 5px
24
+      cursor pointer
25
+    &__content
26
+      display flex
27
+      align-items center
28
+      margin 10px 0 35px 0
29
+      &__icon
30
+        padding 0 30px
31
+        font-size 60px
38
         color calendar
32
         color calendar
39
-      &__paragraph
40
-        padding-right 20px
41
-        font-weight 500
33
+      &__text
34
+        &__title
35
+          margin-bottom 10px
36
+          font-size 20px
37
+          font-weight 600
38
+          color calendar
39
+        &__paragraph
40
+          padding-right 20px
41
+          font-weight 500