Merge pull request #136 from brockwhittaker/master

about: Restyle Electron => Zulip desktop page.
This commit is contained in:
Akash Nimare
2017-04-13 01:06:05 +05:30
committed by GitHub
2 changed files with 65 additions and 17 deletions

View File

@@ -6,17 +6,19 @@
</head>
<body>
<div class="about">
<center><img src="../resources/zulip.png"></center>
<center><p class="detail" id="version"> Version : ?.?.? </p>
<center><p class="detail"> License : Apache </p>
<center><p class="detail"> Maintainer : Zulip </p>
<p class="left"><a class="bug" onclick="linkInBrowser()" href="#">Found bug?</a></p>
<img class="logo" src="../resources/zulip.png" />
<p class="detail" id="version">version ?.?.?</p>
<div class="maintenance-info">
<p class="detail maintainer">Maintained by Zulip</p>
<p class="detail license">Available under the Apache License</p>
<a class="bug" onclick="linkInBrowser()" href="#">Found bug?</a>
</div>
</div>
<script>
const app = require('electron').remote.app;
const version_tag = document.getElementById('version');
version_tag.innerHTML = ' Version : ' + app.getVersion() + ' ';
version_tag.innerHTML = 'version ' + app.getVersion();
function linkInBrowser(event) {

View File

@@ -1,15 +1,22 @@
body {
background: #6BB6C7;
background: #fafafa;
font-family: menu, "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
}
.logo {
display: block;
margin: 0 auto;
}
#version {
color: #aaa;
font-size: 0.9em;
}
.about {
margin-top: 50px;
}
.left {
position: absolute;
top:89%;
left:76%;
text-align: center;
}
.about p {
@@ -18,10 +25,49 @@ body {
}
.about img {
width:160px;
width: 150px;
}
.detail {
text-align: left;
margin-left: 35%;
}
text-align: center;
}
.detail.maintainer {
font-size: 1.2em;
font-weight: 500;
}
.detail.license {
font-size: 0.8em;
}
.maintenance-info {
position: absolute;
width: 100%;
bottom: 20px;
left: 0px;
color: #444;
}
.maintenance-info p {
margin: 0;
font-size: 1em;
width: 100%;
}
.maintenance-info .bug {
display: inline-block;
padding: 8px 15px;
margin-top: 30px;
text-decoration: none;
background-color: #52c2af;
color: #fff;
border-radius: 4px;
transition: background-color 0.2s ease;
}
.maintenance-info .bug:hover {
background-color: #32a692;
}