Просмотр исходного кода

:sparkles: pending and paired tabs styled

tags/0.0.2^2
K Rob 3 лет назад
Родитель
Сommit
37e977821a
1 измененных файлов: 23 добавлений и 11 удалений
  1. 23
    11
      frontend/src/views/PairsView.vue

+ 23
- 11
frontend/src/views/PairsView.vue Просмотреть файл

1
 <template lang="pug">
1
 <template lang="pug">
2
 main.view--pairs
2
 main.view--pairs
3
     article(v-if='isLoggedIn')
3
     article(v-if='isLoggedIn')
4
-        w-tabs(:items='tabs' fill-bar)
4
+        w-tabs(:items='tabs' fill-bar slider-color='yellow')
5
             template(#item-title='{ item }')
5
             template(#item-title='{ item }')
6
-                span.green {{ item.title }}
6
+                span {{ item.title }}
7
             //- pending tab
7
             //- pending tab
8
             template(#item-content.1='{ item }')
8
             template(#item-content.1='{ item }')
9
                 PairsList(:pairs='pending' tab-name='pending')
9
                 PairsList(:pairs='pending' tab-name='pending')
73
 </script>
73
 </script>
74
 
74
 
75
 <style lang="sass">
75
 <style lang="sass">
76
-.select--matches 
76
+.view--pairs
77
+    max-width: 450px
78
+    width: 100%
79
+    margin: 0 auto
80
+    background-color: #1F2024
81
+    .w-tabs__bar-item
82
+        height: 50px
83
+        font-family: 'Century Gothic'
84
+        color: #FFFFFF
85
+        &.w-tabs__bar-item--active
86
+        &.primary
87
+            color: #F2CD5C
88
+.select--matches
77
     display: flex
89
     display: flex
78
     justify-content: space-between
90
     justify-content: space-between
79
     margin: 0 25px
91
     margin: 0 25px
80
-.select--matches > div 
81
-    width: 100%
82
-    text-align: center
83
-    font-size: 16px
84
-    line-height: 40px
85
-.active 
92
+    > div
93
+        width: 100%
94
+        text-align: center
95
+        font-size: 16px
96
+        line-height: 40px
97
+.active
86
     border-bottom: 3px solid #f2cd5c
98
     border-bottom: 3px solid #f2cd5c
87
     color: #f2cd5c
99
     color: #f2cd5c
88
-.idle 
89
-    color: #bcc5d3
90
 
100
 
101
+.idle
102
+    color: #bcc5d3
91
 </style>
103
 </style>

Загрузка…
Отмена
Сохранить