Skip to content

Commit ecdf0a6

Browse files
TristanAllaireTristanAllaire
committed
Documentation style updated
1 parent cffbe68 commit ecdf0a6

File tree

1 file changed

+102
-130
lines changed

1 file changed

+102
-130
lines changed

‎docs/source/_templates/index.html‎

Lines changed: 102 additions & 130 deletions
Original file line numberDiff line numberDiff line change
@@ -135,6 +135,57 @@
135135
/* Header gradient update */
136136
.header-gradient {
137137
background: linear-gradient(0deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.65) 100%), linear-gradient(270deg, #0084FF 19%, #61EB4C 79%);
138+
min-height: 60vh;
139+
display: flex;
140+
align-items: center;
141+
}
142+
143+
/* Compact, centered layout */
144+
.hero-container {
145+
max-width: 800px;
146+
margin: 0 auto;
147+
padding: 2rem 1rem;
148+
}
149+
150+
.hero-logo {
151+
max-width: 400px;
152+
width: 100%;
153+
height: auto;
154+
margin: 0 auto 1rem;
155+
display: block;
156+
}
157+
158+
.hero-subtitle {
159+
font-size: 1.25rem;
160+
line-height: 1.6;
161+
margin-bottom: 2rem;
162+
}
163+
164+
.hero-buttons {
165+
display: flex;
166+
gap: 1rem;
167+
justify-content: center;
168+
flex-wrap: wrap;
169+
margin-bottom: 2rem;
170+
}
171+
172+
/* Compact sections */
173+
.content-section {
174+
max-width: 1200px;
175+
margin: 0 auto;
176+
padding: 3rem 1rem;
177+
}
178+
179+
.section-content {
180+
max-width: 1000px;
181+
margin: 0 auto;
182+
}
183+
184+
/* Compact footer */
185+
.footer-section {
186+
max-width: 1200px;
187+
margin: 0 auto;
188+
padding: 2rem 1rem;
138189
}
139190

140191
::-webkit-scrollbar {
@@ -160,159 +211,80 @@
160211

161212
<body>
162213
<div class="container-fluid header-gradient">
163-
<div class="row no-gutters align-items-center">
164-
<div class="col col-lg-6 col-md-10 col-sm-12 ml-auto mr-auto">
165-
<div class="d-flex justify-content-center mt-5">
166-
<div class="d-none d-lg-block">
167-
<img src="_static/img/pymavryk.png" class="img-fluid d-block" />
168-
</div>
169-
</div>
170-
<div class="mt-3">
171-
<p class="text-center" style="font-size: 1.5em; color: #DCDCDC;">
172-
A Python library for interacting with Mavryk blockchain, <br />testing smart contracts, and
173-
writing
174-
Michelson scripts.
175-
</p>
176-
</div>
177-
<div class="mt-4 text-center">
178-
<a role="button" aria-pressed="true" class="btn-custom btn-lg mb-1 mr-2"
179-
href="contents.html">Documentation</a>
180-
<a role="button" aria-pressed="true" class="btn-custom btn-lg mb-1"
181-
href="https://pymavryk.mavryk.org" target="_blank">Interactive course</a>
182-
</div>
183-
<div class="mt-4 mb-5 text-center">
184-
<iframe
185-
src="https://ghbtns.com/github-btn.html?user=mavryk-network&repo=pymavryk&type=star&count=true&size=large"
186-
frameborder="0" scrolling="0" width="130" height="30" title="PyMavryk"></iframe>
187-
</div>
214+
<div class="hero-container text-center">
215+
<img src="_static/img/pymavryk.png" alt="PyMavryk" class="hero-logo" />
216+
<p class="hero-subtitle" style="color: #DCDCDC;">
217+
A Python library for interacting with Mavryk blockchain, testing smart contracts, and writing Michelson scripts.
218+
</p>
219+
<div class="hero-buttons">
220+
<a role="button" aria-pressed="true" class="btn-custom"
221+
href="contents.html">Documentation</a>
222+
<a role="button" aria-pressed="true" class="btn-custom"
223+
href="https://github.com/mavryk-network/pymavryk" target="_blank">GitHub</a>
188224
</div>
189225
</div>
190-
191226
</div>
192227

193228
<a id="integration-testing"></a>
194-
<div class="container-fluid pr-0 pt-4 section-dark">
195-
<div class="row no-gutters align-items-center">
196-
<div class="col col-lg-3 col-md-12 pl-4 pr-2" style="font-size: 1.2em;">
197-
<h2 style="text-transform: uppercase;">Integration testing</h2><br />
198-
<p>You can run tests either on a remote node (without actual injecting) or using a builtin interpreter,
199-
<b>it
200-
takes seconds to execute</b>, not minutes.</p><br />
201-
<p>PyMavryk allows to <b>patch</b> <kbd>AMOUNT</kbd>, <kbd>SENDER</kbd>, <kbd>SOURCE</kbd>,
202-
<kbd>BALANCE</kbd>, <kbd>NOW</kbd>, <b>initial storage</b>, and <b>handle exceptions</b> raised by
203-
<kbd>FAILWITH</kbd>.
204-
</p><br />
205-
<p>Builtin REPL allows to <b>mock cross-contract calls</b> — all you need is to validate parameters of
206-
the
207-
spawned transactions.</p><br />
208-
<p>Contract interface is derived straight from the compiled Michelson code, <b>it doesn't matter what is
209-
the
210-
source language</b>, <a href="https://ligolang.org/" target="_blank"
211-
rel="noopener nofollow">LIGO</a>, <a href="https://www.smartpy.io/" target="_blank"
212-
rel="noopener nofollow">SmartPy</a>, or
213-
else.</p><br />
214-
<p>Use the whole power of the Python unit testing framework, including various assert helpers and
215-
<b>interactive
216-
debugging</b> plugins in <a href="https://code.visualstudio.com/" target="_blank"
217-
rel="noopener nofollow">VSCode</a> and <a href="https://www.jetbrains.com/ru-ru/pycharm/"
218-
target="_blank" rel="noopener nofollow">PyCharm</a>.
219-
</p>
220-
</div>
221-
<div class="col col-lg-9 d-none d-lg-block">
222-
<div style="overflow: hidden;">
223-
<img src="_static/img/pymavryk_testing.png" />
229+
<div class="container-fluid section-dark">
230+
<div class="content-section">
231+
<div class="row align-items-center">
232+
<div class="col-lg-4 col-md-12 mb-4 mb-lg-0">
233+
<h2 style="text-transform: uppercase; font-size: 1.5rem; margin-bottom: 1rem;">Integration testing</h2>
234+
<p style="font-size: 1rem; line-height: 1.6;">You can run tests either on a remote node (without actual injecting) or using a builtin interpreter, <b>it takes seconds to execute</b>, not minutes.</p>
235+
<p style="font-size: 1rem; line-height: 1.6;">PyMavryk allows to <b>patch</b> <kbd>AMOUNT</kbd>, <kbd>SENDER</kbd>, <kbd>SOURCE</kbd>, <kbd>BALANCE</kbd>, <kbd>NOW</kbd>, <b>initial storage</b>, and <b>handle exceptions</b> raised by <kbd>FAILWITH</kbd>.</p>
236+
<p style="font-size: 1rem; line-height: 1.6;">Builtin REPL allows to <b>mock cross-contract calls</b> — all you need is to validate parameters of the spawned transactions.</p>
237+
</div>
238+
<div class="col-lg-8 d-none d-lg-block">
239+
<img src="_static/img/pymavryk_testing.png" class="img-fluid" />
224240
</div>
225241
</div>
226242
</div>
227243
</div>
228244

229245
<a id="pymavryk-client"></a>
230-
<div class="container-fluid pr-0 pt-5 section-light">
231-
<div class="row no-gutters align-items-center">
232-
<div class="col col-lg-3 col-md-12 pl-4 pr-2" style="font-size: 1.2em;">
233-
<h2 style="text-transform: uppercase;">PyMavryk client</h2><br />
234-
<p>The minimal setup <b>requires only a browser</b>&nbsp;— you can manage Mavryk contracts using <a
235-
href="https://colab.research.google.com/" target="_blank" rel="noopener nofollow">Google
236-
Colaboratory</a>,
237-
or any other online service that allows you to run <a href="https://jupyter.org/" target="_blank"
238-
rel="noopener nofollow">Jupyter</a> notebooks.</p>
239-
<br />
240-
<p>PyMavryk is capable of almost everything <a href="https://protocol.mavryk.org/api/cli-commands.html"
241-
target="_blank" rel="noopener nofollow">mavkit-client</a> can do, so you can <b>automate any</b>
242-
CI/CD <b>task</b>,
243-
key
244-
management, data conversion or other.</p><br />
245-
<p>PyMavryk is perfect when you need to <b>do something fast</b>: the default node and key settings allow
246-
you
247-
to get
248-
started right away, and the built-in documentation allows you to avoid switching between windows.
249-
</p>
250-
<br />
251-
<p>PyMavryk is built as flexible as possible: in most cases you will need only high-level interfaces, but
252-
at
253-
any moment you can go deeper and <b>customize the logic</b>.</p>
254-
</div>
255-
<div class="col col-lg-9 d-none d-lg-block">
256-
<div style="overflow: hidden;">
257-
<img src="_static/img/pymavryk_interacting.png" />
246+
<div class="container-fluid section-light">
247+
<div class="content-section">
248+
<div class="row align-items-center">
249+
<div class="col-lg-4 col-md-12 mb-4 mb-lg-0">
250+
<h2 style="text-transform: uppercase; font-size: 1.5rem; margin-bottom: 1rem;">PyMavryk client</h2>
251+
<p style="font-size: 1rem; line-height: 1.6;">The minimal setup <b>requires only a browser</b> — you can manage Mavryk contracts using <a href="https://colab.research.google.com/" target="_blank" rel="noopener nofollow">Google Colaboratory</a>, or any other online service that allows you to run <a href="https://jupyter.org/" target="_blank" rel="noopener nofollow">Jupyter</a> notebooks.</p>
252+
<p style="font-size: 1rem; line-height: 1.6;">PyMavryk is capable of almost everything <a href="https://protocol.mavryk.org/api/cli-commands.html" target="_blank" rel="noopener nofollow">mavkit-client</a> can do, so you can <b>automate any</b> CI/CD <b>task</b>, key management, data conversion or other.</p>
253+
<p style="font-size: 1rem; line-height: 1.6;">PyMavryk is perfect when you need to <b>do something fast</b>: the default node and key settings allow you to get started right away, and the built-in documentation allows you to avoid switching between windows.</p>
254+
</div>
255+
<div class="col-lg-8 d-none d-lg-block">
256+
<img src="_static/img/pymavryk_interacting.png" class="img-fluid" />
258257
</div>
259258
</div>
260259
</div>
261260
</div>
262261

263262
<a id="michelson-kernel"></a>
264-
<div class="container-fluid pr-0 pt-5 section-dark">
265-
<div class="row no-gutters align-items-center">
266-
<div class="col col-lg-3 col-md-12 pl-4 pr-2" style="font-size: 1.2em;">
267-
<h2 style="text-transform: uppercase;">Michelson kernel</h2><br />
268-
<p><b>Visualize</b> and better understand <b>stack</b> transformations with the step-by-step execution
269-
and verbose logging.</p>
270-
<br />
271-
<p>Michelson instruction set is extended with useful <b>helpers</b> for debugging and patching context.
272-
</p>
273-
<br />
274-
<p><b>Mock blockchain bindings</b> as you wish, even complicated scenarios like <i>Big_map</i> copying
275-
can be reproduced.</p>
276-
<br />
277-
<p>Shipped with <b>autocomplete and builtin documentation</b>, no need to switch tabs if you forget
278-
something.</p>
279-
<br />
280-
</div>
281-
<div class="col col-lg-9 d-none d-lg-block">
282-
<div style="overflow: hidden;">
283-
<img src="_static/img/pymavryk_kernel.png" />
263+
<div class="container-fluid section-dark">
264+
<div class="content-section">
265+
<div class="row align-items-center">
266+
<div class="col-lg-4 col-md-12 mb-4 mb-lg-0">
267+
<h2 style="text-transform: uppercase; font-size: 1.5rem; margin-bottom: 1rem;">Michelson kernel</h2>
268+
<p style="font-size: 1rem; line-height: 1.6;"><b>Visualize</b> and better understand <b>stack</b> transformations with the step-by-step execution and verbose logging.</p>
269+
<p style="font-size: 1rem; line-height: 1.6;">Michelson instruction set is extended with useful <b>helpers</b> for debugging and patching context.</p>
270+
<p style="font-size: 1rem; line-height: 1.6;"><b>Mock blockchain bindings</b> as you wish, even complicated scenarios like <i>Big_map</i> copying can be reproduced.</p>
271+
<p style="font-size: 1rem; line-height: 1.6;">Shipped with <b>autocomplete and builtin documentation</b>, no need to switch tabs if you forget something.</p>
272+
</div>
273+
<div class="col-lg-8 d-none d-lg-block">
274+
<img src="_static/img/pymavryk_kernel.png" class="img-fluid" />
284275
</div>
285276
</div>
286277
</div>
287278
</div>
288279

289280
<a id="contact"></a>
290-
<div class="container-fluid pt-5 pb-5 section-gray">
291-
<div class="row no-gutters">
292-
<div class="col-lg-6 col-md-12 ml-auto mr-auto" style="font-size: 1.2em;">
293-
<div class="row">
294-
<div class="col-6 col-lg-3 col-md-6">
295-
<span>Resources</span>
296-
<ul class="footer-links">
297-
<li><a href="https://pymavryk.mavryk.org/contents.html">Library reference</a></li>
298-
</ul>
299-
</div>
300-
<div class="col-6 col-lg-3 col-md-6">
301-
<span>Ask anything</span>
302-
<ul class="footer-links">
303-
<li><a href="https://t.me/MavrykNetwork" target="_blank" rel="noopener noreferrer">Telegram chat</a></li>
304-
<li><a href="https://github.com/mavrykdynamics/pymavryk/issues" target="_blank" rel="noopener noreferrer">Report an issue</a></li>
305-
</ul>
306-
</div>
307-
<div class="col-6 col-lg-3 col-md-6">
308-
<span>Follow us</span>
309-
<ul class="footer-links">
310-
<li><a href="https://mavrykdynamics.com/" target="_blank">Mavryk Dynamics</a></li>
311-
<li><a href="https://twitter.com/MavrykDynamics" target="_blank" rel="noopener noreferrer">X/Twitter channel</a></li>
312-
</ul>
313-
</div>
314-
</div>
315-
</div>
281+
<div class="container-fluid section-gray">
282+
<div class="footer-section text-center">
283+
<p style="font-size: 0.9rem; color: #555; margin: 0;">
284+
© Mavryk Dynamics 2025 |
285+
<a href="https://t.me/MavrykNetwork" target="_blank" rel="noopener noreferrer" style="color: #555; text-decoration: none;">Telegram</a> |
286+
<a href="https://github.com/mavrykdynamics/pymavryk/issues" target="_blank" rel="noopener noreferrer" style="color: #555; text-decoration: none;">Report an issue</a>
287+
</p>
316288
</div>
317289
</div>
318290
</body>

0 commit comments

Comments
 (0)