mirrors/BitwiseCmd
1
0
Fork 0
mirror of https://github.com/BorysLevytskyi/BitwiseCmd.git synced 2025-12-20 11:42:39 +01:00
Code Issues Projects Releases Wiki Activity

Styled icons.

Browse Source
This commit is contained in:
Borys Levytskyi
2015-04-23 21:16:47 +03:00
parent df7294f7ba
commit 3bd1b0145a
2 changed files with 26 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/css/styles.css
View File

@@ -1,7 +1,11 @@
body { font-family: Verdana; font-size: 0.8em; padding: 20px 100px 0 100px; margin: 0 }
code { font-size: 1.2em; font-weight: bold; }
.links { float: right; position: absolute; right: 10px; top: 10px; }
ul.links { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0 }
ul.links li { float: left; padding-left: 10px; }
.links a { display: inline-block; padding: 10px 10px 10px 0px}
.links .icon { margin-right: 5px; }
.mono { font-family: monospace; font-size: 1.3em }
.expressionInput { width: 500px; padding: 3px; border: solid 1px lightgray; }
@@ -35,15 +39,18 @@ code { font-size: 1.2em; font-weight: bold; }
.cur { color: lightgray; }
.icon { width: 16px; height: 16px; display: inline-block }
.twitter { background: url('../img/twitter.png') }
.feedback { background: url('../img/feedback.gif') }
.icon { width: 16px; height: 16px; display: inline-block; }
.light .twitter { background: url('../img/twitter-light.png') }
.dark .twitter { background: url('../img/twitter-dark.png') }
.light .feedback { background: url('../img/feedback-light.png') }
.dark .feedback { background: url('../img/feedback-dark.png') }
.dark .github { background: url('../img/github-dark.png') }
.light .github { background: url('../img/github-light.png') }
/* Light */
.light { background: rgb(250, 250, 250); }
.light { background: #fafafa; }
.light a, .light a:visited { color: #222; }
.light .one { color: black; }
.light .zero { color: #888; }
@@ -53,7 +60,7 @@ code { font-size: 1.2em; font-weight: bold; }
.light .other { color: #bbb }
.light .hashLink, .light .hashLink:visited { color: #ddd }
.light .hashLink:hover { color: #888 }
.light ul.links li:hover { background: #ddd }
/* Dark */
.dark { background: #121212; color: white;}
@@ -66,4 +73,5 @@ code { font-size: 1.2em; font-weight: bold; }
.dark .other { color: #444;}
.dark .hashLink, .dark .hashLink:visited { color: #333 }
.dark .hashLink:hover { color: #999 }
.dark ul.links li:hover { background: #333 }

27
src/index.html
View File

@@ -47,20 +47,17 @@
<header>
<h1>Bitwise<span style="color: #c5c5c5;">Cmd</span></h1>
<div class="links">
<span>
<i class="icon github">&nbsp;</i>
<a href="https://github.com/BorisLevitskiy/BitwiseCmd">Project on GitHub</a>&nbsp;
</span>
<span>
<i class="icon feedback">&nbsp;</i>
</span>
<a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback">Send Feedback</a>
<span>
<i class="icon twitter">&nbsp;</i>
<a href="https://twitter.com/BitwiseCmd">Twitter</a>
</span>
</div>
<ul class="links">
<li>
<a href="https://github.com/BorisLevitskiy/BitwiseCmd"><i class="icon github">&nbsp;</i>Project on GitHub</a>&nbsp;
</li>
<li>
<a href="https://twitter.com/BitwiseCmd"><i class="icon twitter">&nbsp;</i>Twitter</a>
</li>
<li>
<a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback"><i class="icon feedback">&nbsp;</i>Send Feedback</a>
</li>
</ul>
<div>
<input id="in" type="text" class="expressionInput mono" data-controller="expressionInputCtrl" placeholder="type expression like '1>>2' or 'help' "/>
@@ -123,7 +120,7 @@
<script data-template="aboutTpl" type="text/template">
<div class="aboutTpl">
<p> Created by <a href="http://boryslevytskyi.github.io/">Borys Levytskyi</a></p>
<p>If you have an idea, suggestion or you've spotted a bug here, please send it to <a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback">&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;</a>. Your feedback is greatly appreciated.</p>
<p>If you have an idea, suggestion or you've spotted a bug here, please send it to <a href="mailto:&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;?subject=Feedback">&#098;&#105;&#116;&#119;&#105;&#115;&#101;&#099;&#109;&#100;&#064;&#103;&#109;&#097;&#105;&#108;&#046;&#099;&#111;&#109;</a> or tweet on <a href="http://twitter.com/BitwiseCmd">@BitwiseCmd</a>. Your feedback is greatly appreciated.</p>
<p><a href="https://github.com/BorisLevitskiy/BitwiseCmd">Project on <strong>GitHub</strong></a></p>
</div>
</script>