Basic layout
This commit is contained in:
parent
fe652fd276
commit
b1516b3371
|
@ -9,6 +9,7 @@
|
||||||
{{content-for "head"}}
|
{{content-for "head"}}
|
||||||
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/vendor.css">
|
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/vendor.css">
|
||||||
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/akkounts-web.css">
|
<link integrity="" rel="stylesheet" href="{{rootURL}}assets/akkounts-web.css">
|
||||||
|
<link href='https://fonts.googleapis.com/css?family=Raleway:300|Abel' rel='stylesheet' type='text/css'>
|
||||||
{{content-for "head-footer"}}
|
{{content-for "head-footer"}}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -16,6 +17,6 @@
|
||||||
<script src="{{rootURL}}assets/vendor.js"></script>
|
<script src="{{rootURL}}assets/vendor.js"></script>
|
||||||
<script src="{{rootURL}}assets/akkounts-web.js"></script>
|
<script src="{{rootURL}}assets/akkounts-web.js"></script>
|
||||||
{{content-for "body-footer"}}
|
{{content-for "body-footer"}}
|
||||||
<script src ="http://andromeda.kosmos.org:23001/modal/btcpay.js"></script>
|
<script src ="https://btcpay.kosmos.org/modal/btcpay.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
import Route from '@ember/routing/route';
|
||||||
|
|
||||||
|
export default Route.extend({
|
||||||
|
});
|
|
@ -1,20 +1,93 @@
|
||||||
fieldset {
|
h1, h2, ul, li, p {
|
||||||
border: none;
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
text-align: center;
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-family: Abel, sans-serif;
|
||||||
|
font-size: 18px;
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
}
|
||||||
|
|
||||||
|
#grid-container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 38.2% 61.8%;
|
||||||
|
grid-template-rows: 10rem 1fr;
|
||||||
|
grid-template-areas: "A C" "B C";
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
header.site {
|
||||||
|
grid-area: A;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 2rem;
|
||||||
|
background: rgb(137,85,160);
|
||||||
|
background: linear-gradient(35deg, rgba(137,85,160,1) 0%, rgba(13,79,153,1) 100%);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
header.site h1 {
|
||||||
|
flex: 1;
|
||||||
|
font-family: Raleway, sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 2rem;
|
||||||
|
letter-spacing: 0.025em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.site {
|
||||||
|
grid-area: B;
|
||||||
|
padding: 2rem 0;
|
||||||
|
background-color: #222;
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.site header {
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.site ul {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.site ul li > a {
|
||||||
|
display: block;
|
||||||
|
padding: 2rem 2rem;
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.site ul li > a:hover,
|
||||||
|
nav.site ul li > a.active {
|
||||||
|
background-color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
margin: 5rem auto;
|
grid-area: C;
|
||||||
|
grid-row: span 2 / auto;
|
||||||
|
/* margin: 5rem auto; */
|
||||||
|
background-color: white;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
main h2 {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
main p {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
input#email, input#amount {
|
input#email, input#amount {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
font-size: 1.25rem;
|
font-size: 1.25rem;
|
||||||
|
|
|
@ -1,3 +1,55 @@
|
||||||
<main>
|
<div id="grid-container">
|
||||||
{{outlet}}
|
<header class="site">
|
||||||
</main>
|
<h1>
|
||||||
|
<span class="project-name">Kosmos</span>
|
||||||
|
<span class="site-name">Services</span>
|
||||||
|
</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<nav class="site">
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
{{#link-to "mastodon.signup"}}
|
||||||
|
<header>
|
||||||
|
<span class="domain-name">kosmos.social</span>
|
||||||
|
<span class="product-name">(Mastodon)</span>
|
||||||
|
</header>
|
||||||
|
<p class="description">
|
||||||
|
A social network server that is part of the fediverse, a decentralized
|
||||||
|
alternative to Twitter etc.
|
||||||
|
</p>
|
||||||
|
{{/link-to}}
|
||||||
|
</li>
|
||||||
|
<li class="coming-soon">
|
||||||
|
<a href="#">
|
||||||
|
<header>
|
||||||
|
<span class="domain-name">xmpp.kosmos.org</span>:
|
||||||
|
<span class="product-name">(ejabberd)</span>
|
||||||
|
</header>
|
||||||
|
<p class="description">
|
||||||
|
Chat rooms and instant messaging, based on a widely used open protocol.
|
||||||
|
A decentralized alternative to Slack, Telegram, Signal, etc.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="coming-soon">
|
||||||
|
<a href="#">
|
||||||
|
<header>
|
||||||
|
<span class="domain-name">gitea.kosmos.org</span>:
|
||||||
|
<span class="product-name">(Gitea)</span>
|
||||||
|
</header>
|
||||||
|
<p class="description">
|
||||||
|
Code hosting and collaboration for software projects. A free and open
|
||||||
|
alternative to GitHub, GitLab, etc.
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
{{outlet}}
|
||||||
|
</main>
|
||||||
|
</div>
|
|
@ -0,0 +1,4 @@
|
||||||
|
<h2>kosmos.social</h2>
|
||||||
|
<p>
|
||||||
|
{{#link-to "mastodon.signup"}}I would like to register a new account{{/link-to}}
|
||||||
|
</p>
|
|
@ -0,0 +1,11 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupTest } from 'ember-qunit';
|
||||||
|
|
||||||
|
module('Unit | Route | mastodon/index', function(hooks) {
|
||||||
|
setupTest(hooks);
|
||||||
|
|
||||||
|
test('it exists', function(assert) {
|
||||||
|
let route = this.owner.lookup('route:mastodon/index');
|
||||||
|
assert.ok(route);
|
||||||
|
});
|
||||||
|
});
|
Reference in New Issue