diff options
Diffstat (limited to 'screenshots.html')
| -rw-r--r-- | screenshots.html | 38 |
1 files changed, 20 insertions, 18 deletions
diff --git a/screenshots.html b/screenshots.html index a189799..2b59fc5 100644 --- a/screenshots.html +++ b/screenshots.html @@ -21,10 +21,12 @@ </ul> - <img id="logo" src="json.png" alt="JaSON, the Argonaut" title="JaSON, the Argonaut" /> <div id="content"> - <h1>json – JSON implementation for Ruby</h1> + <h1> + <img style="float: left; margin-right: 32px;" id="logo" src="json_logo.png" alt="JSON Logo" title="JSON Logo" /> + <span style="float: left; margin-top: 16px;">JSON implementation for Ruby</span> + </h1> <h2>Screenshots</h2> <p>Here are some Screenshots from the graphical JSON Editor @@ -32,65 +34,65 @@ working installation of <a href="http://ruby-gnome2.sourceforge.jp/">Ruby GTK2</a> is necessary.</p> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="edit_json.png"> - <img src="edit_json.png" width="400" height="300" alt="Screenshot #1" /> + <img src="edit_json.png" width="80%" alt="Screenshot #1" /> </a> <br /> <span class="caption">Screenshot #1 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_array.png"> - <img src="diagrams/JSON_array.png" width="400" height="300" alt="Screenshot #2" /> + <img src="diagrams/JSON_array.png" width="80%" alt="Screenshot #2" /> </a> <br /> <span class="caption">Screenshot #2 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_float.png"> - <img src="diagrams/JSON_float.png" width="400" height="300" alt="Screenshot #3" /> + <img src="diagrams/JSON_float.png" width="80%" alt="Screenshot #3" /> </a> <br /> <span class="caption">Screenshot #3 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_integer.png"> - <img src="diagrams/JSON_integer.png" width="400" height="300" alt="Screenshot #4" /> + <img src="diagrams/JSON_integer.png" width="80%" alt="Screenshot #4" /> </a> <br /> <span class="caption">Screenshot #4 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_object.png"> - <img src="diagrams/JSON_object.png" width="400" height="300" alt="Screenshot #5" /> + <img src="diagrams/JSON_object.png" width="80%" alt="Screenshot #5" /> </a> <br /> <span class="caption">Screenshot #5 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON.png"> - <img src="diagrams/JSON.png" width="400" height="300" alt="Screenshot #6" /> + <img src="diagrams/JSON.png" width="80%" alt="Screenshot #6" /> </a> <br /> <span class="caption">Screenshot #6 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_string.png"> - <img src="diagrams/JSON_string.png" width="400" height="300" alt="Screenshot #7" /> + <img src="diagrams/JSON_string.png" width="80%" alt="Screenshot #7" /> </a> <br /> <span class="caption">Screenshot #7 (Click to enlarge)</span> </div> - <div style="text-align: center"> + <div style="text-align: center; padding: 20px;"> <a href="diagrams/JSON_value.png"> - <img src="diagrams/JSON_value.png" width="400" height="300" alt="Screenshot #8" /> + <img src="diagrams/JSON_value.png" width="80%" alt="Screenshot #8" /> </a> <br /> <span class="caption">Screenshot #8 (Click to enlarge)</span> |