Skip to content

Commit bba67a7

Browse files
jyu0414jyu0414
committed
add index page
1 parent 3fb0c16 commit bba67a7

File tree

2 files changed

+71
-55
lines changed

2 files changed

+71
-55
lines changed

‎.vscode/launch.json

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
// Use IntelliSense to learn about possible attributes.
3+
// Hover to view descriptions of existing attributes.
4+
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
5+
"version": "0.2.0",
6+
"configurations": [
7+
{
8+
"type": "chrome",
9+
"request": "launch",
10+
"name": "Launch Chrome against localhost",
11+
"url": "http://localhost:8080/hosting/public",
12+
"webRoot": "${workspaceFolder}"
13+
}
14+
]
15+
}

‎hosting/public/index.html

+56-55
Original file line numberDiff line numberDiff line change
@@ -1,65 +1,66 @@
1-
<!DOCTYPE html>
2-
<html>
1+
<!doctype html>
2+
<html lang="ja">
33
<head>
4+
<!-- Required meta tags -->
45
<meta charset="utf-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1">
6-
<title>Welcome to Firebase Hosting</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
77

8-
<!-- update the version number as needed -->
9-
<script defer src="/__/firebase/5.8.0/firebase-app.js"></script>
10-
<!-- include only the Firebase features as you need -->
11-
<script defer src="/__/firebase/5.8.0/firebase-auth.js"></script>
12-
<script defer src="/__/firebase/5.8.0/firebase-database.js"></script>
13-
<script defer src="/__/firebase/5.8.0/firebase-messaging.js"></script>
14-
<script defer src="/__/firebase/5.8.0/firebase-storage.js"></script>
15-
<!-- initialize the SDK after all desired features are loaded -->
16-
<script defer src="/__/firebase/init.js"></script>
8+
<!-- Bootstrap CSS -->
9+
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
1710

18-
<style media="screen">
19-
body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
20-
#message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px; border-radius: 3px; }
21-
#message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
22-
#message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
23-
#message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
24-
#message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
25-
#message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
26-
#load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
27-
@media (max-width: 600px) {
28-
body, #message { margin-top: 0; background: white; box-shadow: none; }
29-
body { border-top: 16px solid #ffa100; }
30-
}
31-
</style>
11+
<title>Kasgai</title>
3212
</head>
3313
<body>
34-
<div id="message">
35-
<h2>Welcome</h2>
36-
<h1>Firebase Hosting Setup Complete</h1>
37-
<p>You're seeing this because you've successfully setup Firebase Hosting. Now it's time to go build something extraordinary!</p>
38-
<a target="_blank" href="https://firebase.google.com/docs/hosting/">Open Hosting Documentation</a>
14+
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
15+
<div class="container">
16+
<a class="navbar-brand" href="#">Kasgai</a>
17+
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
18+
<span class="navbar-toggler-icon"></span>
19+
</button>
20+
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
21+
<div class="navbar-nav mr-auto">
22+
<span class="navbar-text" href="#">Hi, Yuji Sasaki</span>
23+
</div>
24+
<div class="navbar-nav">
25+
<a class="nav-item nav-link" href="#">ログアウト</a>
26+
</div>
27+
</div>
28+
</div>
29+
</nav>
30+
31+
<div class="container mt-5">
32+
<h3>
33+
Projects
34+
<small class="text-muted ml-3">参加中のプロジェクト</small>
35+
<button type="button" class="btn btn-outline-success float-right">新規プロジェクト</button>
36+
</h3>
37+
<div class="row mt-5">
38+
<div class="col-sm-6">
39+
<div class="card">
40+
<div class="card-body">
41+
<h5 class="card-title">Special title treatment</h5>
42+
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
43+
<a href="#" class="btn btn-primary">Go somewhere</a>
44+
</div>
45+
</div>
46+
</div>
47+
<div class="col-sm-6">
48+
<div class="card">
49+
<div class="card-body">
50+
<h5 class="card-title">Special title treatment</h5>
51+
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
52+
<a href="#" class="btn btn-primary">Go somewhere</a>
53+
</div>
54+
</div>
55+
</div>
56+
</div>
3957
</div>
40-
<p id="load">Firebase SDK Loading&hellip;</p>
4158

42-
<script>
43-
document.addEventListener('DOMContentLoaded', function() {
44-
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
45-
// // The Firebase SDK is initialized and available here!
46-
//
47-
// firebase.auth().onAuthStateChanged(user => { });
48-
// firebase.database().ref('/path/to/ref').on('value', snapshot => { });
49-
// firebase.messaging().requestPermission().then(() => { });
50-
// firebase.storage().ref('/path/to/ref').getDownloadURL().then(() => { });
51-
//
52-
// // 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
59+
<!-- Optional JavaScript -->
5360

54-
try {
55-
let app = firebase.app();
56-
let features = ['auth', 'database', 'messaging', 'storage'].filter(feature => typeof app[feature] === 'function');
57-
document.getElementById('load').innerHTML = `Firebase SDK loaded with ${features.join(', ')}`;
58-
} catch (e) {
59-
console.error(e);
60-
document.getElementById('load').innerHTML = 'Error loading the Firebase SDK, check the console.';
61-
}
62-
});
63-
</script>
61+
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
62+
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
63+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
64+
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
6465
</body>
65-
</html>
66+
</html>

0 commit comments

Comments
 (0)