added "fork me on github" ribbon
This commit is contained in:
Omer Ganim
parent
42c19432d0
commit
f7df9a82b5
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
22
index.html
22
index.html
|
|
@ -15,8 +15,8 @@
|
|||
<!-- Optional theme -->
|
||||
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">-->
|
||||
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/lib/codemirror.css" />
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/theme/solarized.css" />
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/lib/codemirror.css"/>
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/theme/solarized.css"/>
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/addon/hint/show-hint.css">
|
||||
<link rel="stylesheet" href="playground/libs/codemirror-4.8/addon/lint/lint.css">
|
||||
|
||||
|
|
@ -30,7 +30,8 @@
|
|||
<div class="nav-main">
|
||||
<div class="wrap">
|
||||
<a class="nav-home" href="index.html">
|
||||
<img class="nav-logo" src="https://wix.github.io/react-templates/img/logo-rt.svg" width="56" height="24">
|
||||
<img class="nav-logo" src="https://wix.github.io/react-templates/img/logo-rt.svg" width="56"
|
||||
height="24">
|
||||
<span>React Templates</span>
|
||||
</a>
|
||||
<ul class="nav-site">
|
||||
|
|
@ -41,6 +42,10 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<a href="https://github.com/wix/react-templates">
|
||||
<img style="position: fixed; top: 0; right: 0; border: 0; z-index: 101" src="img/github-fork-me.png"
|
||||
alt="Fork me on GitHub">
|
||||
</a>
|
||||
|
||||
<div class="hero">
|
||||
<div class="wrap">
|
||||
|
|
@ -56,9 +61,11 @@
|
|||
|
||||
<section class="content wrap">
|
||||
<section class="love-list">
|
||||
<ul >
|
||||
<ul>
|
||||
<li>No runtime libraries. No magic. Just simple pre-compilation to a clear React code</li>
|
||||
<li>Super easy to write panels. By panels we mean components that have a lot of HTML code and non-reusable logic</li>
|
||||
<li>Super easy to write panels. By panels we mean components that have a lot of HTML code and
|
||||
non-reusable logic
|
||||
</li>
|
||||
<li>Very good separation of presentation and logic. Almost no HTML within the component file</li>
|
||||
<li>Declarative coding for presentation. HTML that you write and inspect look similar</li>
|
||||
<li>Easy syntax. Similar to HTML. All IDEs recognize this format</li>
|
||||
|
|
@ -68,7 +75,7 @@
|
|||
<section id="home-section" class="home-section">
|
||||
</section>
|
||||
<div id="loading">Loading...</div>
|
||||
<hr class="home-divider" />
|
||||
<hr class="home-divider"/>
|
||||
</section>
|
||||
|
||||
<footer class="footer">
|
||||
|
|
@ -83,7 +90,8 @@
|
|||
<!--<script src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.js"></script>-->
|
||||
<!--http://requirejs.org/docs/release/2.1.15/minified/require.js-->
|
||||
|
||||
<script data-main="playground/home-main.js" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.min.js"></script>
|
||||
<script data-main="playground/home-main.js"
|
||||
src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.min.js"></script>
|
||||
<!--<script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.min.js"></script>-->
|
||||
<!--<script src="playground/dist/home.min.js"></script>-->
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -10,10 +10,10 @@ p {
|
|||
}
|
||||
|
||||
/*.subHeader {*/
|
||||
/*font-size: 21px;*/
|
||||
/*font-weight: 200;*/
|
||||
/*line-height: 30px;*/
|
||||
/*margin-bottom: 10px*/
|
||||
/*font-size: 21px;*/
|
||||
/*font-weight: 200;*/
|
||||
/*line-height: 30px;*/
|
||||
/*margin-bottom: 10px*/
|
||||
/*}*/
|
||||
|
||||
em {
|
||||
|
|
@ -450,7 +450,7 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
|||
.nav-main .nav-logo {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
margin-bottom:5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.nav-main ul {
|
||||
|
|
@ -462,7 +462,7 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
|||
}
|
||||
|
||||
.hero {
|
||||
padding-bottom:60px;
|
||||
padding-bottom: 60px;
|
||||
background: #fff;
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
|
@ -479,33 +479,34 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
|
|||
text-align: center;
|
||||
color: #444;
|
||||
margin-top: 15px;
|
||||
font-weight:300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.love-list{
|
||||
.love-list {
|
||||
padding: 40px 0;
|
||||
border: 1px solid #ddd;
|
||||
border-width: 1px 0 1px 0;
|
||||
}
|
||||
.love-list ul{
|
||||
margin:0;
|
||||
padding:0;
|
||||
|
||||
.love-list ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.love-list li{
|
||||
.love-list li {
|
||||
font-size: 18px;
|
||||
line-height:1.7;
|
||||
line-height: 1.7;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.love-list li::before{
|
||||
.love-list li::before {
|
||||
content: '';
|
||||
display:inline-block;
|
||||
width:14px;
|
||||
height:14px;
|
||||
border-radius:9px;
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 9px;
|
||||
background: #3899EC;
|
||||
margin-right:12px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.buttons-unit {
|
||||
|
|
@ -903,27 +904,27 @@ h1:after {
|
|||
}
|
||||
|
||||
/*div.CodeMirror pre, div.CodeMirror-linenumber, code {*/
|
||||
/*font-family: 'source-code-pro', Menlo, Consolas, 'Courier New', monospace;*/
|
||||
/*font-size: 0.8em;*/
|
||||
/*line-height: 1.5*/
|
||||
/*font-family: 'source-code-pro', Menlo, Consolas, 'Courier New', monospace;*/
|
||||
/*font-size: 0.8em;*/
|
||||
/*line-height: 1.5*/
|
||||
/*}*/
|
||||
|
||||
/*div.CodeMirror-linenumber:after {*/
|
||||
/*content: '.'*/
|
||||
/*content: '.'*/
|
||||
/*}*/
|
||||
|
||||
/*.CodeMirror, div.CodeMirror-gutters, div.highlight {*/
|
||||
/*border: none*/
|
||||
/*border: none*/
|
||||
/*}*/
|
||||
|
||||
/*.CodeMirror-readonly div.CodeMirror-cursor {*/
|
||||
/*visibility: hidden*/
|
||||
/*visibility: hidden*/
|
||||
/*}*/
|
||||
|
||||
/*small code, li code, p code {*/
|
||||
/*color: #555;*/
|
||||
/*background-color: rgba(0, 0, 0, 0.04);*/
|
||||
/*padding: 1px 3px*/
|
||||
/*color: #555;*/
|
||||
/*background-color: rgba(0, 0, 0, 0.04);*/
|
||||
/*padding: 1px 3px*/
|
||||
/*}*/
|
||||
|
||||
.cm-s-default span.cm-string-2 {
|
||||
|
|
@ -1061,17 +1062,17 @@ h1:after {
|
|||
}
|
||||
|
||||
/*.post {*/
|
||||
/*margin-bottom: 30px*/
|
||||
/*margin-bottom: 30px*/
|
||||
/*}*/
|
||||
|
||||
/*.pagination {*/
|
||||
/*margin-bottom: 30px;*/
|
||||
/*width: 100%;*/
|
||||
/*overflow: hidden;*/
|
||||
/*margin-bottom: 30px;*/
|
||||
/*width: 100%;*/
|
||||
/*overflow: hidden;*/
|
||||
/*}*/
|
||||
|
||||
/*.pagination .next {*/
|
||||
/*float: right*/
|
||||
/*float: right*/
|
||||
/*}*/
|
||||
|
||||
div[data-twttr-id] iframe {
|
||||
|
|
@ -1167,13 +1168,13 @@ div[data-twttr-id] iframe {
|
|||
}
|
||||
|
||||
.sample-view {
|
||||
border:1px solid #ddd;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
background-color: #f8f8f5;
|
||||
padding: 20px 30px;
|
||||
margin-left:30px;
|
||||
margin-left: 30px;
|
||||
height: 301px;
|
||||
max-height:308px;
|
||||
max-height: 308px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
|
@ -1194,8 +1195,8 @@ footer {
|
|||
|
||||
footer span {
|
||||
display: inline-block;
|
||||
line-height:1.5;
|
||||
vertical-align:text-bottom;
|
||||
line-height: 1.5;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
.wf-white-logo {
|
||||
|
|
@ -1207,5 +1208,10 @@ footer span {
|
|||
background-position: 0 -188px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.img-fork-github {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border: 0;
|
||||
z-index: 101
|
||||
}
|
||||
Loading…
Reference in New Issue