Skip to content

Commit cb019fa

Browse files
andreacorbelliniandreacorbellini
committed
Improve the look and feel of the HTML tools.
1 parent 35d75e6 commit cb019fa

File tree

5 files changed

+34
-13
lines changed

5 files changed

+34
-13
lines changed

‎interactive/ec.css

+16-7
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,27 @@
55

66
html, body {
77
min-width: 600px;
8+
background-color: #f0f0f0;
89
}
910

1011
html, body, input {
11-
color: #7f8d8c;
12+
color: #000000;
1213
font-size: 1.125rem;
1314
font-family: "Source Sans Pro", sans-serif;
1415
line-height: 1.5;
1516
}
1617

18+
a {
19+
color: #a84646;
20+
}
21+
1722
header {
23+
padding-bottom: 10px;
1824
text-align: center;
1925
}
2026

2127
header h1 {
2228
color: #000000;
23-
text-transform: uppercase;
2429
margin: 0;
2530
}
2631

@@ -48,19 +53,24 @@ header nav ul li:last-child {
4853
}
4954

5055
header nav ul li a {
51-
font-weight: 900;
5256
text-decoration: none;
5357
text-transform: uppercase;
58+
}
59+
60+
header nav ul li a.active {
61+
font-weight: 900;
5462
color: #000000;
5563
}
5664

57-
header nav ul li a.active,
58-
header nav ul li a:hover {
59-
color: #3fc380;
65+
footer {
66+
padding: 20px 60px;
67+
font-size: 18px;
6068
}
6169

6270
main {
71+
padding: 20px 0;
6372
text-align: center;
73+
background-color: #ffffff;
6474
}
6575

6676
label {
@@ -76,7 +86,6 @@ main .box {
7686
main #plot {
7787
width: 600px;
7888
height: 600px;
79-
margin: 1em .5em 0 .5em;
8089
}
8190

8291
main #form {

‎interactive/modk-add.html

+5-2
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
<body>
1313
<header>
1414
<h1>Elliptic Curve point addition (&#120125;<sub>p</sub>)</h1>
15-
<p>A set of tools to play with elliptic curves in real and finite fields.</p>
1615
<nav>
1716
<ul>
1817
<li class="field">&#8477;</li>
@@ -55,13 +54,17 @@ <h1>Elliptic Curve point addition (&#120125;<sub>p</sub>)</h1>
5554
</div>
5655
</div>
5756
<div id="summary">
58-
<p>Point addition over the elliptic curve <span class="curve-equation"></span> in &#120125;/<span class="field-order"></span>.</p>
57+
<p>Point addition over the elliptic curve <span class="curve-equation"></span> in &#120125;<sub class="field-order"></sub>.</p>
5958
<p>The curve has <span class="curve-order"></span> points (including the point at infinity).</p>
6059
<p class="curve-singular-warning"><strong>Warning:</strong> this curve is singular.</p>
6160
<p class="composite-warning"><strong>Warning:</strong> <em>p</em> is not a prime.</p>
6261
</div>
6362
</div>
6463
</main>
64+
<footer>
65+
<p>This tool was created for <a href="http://andrea.corbellini.name/2015/05/17/elliptic-curve-cryptography-a-gentle-introduction/">Elliptic Curve Cryptography: a gentle introduction</a>.</p>
66+
<p>It's free software, released under the <a href="http://opensource.org/licenses/MIT">MIT license</a>, hosted on <a href="https://github.com/andreacorbellini/ecc">GitHub</a> and served by <a href="http://rawgit.com/">RawGit</a>.</p>
67+
</footer>
6568
<script type="text/javascript">
6669
$(function() {
6770
$.ec.curve = new $.ec.modk.PointAddition();

‎interactive/modk-mul.html

+5-2
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
<body>
1313
<header>
1414
<h1>Elliptic Curve scalar multiplication (&#120125;<sub>p</sub>)</h1>
15-
<p>A set of tools to play with elliptic curves in real and finite fields.</p>
1615
<nav>
1716
<ul>
1817
<li class="field">&#8477;</li>
@@ -55,14 +54,18 @@ <h1>Elliptic Curve scalar multiplication (&#120125;<sub>p</sub>)</h1>
5554
</div>
5655
</div>
5756
<div id="summary">
58-
<p>Scalar multiplication over the elliptic curve <span class="curve-equation"></span> in &#120125;/<span class="field-order"></span>.</p>
57+
<p>Scalar multiplication over the elliptic curve <span class="curve-equation"></span> in &#120125;/<sub class="field-order"></sub>.</p>
5958
<p>The curve has <span class="curve-order"></span> points (including the point at infinity).</p>
6059
<p>The subgroup generated by <em>P</em> has <span class="subgroup-order"></span> points.</p>
6160
<p class="curve-singular-warning"><strong>Warning:</strong> this curve is singular.</p>
6261
<p class="composite-warning"><strong>Warning:</strong> <em>p</em> is not a prime.</p>
6362
</div>
6463
</div>
6564
</main>
65+
<footer>
66+
<p>This tool was created for <a href="http://andrea.corbellini.name/2015/05/17/elliptic-curve-cryptography-a-gentle-introduction/">Elliptic Curve Cryptography: a gentle introduction</a>.</p>
67+
<p>It's free software, released under the <a href="http://opensource.org/licenses/MIT">MIT license</a>, hosted on <a href="https://github.com/andreacorbellini/ecc">GitHub</a> and served by <a href="http://rawgit.com/">RawGit</a>.</p>
68+
</footer>
6669
<script type="text/javascript">
6770
$(function() {
6871
$.ec.curve = new $.ec.modk.ScalarMultiplication();

‎interactive/reals-add.html

+4-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
<body>
1313
<header>
1414
<h1>Elliptic Curve point addition (&#8477;)</h1>
15-
<p>A set of tools to play with elliptic curves in real and finite fields.</p>
1615
<nav>
1716
<ul>
1817
<li class="field">&#8477;</li>
@@ -55,6 +54,10 @@ <h1>Elliptic Curve point addition (&#8477;)</h1>
5554
</div>
5655
</div>
5756
</main>
57+
<footer>
58+
<p>This tool was created for <a href="http://andrea.corbellini.name/2015/05/17/elliptic-curve-cryptography-a-gentle-introduction/">Elliptic Curve Cryptography: a gentle introduction</a>.</p>
59+
<p>It's free software, released under the <a href="http://opensource.org/licenses/MIT">MIT license</a>, hosted on <a href="https://github.com/andreacorbellini/ecc">GitHub</a> and served by <a href="http://rawgit.com/">RawGit</a>.</p>
60+
</footer>
5861
<script type="text/javascript">
5962
$(function() {
6063
$.ec.curve = new $.ec.reals.PointAddition();

‎interactive/reals-mul.html

+4-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212
<body>
1313
<header>
1414
<h1>Elliptic Curve scalar multiplication (&#8477;)</h1>
15-
<p>A set of tools to play with elliptic curves in real and finite fields.</p>
1615
<nav>
1716
<ul>
1817
<li class="field">&#8477;</li>
@@ -55,6 +54,10 @@ <h1>Elliptic Curve scalar multiplication (&#8477;)</h1>
5554
</div>
5655
</div>
5756
</main>
57+
<footer>
58+
<p>This tool was created for <a href="http://andrea.corbellini.name/2015/05/17/elliptic-curve-cryptography-a-gentle-introduction/">Elliptic Curve Cryptography: a gentle introduction</a>.</p>
59+
<p>It's free software, released under the <a href="http://opensource.org/licenses/MIT">MIT license</a>, hosted on <a href="https://github.com/andreacorbellini/ecc">GitHub</a> and served by <a href="http://rawgit.com/">RawGit</a>.</p>
60+
</footer>
5861
<script type="text/javascript">
5962
$(function() {
6063
$.ec.curve = new $.ec.reals.ScalarMultiplication();

0 commit comments

Comments
 (0)