summaryrefslogtreecommitdiff
path: root/src/data/home.html
diff options
context:
space:
mode:
Diffstat (limited to 'src/data/home.html')
-rw-r--r--src/data/home.html225
1 files changed, 114 insertions, 111 deletions
diff --git a/src/data/home.html b/src/data/home.html
index 295d5d78..1d791d52 100644
--- a/src/data/home.html
+++ b/src/data/home.html
@@ -12,221 +12,225 @@
/* -------------------------------------------------------- */
/* generic styles */
-* {
-border: 0; padding: 0; margin: 0;
-}
-
@font-face {
font-family: 'Nunito';
src: url(%2/fonts/Nunito-Regular.ttf);
font-weight: normal;
font-style: normal;
-
}
body {
-background: url(%2/pics/background.jpg) repeat-y #fff;
-font-family: 'Nunito', sans-serif;
-font-size: 0.9em;
-}
-
-#rekonq-newtabpage {
-width: 96%;
-text-align: center; /* center #navigation */
-margin: 0 2%;
-}
-
-#content {
-text-align: left;
-margin: 0 1% 2% 1%;
+ background: url(%2/pics/background.jpg) repeat-y #fff;
+ font-family: 'Nunito', sans-serif;
+ font-size: 0.9em;
+ border: 0;
+ padding: 0;
+ margin: 0;
}
h3 {
-padding: 0.2em;
-margin: 1.5em 0 0.5em;
-font: normal bold 1em;
+ padding: 0.2em;
+ margin: 1.5em 0 0.5em;
+ font: normal bold 1em;
}
h4 {
-padding: 0.2em;
-margin: 1em 0 0.5em;
-font: normal bold 1em;
-border-bottom: 1px solid black;
+ padding: 0.2em;
+ margin: 1em 0 0.5em;
+ font: normal bold 1em;
+ border-bottom: 1px solid black;
}
a {
-color: #3F7AB7;
-text-decoration: none;
--webkit-transition: color 0.5s ease;
+ color: #3F7AB7;
+ text-decoration: none;
+ -webkit-transition: color 0.5s ease;
}
+
a:hover {
-color: black;
+ color: black;
}
-/* -------------------------------------------------------- */
-/* Top bar */
+input {
+ min-width: 180px;
+ font-family: 'Nunito', sans-serif;
+ font-size: 0.8em;
+}
-#top {
-margin: 20px;
-display:table;
-width: 95%;
+
+.right {
+ float: right;
}
-.topSide, .topMiddle {
-display:table-cell;
+.left {
+ float: left;
}
-.topSide {
-width: 15%;
+/* -------------------------------------------------------- */
+/* content div */
+
+
+#rekonq-newtabpage {
+ width: 90%;
+ text-align: center; /* center #navigation */
+ margin: 0 5%;
}
#navigation {
-display: table;
-margin-left: auto;
-margin-right: auto;
+ display: table;
+ margin-left: auto;
+ margin-right: auto;
}
-
#actions {
-display: table;
-width:auto;
+ display: table;
+ margin: 20px auto;
+ width: 100%;
+}
+
+#content {
+ text-align: left;
+ margin: 0;
}
+
+/* -------------------------------------------------------- */
+/* Top bar */
+
.link {
-display: table-cell;
-/*display:inline-block;*/
--webkit-transition: opacity 0.5s ease;
+ display: table-cell;
+ /*display:inline-block;*/
+ -webkit-transition: opacity 0.5s ease;
}
.link:not(.current):hover {
-opacity: 0.6;
+ opacity: 0.6;
}
.link img, .link span {
-vertical-align: middle; display: inline-block;
-margin:0 10px;
+ vertical-align: middle; display: inline-block;
+ margin:0 10px;
}
.link a, .link span {
-color: black;
+ color: black;
}
#actions .link img {
-margin-right: 3px; width: 16px;
+ margin-right: 3px; width: 16px;
}
.current {
-border-width: 6px;
--webkit-border-image: url(%2/pics/button.png) 6 stretch stretch;
+ border-width: 6px;
+ -webkit-border-image: url(%2/pics/button.png) 6 stretch stretch;
}
.link:not(.current){
-margin: 0 10px;
-padding:3px;
+ margin: 0 10px;
+ padding:3px;
}
/* -------------------------------------------------------- */
/* Previews */
-#content.favorites, #content.closedTabs {
-text-align: center;
+#content.favorites, #content.closedTabs, #content.bookmarks {
+ text-align: center;
}
.thumbnail {
-display: inline-block;
-width: 25%; min-width: 240px;
-height: 170px;
-margin: 3% 0 3% 0;
+ display: inline-block;
+ width: 25%; min-width: 240px;
+ height: 170px;
+ margin: 3% 0 3% 0;
}
.thumb-inner {
-width: 232px; /* 200 + 16*2 */
-margin: auto;
+ width: 232px; /* 200 + 16*2 */
+ margin: auto;
}
.preview {
-display: table-cell; vertical-align: middle;
-width: 200px; height: 150px;
-padding: 14px 16px 12px;
-background: url(%2/pics/bg.png) no-repeat;
--webkit-background-size: 100% 100%;
+ display: table-cell;
+ vertical-align: middle;
+ width: 200px;
+ height: 150px;
+ padding: 14px 16px 12px;
+ background: url(%2/pics/bg.png) no-repeat;
+ -webkit-background-size: 100% 100%;
}
.title {
-padding: 0 12px;
+ padding: 0 12px;
}
.button img {
-display: inline-block;
-width: 16px;
-height: 16px;
-opacity: 0;
-}
-
-.remove {
-float: right;
-}
-.reload {
-float: left;
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ opacity: 0;
}
.button img, .preview {
--webkit-transition: opacity 0.8s ease-in-out;
+ -webkit-transition: opacity 0.8s ease-in-out;
}
+
.thumb-inner:hover .preview {
-opacity: 0.6;
+ opacity: 0.6;
}
+
.thumb-inner:hover .button img {
-opacity: 0.4;
--webkit-transition: opacity 0.8s ease-out;
+ opacity: 0.4;
+ -webkit-transition: opacity 0.8s ease-out;
}
+
.thumb-inner .button img:hover {
-opacity: 1;
+ opacity: 1;
}
+
.thumbnail a:hover {
-color:#3F7AB7;
+ color:#3F7AB7;
}
/* -------------------------------------------------------- */
/* Bookmarks page */
.bookmarkfolder {
-display: inline-block;
-background: #BBB;
-border-radius: 15px;
-padding: 0px 15px 15px 15px;
-float:left;
-margin: 1em;
-width: 28%;
+ background: #CCC;
+ border-radius: 15px;
+ padding: 0px 15px 15px 15px;
+ float:left;
+ margin: 1em;
+ width: 28%;
+ text-align: left;
}
/* -------------------------------------------------------- */
/* Downloads page */
.download {
-margin: 2em 5em;
+ margin: 2em 0;
}
.download img {
-float: left;
-margin-right: 5px;
+ float: left;
+ margin-right: 5px;
}
.download a.greylink {
-color:grey;
+ color:grey;
}
/* -------------------------------------------------------- */
/* History page */
.greybox {
-background: #CCC;
-padding: 5px 10px;
+ background: #CCC;
+ padding: 5px 10px;
}
.historyfolder {
-margin-left: 4em;
-margin-bottom: 1em;
+ margin-left: 4em;
+ margin-bottom: 1em;
}
@@ -234,11 +238,10 @@ margin-bottom: 1em;
/* Empty pages : in the end : need to overwrite */
#content.empty {
-margin-top: 10%;
-text-align: center;
+ margin-top: 10%;
+ text-align: center;
}
-
</style>
</head>
@@ -273,9 +276,9 @@ elements creation, cloning one of these.
</div>
</a>
<div class="title">
- <a class="button reload"><img /></a>
+ <a class="button left"><img /></a>
<span><a></a></span>
- <a class="button remove"><img /></a>
+ <a class="button right"><img /></a>
</div>
</div>
</div>
@@ -284,8 +287,8 @@ elements creation, cloning one of these.
<a></a>
<br />
<img />
- <p class="historyfolder"></p>
- <p class="bookmarkfolder"></p>
+ <div class="historyfolder"></div>
+ <div class="bookmarkfolder"></div>
</div>
</body>