Skip to content

Commit 82396ff

Browse files
bcbbcb
committed
Adjust design of site
1 parent 9e4a966 commit 82396ff

File tree

3 files changed

+68
-81
lines changed

3 files changed

+68
-81
lines changed

‎assets/powersync.png‎

-47.5 KB
Loading

‎index.css‎

Lines changed: 44 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,63 @@
1+
*,
12
html,
23
body {
34
margin: 0;
45
padding: 0;
5-
background-color: #111;
66
}
77

88
body {
99
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Adjusted",
1010
"Segoe UI", "Liberation Sans", sans-serif;
11+
background-color: #111;
1112
}
1213

13-
section {
14-
margin: 0 auto;
15-
padding: 0 2em;
16-
17-
display: flex;
18-
flex-direction: column;
19-
justify-content: center;
20-
align-items: center;
14+
#start {
15+
padding-top: 2em;
16+
padding-bottom: 5em;
17+
background-color: #071039;
18+
@media only screen and (min-width: 768px) {
19+
padding-top: 10rem;
20+
padding-bottom: 10rem;
21+
}
2122
}
2223

23-
#logo {
24+
#start #logo {
2425
display: block;
25-
max-width: 300px;
26-
margin: 0 auto 1em auto;
27-
}
28-
29-
#reliableapps {
3026
max-width: 250px;
31-
margin: 1em auto;
32-
display: block;
33-
}
34-
35-
h2 {
36-
font-size: 1.6em;
37-
margin-top: 1em;
38-
color: #eee;
39-
text-align: center;
27+
margin: 0 auto 2em auto;
4028
}
4129

42-
#pitch {
30+
#start #pitch {
4331
color: white;
4432
margin: 2em auto;
4533
max-width: 600px;
4634
line-height: 1.5;
4735
text-align: center;
36+
font-size: 1.5em;
37+
padding: 0 1em;
38+
@media only screen and (min-width: 768px) {
39+
font-size: 1.8em;
40+
}
4841
}
4942

50-
#pitch a {
51-
color: #2c82f7;
52-
text-decoration: none;
53-
}
54-
55-
#pitch a:hover {
56-
text-decoration: underline;
43+
#start #campaign {
44+
text-align: center;
45+
padding: 0 2em;
5746
}
5847

59-
.projects h1 {
48+
#projects h1 {
6049
color: #eee;
6150
text-align: center;
6251
margin-top: 6em;
6352
}
6453

65-
section.start {
66-
background-color: #071039;
67-
min-height: 80vh;
54+
section {
55+
margin: 0 auto;
56+
padding: 0 2em;
57+
display: flex;
58+
flex-direction: column;
59+
justify-content: center;
60+
align-items: center;
6861
}
6962

7063
section.project {
@@ -74,36 +67,38 @@ section.project {
7467

7568
section.project img {
7669
display: block;
77-
margin-left: auto;
78-
margin-right: auto;
7970
max-width: 100%;
8071
margin-bottom: 1em;
8172
}
8273

74+
/* Project name */
8375
section.project h2 {
76+
color: white;
8477
font-size: 2rem;
85-
margin: 0;
86-
padding: 0;
78+
margin-bottom: 25px;
79+
}
80+
81+
section.project .links {
82+
text-align: center;
83+
margin-bottom: 25px;
8784
}
8885

86+
section.project .links a {
87+
color: cyan;
88+
}
89+
90+
/* Description */
8991
section.project h3 {
92+
margin: 0;
9093
max-width: 400px;
9194
font-size: 120%;
9295
font-weight: normal;
96+
font-style: italic;
9397
color: #eee;
9498
text-align: center;
95-
font-style: italic;
9699
line-height: 140%;
97100
}
98101

99-
section.project p {
100-
text-align: center;
101-
}
102-
103-
section.project p a {
104-
color: cyan;
105-
}
106-
107102

108103
/* GitHub icon before GitHub links */
109104
a[href*="github.com"]::before {

‎index.html‎

Lines changed: 24 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
</head>
1010
<body>
1111
<main>
12-
<section class="start">
12+
<div id="start">
1313
<img id="logo" src="/assets/logo.png" alt="Logo" data-aos="flip-left" />
1414

1515
<!--
@@ -26,6 +26,7 @@
2626
</p>
2727

2828
<!--Zoho Campaigns Web-Optin Form's Header Code Starts Here-->
29+
<div id="campaign">
2930

3031
<script type="text/javascript" src="https://zcmp-user.maillist-manage.com.au/js/optin.min.js" onload="setupSF('sf3zffe2a83f6cfd2a1d2743bdc53ed6d9c637778874ae5738950198d8388004b22c','ZCFORMVIEW',false,'light',false,'0')"></script>
3132
<script type="text/javascript">
@@ -37,7 +38,6 @@
3738
<style>.quick_form_8_css * { -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important; overflow-wrap: break-word }@media only screen and (max-width: 600px) {.quick_form_8_css[name="SIGNUP_BODY"] { width: 100% !important; min-width: 100% !important; margin: 0px auto !important; padding: 0px !important } .SIGNUP_FLD { width: 90% !important; margin: 10px 5% !important; padding: 0px !important } .SIGNUP_FLD input { margin: 0 !important; border-radius: 25px !important } }</style>
3839

3940
<!--Zoho Campaigns Web-Optin Form's Header Code Ends Here--><!--Zoho Campaigns Web-Optin Form Starts Here-->
40-
4141
<div id="sf3zffe2a83f6cfd2a1d2743bdc53ed6d9c637778874ae5738950198d8388004b22c" data-type="signupform" style="opacity: 1;">
4242
<div id="customForm">
4343
<div class="quick_form_8_css" style="border: 0px solid white; padding: 1em; color: white; overflow: hidden" name="SIGNUP_BODY">
@@ -107,64 +107,56 @@
107107
</span>
108108
<div id="zcOptinSuccessPanel"></div>
109109
</div>
110-
110+
</div>
111111
<!--Zoho Campaigns Web-Optin Form Ends Here-->
112-
</section>
113112

114-
<div class="projects">
113+
</div>
114+
115+
<div id="projects">
115116
<h1>Projects</h1>
116117

117118
<!-- SuperStack -->
118119
<section class="project">
119120
<img src="/assets/superstack.png" alt="SuperStack logo" />
120121
<h2>SuperStack</h2>
121-
<h3>SuperStack is a lightweight and extensible application backend – coming soon!</h3>
122+
<h3>Lightweight and extensible application backend – coming soon!</h3>
122123
</section>
123124

124125
<!-- iko -->
125126
<section class="project">
126-
<a href="/iko/"><img src="/assets/iko.png" alt="iko logo" /></a>
127+
<img src="/assets/iko.png" alt="iko logo" />
127128
<h2>iko</h2>
129+
<div class="links">
130+
<a class="docs-link" href="/iko/">Docs</a> | <a href="https://github.com/explodinglabs/iko">GitHub</a>
131+
</div>
128132
<h3>A command-line tool for generation and management of database migrations.</h3>
129-
<p>
130-
<a class="docs-link" href="/iko/">Docs</a> |
131-
<a href="https://github.com/explodinglabs/iko">GitHub</a>
132-
</p>
133133
</section>
134134

135135
<!-- powersync -->
136136
<section class="project">
137137
<img src="/assets/powersync.png" alt="powersync logo" />
138+
<h2>PowerSync</h2>
139+
<div class="links">
140+
<a href="https://github.com/explodinglabs/powersync">GitHub</a>
141+
</div>
138142
<h3>
139143
Keep browsers in sync during development.
140144
</h3>
141-
<p>
142-
<a href="https://github.com/explodinglabs/powersync">GitHub</a>
143-
</p>
144145
</section>
145146

146147
<!-- jsonrpcclient -->
147148
<section class="project">
148-
<a href="/jsonrpcclient/"><img src="/assets/jsonrpcclient.png" alt="jsonrpcclient logo" /></a>
149-
<h3>
150-
Generate JSON-RPC requests and parse responses in Python.
151-
</h3>
152-
<p>
153-
<a class="docs-link" href="/jsonrpcclient/">Docs</a> |
154-
<a href="https://github.com/explodinglabs/jsonrpcclient">GitHub</a>
155-
</p>
156-
</section>
157-
158-
<!-- jsonrpcserver -->
159-
<section class="project">
160-
<a href="/jsonrpcserver/"><img src="/assets/jsonrpcserver.png" alt="jsonrpcserver logo" /></a>
149+
<img src="/assets/jsonrpcclient.png" alt="jsonrpcclient logo" />
150+
<div class="links">
151+
<a class="docs-link" href="/jsonrpcclient/">Docs</a> | <a href="https://github.com/explodinglabs/jsonrpcclient">GitHub</a>
152+
</div>
153+
<img src="/assets/jsonrpcserver.png" alt="jsonrpcserver logo" />
154+
<div class="links">
155+
<a class="docs-link" href="/jsonrpcserver/">Docs</a> | <a href="https://github.com/explodinglabs/jsonrpcserver">GitHub</a>
156+
</div>
161157
<h3>
162-
Process incoming JSON-RPC requests in Python.
158+
JSON-RPC handling Python libraries.
163159
</h3>
164-
<p>
165-
<a class="docs-link" href="/jsonrpcserver/">Docs</a> |
166-
<a href="https://github.com/explodinglabs/jsonrpcserver">GitHub</a>
167-
</p>
168160
</section>
169161

170162
</div>

0 commit comments

Comments
 (0)