add base stylesheet for demos site

This commit is contained in:
Leon Chen
2016-10-05 18:25:55 -04:00
parent 867c807083
commit 39c6afc902
4 changed files with 31 additions and 25 deletions
+26
View File
@@ -0,0 +1,26 @@
body {
background: #F0F0F0;
min-height: 100vh;
}
#github-corner-link {
position: absolute;
width: 120px;
height: 120px;
top: -60px;
right: -60px;
border-radius: 50%;
background-color: #1BBC9B;
transition: background-color 0.2s ease-in;
}
#github-corner-link:hover {
background-color: rgba(27, 188, 155, 0.7);
}
#github-corner-link .github-logo {
position: absolute;
bottom: 18px;
left: 18px;
fill: white;
}
+1
View File
@@ -6,6 +6,7 @@
<title>Keras.js Demos</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="base.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.1/css/bulma.min.css">
<link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.grey-amber.min.css" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
+1 -23
View File
@@ -5,34 +5,12 @@
@import './_variables.css';
body {
background: linear-gradient(0deg, #DDDDDD, #EEEEEE);
background: linear-gradient(0deg, #CCCCCC, #F0F0F0);
color: $color-3;
min-height: 100vh;
font-family: $font-1;
}
#github-corner-link {
position: absolute;
width: 120px;
height: 120px;
top: -60px;
right: -60px;
border-radius: 50%;
background-color: $color-1;
transition: background-color 0.2s ease-in;
&:hover {
background-color: rgba(27, 188, 155, 0.7);
}
.github-logo {
position: absolute;
bottom: 18px;
left: 18px;
fill: white;
}
}
.title {
width: 100%;
color: $color-1;
+3 -2
View File
@@ -6,7 +6,8 @@
<title>Keras.js Demos</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.1.2/css/bulma.min.css">
<link rel="stylesheet" href="demos/base.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.1/css/bulma.min.css">
<link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.grey-amber.min.css" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
@@ -24,7 +25,7 @@
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/material-design-lite/1.2.1/material.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.2/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.6/d3.min.js"></script>
<script src="https://rawgit.com/posva/vue-mdl/master/dist/vue-mdl.min.js"></script>
<script src="lib/weblas.js"></script>
<script src="dist/keras.min.js"></script>