Skip to content

Issue 5 #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
taitai9847 wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Issue 5 #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0dafa44
change size font
taitai9847 Jun 16, 2018
793ae55
title bg color change
taitai9847 Jun 16, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 15 additions & 1 deletion index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,9 @@
h1, h2, h3, h4, h5, h6 {
font-family: "Playfair Display", Georgia, "Times New Roman", serif;
}

p{
font-size: 1.2rem;
}
.display-4 {
font-size: 2.5rem;
}
Expand Down Expand Up @@ -128,3 +130,15 @@ h1, h2, h3, h4, h5, h6 {
.blog-footer p:last-child {
margin-bottom: 0;
}

.bg-custom {
background-color: #06ad6c
}

.bg-custom1{
background-color: #e85838
}

.bg-custom2{
background-color: #f895cc
}
16 changes: 8 additions & 8 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,21 +37,21 @@
</nav>
</div>

<div class="jumbotron p-3 p-md-5 text-white rounded bg-dark">
<div class="jumbotron p-3 p-md-5 text-white rounded bg-custom">
<div class="col-md-6 px-0">
<h1 class="display-4 font-italic">Title of a longer featured blog post</h1>
<p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what's most interesting in this post's contents.</p>
<p class="lead mb-0"><a href="#" class="text-white font-weight-bold">Continue reading...</a></p>
</div>
</div>

<div class="row mb-2">
<div class="col-md-6">
<div class="card flex-md-row mb-4 box-shadow h-md-250">
<div class="row mb-2 ">
<div class="col-md-6 ">
<div class="card flex-md-row mb-4 box-shadow h-md-250 bg-custom1 text-white">
<div class="card-body d-flex flex-column align-items-start">
<strong class="d-inline-block mb-2 text-primary">World</strong>
<h3 class="mb-0">
<a class="text-dark" href="#">Featured post</a>
<h3 class="mb-0 ">
<a class="text-white" href="#">Featured post</a>
</h3>
<div class="mb-1 text-muted">Nov 12</div>
<p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
Expand All @@ -61,11 +61,11 @@ <h3 class="mb-0">
</div>
</div>
<div class="col-md-6">
<div class="card flex-md-row mb-4 box-shadow h-md-250">
<div class="card flex-md-row mb-4 box-shadow h-md-250 bg-custom2 text-white">
<div class="card-body d-flex flex-column align-items-start">
<strong class="d-inline-block mb-2 text-success">Design</strong>
<h3 class="mb-0">
<a class="text-dark" href="#">Post title</a>
<a class="text-white" href="#">Post title</a>
</h3>
<div class="mb-1 text-muted">Nov 11</div>
<p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
Expand Down