Skip to content

Instantly share code, notes, and snippets.

@kk0608

kk0608/index.vue Secret

Last active Dec 9, 2018
Embed
What would you like to do?
<template>
<div>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a
class="navbar-brand"
href="#">Pllogg</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarsExampleDefault"
   aria-controls="navbarsExampleDefault"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"/>
     </button>
<div
id="navbarsExampleDefault"
class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a
class="nav-link"
href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a
class="nav-link"
href="#">Link</a>
</li>
<li class="nav-item">
<a
class="nav-link disabled"
href="#">Disabled</a>
</li>
<li class="nav-item dropdown">
<a
id="dropdown01"
class="nav-link dropdown-toggle"
href="http://example.com"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false">Dropdown</a>
<div
class="dropdown-menu"
aria-labelledby="dropdown01">
<a
class="dropdown-item"
href="#">Action</a>
<a
class="dropdown-item"
href="#">Another action</a>
<a
class="dropdown-item"
href="#">Something else here</a>
</div>
</li>
</ul>
<form class="form-inline my-3 my-lg-0">
<input
class="form-control mr-sm-2"
type="text"
placeholder="Search"
aria-label="Search">
<button
class="btn btn-outline-success my-3 my-sm-0"
type="submit">Search</button>
</form>
</div>
</nav>
<main role="main">
<div class="jumbotron">
<div class="container">
<h1 class="display-3">Pllogg Blog</h1>
<p>Nuxt.js | Pllogg</p>
<p><a
class="btn btn-primary btn-lg"
href="#"
role="button">Learn more &raquo;</a></p>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
<div class="col-md-4 my-3">
<div class="card">
<div class="card-body">
<h4 class="card-title">テスト記事1</h4>
<h6 class="card-subtitle mb-2 text-muted">テスト記事1</h6>
<p class="card-text">
テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1テスト記事1
</p>
<a
href="#!"
class="card-link">Another link</a>
</div>
</div>
</div>
</div>
<hr>
</div>
</main>
<footer class="container">
<p>&copy; Company 2017-2018</p>
</footer>
</div>
</template>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment