Skip to content

Commit c9afdb1

Browse files
devopsmariocomdevopsmariocom
committed
feat(style): fix items style
1 parent ffbc425 commit c9afdb1

File tree

4 files changed

+21
-18
lines changed

4 files changed

+21
-18
lines changed

‎src/App.vue‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,28 @@
44
<img class="logo" src="~public/logo-48.png" alt="logo" width="112"
55
height="28"/>
66
<ole-navbar-item slot="navbar-start" href="/top">
7-
Top
7+
<router-link to="/top">Top</router-link>
88
</ole-navbar-item>
99
<ole-navbar-item slot="navbar-start" href="/new">
10-
New
10+
<router-link to="/new">New</router-link>
1111
</ole-navbar-item>
1212
<ole-navbar-item slot="navbar-start" href="/show">
13-
Show
13+
<router-link to="/show">Show</router-link>
1414
</ole-navbar-item>
1515
<ole-navbar-item slot="navbar-start" href="/ask">
16-
Ask
16+
<router-link to="/ask">Ask</router-link>
1717
</ole-navbar-item>
1818
<ole-navbar-item slot="navbar-start" href="/job">
19-
Jobs
19+
<router-link to="/job">Jobs</router-link>
2020
</ole-navbar-item>
2121
<ole-navbar-item href="https://github.com/vuejs/vue-hackernews-2.0">
2222
<ole-icon type="github" style="color: #333;"></ole-icon>
2323
</ole-navbar-item>
2424

2525
</ole-navbar>
26-
<ole-section>
26+
<transition name="fade" mode="out-in">
2727
<router-view class="view"></router-view>
28-
</ole-section>
28+
</transition>
2929
</div>
3030
</template>
3131

@@ -35,7 +35,7 @@ body
3535
font-size 15px
3636
background-color lighten(#eceef1, 30%)
3737
margin 0
38-
padding-top 55px
38+
// padding-top 55px
3939
color #34495e
4040
overflow-y scroll
4141

‎src/components/Item.vue‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
<template>
2-
<ole-columns>
32
<ole-column>
43
<ole-box>
5-
<div slot="left" class="score">{{ item.score }}</div>
4+
<div slot="left">{{ item.score }}</div>
65
<div class="news-item">
76
<span class="title">
87
<template v-if="item.url">
@@ -28,7 +27,6 @@
2827
</span>
2928
</ole-box>
3029
</ole-column>
31-
</ole-columns>
3230
</template>
3331

3432
<script>

‎src/index.template.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
<script src="http://localhost:3333/build/ole.js"></script>
1919
</head>
2020
<body>
21-
<div id="skip"><a href="#app">skip to content</a></div>
21+
<!-- <div id="skip"><a href="#app">skip to content</a></div> -->
2222
<!--vue-ssr-outlet-->
2323
</body>
2424
</html>

‎src/views/ItemList.vue‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,16 @@
11
<template>
22
<ole-section>
3-
<ole-columns>
3+
<ole-column>
4+
<transition :name="transition">
5+
<ole-container :key="displayedPage" v-if="displayedPage > 0">
6+
<transition-group name="item">
7+
<item v-for="item in displayedItems" :key="item.id" :item="item">
8+
</item>
9+
</transition-group>
10+
</ole-container>
11+
</transition>
12+
</ole-column>
13+
414
<ole-column>
515
<ole-pagination>
616
<router-link tag="ole-pagination-link" v-if="page > 1" :to="'/' + type + '/' + (page - 1)">
@@ -14,11 +24,6 @@
1424
</router-link>
1525
</ole-pagination>
1626
</ole-column>
17-
</ole-columns>
18-
<ole-container :key="displayedPage" v-if="displayedPage > 0">
19-
<item v-for="item in displayedItems" :key="item.id" :item="item">
20-
</item>
21-
</ole-container>
2227
</ole-section>
2328
</template>
2429

0 commit comments

Comments
 (0)