Commit 39a13836 authored by Willem Sonke's avatar Willem Sonke

Continue with the redesign

I added an "About me" page and a page with publications. Also added a
rant about Windows 10.

For managing the overflowing bucket of CSS code, I finally switched to
Less.

Also I changed the layout again: the navigation bar is now blue. There
is a lot of stuff broken right now, but at least it looks reasonably
nice.
parent 7eab4c13
......@@ -34,6 +34,10 @@ preprocess do
end
compile '/static/css/layout.less' do
filter :less
end
compile '/subsites/**/*' do
end
......@@ -46,7 +50,7 @@ compile '/*/blog/**/*' do
if (item.identifier.to_s.end_with? ".html") || (item.identifier.to_s.end_with? ".md")
filter :erb
if item[:extension] == 'md'
filter :kramdown
filter :kramdown, :auto_ids => true
end
if item[:needs_highlighting]
filter :colorize_syntax, :default_colorizer => :pygmentsrb
......@@ -63,7 +67,7 @@ compile '/**/*' do
if (item.identifier.to_s.end_with? ".html") || (item.identifier.to_s.end_with? ".md")
filter :erb
if item[:extension] == 'md'
filter :kramdown
filter :kramdown, :auto_ids => true
end
if item[:needs_highlighting]
filter :colorize_syntax, :default_colorizer => :pygmentsrb
......@@ -77,6 +81,14 @@ compile '/**/*' do
end
route '/static/css/layout.less' do
'/static/css/layout.css'
end
route '/static/css/**/*' do
nil
end
route '/subsites/**/*' do
item.identifier.to_s.sub(/\A\/subsites/, '')
end
......
---
id: about-me
title: About me
layout: page
---
<p>Hi! My name is Willem Sonke.</p>
<%= render "/image.html", :url => "/static/img/willem.jpg", :description => "This is me!" %>
<p>I am currently pursuing a PhD at the <a href="http://www.win.tue.nl/aga">Applied Geometric Algorithms</a> group of the <a href="http://www.tue.nl">Eindhoven University of Technology</a> in The Netherlands.</p>
<p>I have several hobbies, including programming things for fun, making 3D animations, learning constructed languages and designing things.</p>
<h2>About this website</h2>
<p>This website is maintained using the static site generator <a href="http://nanoc.ws">Nanoc 4</a>. Contrary to most static site generators, Nanoc is really flexible &ndash; you can control exactly what happens when the site is generated. I think it is a great system.</p>
<p>The frontend is made using <a href="http://getbootstrap.com">Bootstrap</a> and <a href="http://lesscss.org">Less</a>. The font used is <a href="https://typekit.com/fonts/open-sans">Open Sans</a>.</p>
......@@ -4,9 +4,4 @@ title: Blog
layout: default
---
<div class="row">
<div class="col-xs-12">
<h1>Blog</h1>
</div>
</div>
<%= render "/postlist.html" %>
---
id: 2015-08-04-windows-inconsistent
title: Why is Windows so inconsistent?
kind: article
created_at: 2015-08-04 16:35
tags:
- random
---
A few days ago our family laptop was upgraded to Windows 10, coming from Windows 8.1. Let's have a look how well it works...
<!-- more -->
<div class="alert alert-warning"><b>Warning:</b> this article is a rant. Read at your own risk.</div>
I was really looking forward to Windows 10, since it was said that many strange Windows 8 features (that I wasn't really fond of) would be reverted, and because there would be new features. (Virtual desktops! Yay!) However, I was quite disappointed after I had tried it.
Bugs
----
I didn't really search for bugs; I bumped into several problems however. Cortana sometimes asks for your attention, but something isn't quite right there.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-user-name.png", :description => "How are you, Mr Name Surname?" %>
(By the way, Cortana had already asked me for my name, and I really just entered *Willem*.)
In general Cortana seems confused about interface texts. I have the feeling that translatable strings are mixed up somewhere.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-menu.png", :description => "I think the correct labels would read, from top to bottom: Menu, Home, Notebooks, Reminders, Feedback. The icons are correct, actually." %>
This also makes it rather hard to configure Cortana. In the settings panel all strings seem to have shifted one place.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-strange-menu.png", :description => "Note the Off label at the on/off switches." %>
The nastiest bug I saw was &ndash; ironically enough &ndash; in the *Snipping tool* that I used to make screenshots of the Start menu for this article. The problem seemed to be that the Start menu was supposed to open on the foreground, and the overlay of the *Snipping tool* tried to also open on the foreground. I couldn't even open a task manager window to kill the *Snipping tool*. Finally I needed to log off my session and log on again to solve it.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/clipping-tool-hang.jpg", :description => "Sorry for the bad quality, but the program used to make screenshots actually crashed." %>
Inconsistency
-------------
We should take into account that Windows 10 was only released one week ago. I suppose that the bugs I mentioned will be solved quickly. What I dislike much more about Windows 10 is that it is not consistent. In fact, not at all. The system doesn't feel like one thing: it seems like programs were created by separate teams that used completely different design guide lines &ndash; oh yeah, that actually was the case! Some programs are still &lsquo;old-fashioned&rsquo; applications with a normal desktop interface, while some programs look like the Metro apps from Windows 8, but then put inside a window.
Let's start with the *File Explorer*. Clicking with the right mouse button on a file results in a popup menu.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-file.png", :description => "No problems so far..." %>
But for some incomprehensible reason you get a menu that looks completely different when you click the path name instead of a file.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-address-bar.png", :description => "Distinct popup menus until now: 2." %>
And when you open a dropdown menu in the ribbon, you get a different one again. (Even the text rendering is different!)
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-ribbon.png", :description => "Distinct popup menus until now: 3." %>
And that was all in the *File Explorer* &ndash; a normal desktop application. If we look at a Metro application, we see a completely different type of menu.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/alarms-popup.png", :description => "Distinct popup menus until now: 4." %>
The shell also has its own share of popup menus, for example when clicking an item with the right mouse button.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/start-menu-popup.png", :description => "Distinct popup menus until now: 5." %>
Or when you click the little arrow behind *File Explorer* to open a sub menu. (It is very similar to the previous one, but for some reason this menu has a subtle shadow, and the other one doesn't. Also, the font is a bit smaller.)
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/start-menu-submenu.png", :description => "Distinct popup menus until now: 6." %>
Different topic: the system settings. Apparently, Microsoft thought it would be a good idea to make a Metro-style application for the settings. Okay, I understand that. But why did they leave the old desktop application in as well?
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/two-settings-windows.png", :description => "Moar inconsistency!" %>
Most stuff is configurable in both versions...
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/two-resolution-windows.png", :description => "Oh, nice, now you can set the screen resolution on two different places." %>
... but not all of them, like the window theme &ndash; you can only change that in the desktop version. And the privacy settings are only in the Metro version. Why? No idea. And then they think it's strange that people can't find stuff, right?
I'll stop here, although I could go on for ages about things like these. My opinion is probably clear by now, namely: I'm in a state of total confusion about why Microsoft thought that it would be a good idea to throw consistency out of the window.
......@@ -6,7 +6,6 @@ layout: default
<div class="row">
<div class="col-xs-12">
<h1>Constructed languages</h1>
<p>I am interested in <a href="http://en.wikipedia.org/wiki/Constructed_language">constructed languages</a>. Those are languages that did not evolve naturally, but are created deliberately.</p>
</div>
</div>
......
......@@ -4,20 +4,12 @@ title: Home
layout: default
index_page: true
---
<div class="row">
<div class="col-xs-12">
<h1>Wimiso</h1>
<div class="hidden-xs col-md-2">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-7">
<div class="col-xs-12 col-md-8">
<h2>Welcome</h2>
<p>Hello, and welcome to my site! On this site you can find some software projects I have created or worked on, some personal things and some other things you might find useful. Note that the website is not quite finished yet. I'm still experimenting with the design, and I'm also still adding new content.</p>
</div>
<div class="col-xs-12 col-md-1">
</div>
<div class="col-xs-12 col-md-4">
<h2>About me</h2>
<p>My name is Willem Sonke and I currently study Computer Science and Engineering at the <a href="http://www.tue.nl">Eindhoven University of Technology</a> in The Netherlands.</p>
</div>
</div>
---
id: publications
title: Publications
layout: page
toc: true
---
<div class="row">
<div class="col-xs-12">
<p>On this page, you can find my publications.</p>
<h2>Journals</h2>
<ul>
<li>
<b>Mosaic drawings and cartograms</b><br>
R. G. Cano, K. Buchin, T. Castermans, A. Pieterse, W. Sonke and B. Speckmann<br>
<i>Computer Graphics Forum</i>, 34(3), 2015<br>
(Proc. Eurographics / VGTC Conference on Visualization (EuroVis) 2015)<br>
<div class="publication-abstract">
<span class="publication-abstract-header">Abstract</span>
<p class="publication-abstract-text">Cartograms visualize quantitative data about a set of regions such as countries or states. There are several different types of cartograms and &ndash; for some &ndash; algorithms to automatically construct them exist. We focus on <i>mosaic cartograms</i>: cartograms that use multiples of simple tiles &ndash; usually squares or hexagons &ndash; to represent regions. Mosaic cartograms communicate well data that consist of, or can be cast into, small integer units (for example, electorial college votes). In addition, they allow users to accurately compare regions and can often maintain a (schematized) version of the input regions' shapes. We propose the first fully automated method to construct mosaic cartograms. To do so, we first introduce <i>mosaic drawings</i> of triangulated planar graphs. We then show how to modify mosaic drawings into mosaic cartograms with low cartographic error while maintaining correct adjacencies between regions. We validate our approach experimentally and compare to other cartogram methods.</p>
</div>
</li>
</ul>
<h2>Weakly refereed conference proceedings</h2>
<ul>
<li>
<b>Mosaic drawings and cartograms</b><br>
R. G. Cano, K. Buchin, T. Castermans, A. Pieterse, W. Sonke and B. Speckmann<br>
<i>Abstr. 31st European Workshop on Computational Geometry (EuroCG), 2015</i>
</li>
</ul>
</div>
</div>
---
id: research
title: Research
layout: default
layout: page
toc: true
---
<div class="row">
<div class="col-xs-12">
<h1>Research</h1>
<p>This page is under construction...</p>
</div>
</div>
<p>I am currently pursuing a PhD at the <a href="http://www.win.tue.nl/aga">Applied Geometric Algorithms</a> group of the <a href="http://www.tue.nl">Eindhoven University of Technology</a> in The Netherlands. On this page you can get an impression on what I'm working on.</p>
<h2 id="mosaic-maps">Mosaic maps</h2>
<p>A cartogram is a type of thematic map. Let's say that we want to make a cartogram depicting the population of countries. The idea is that countries with many inhabitants become large on the map, and countries with only few inhabitants become small. Hence, the area of a region corresponds to its population.</p>
<p>There are many methods to make cartograms, that all have different properties. Since the areas of the regions need to be changed, every method must distort the shapes of the regions in some way. Some methods leave the detailed shapes intact but deform them to get the right areas. Other methods replace the regions entirely by simple shapes like rectangles.</p>
<p>Together with Bettina Speckmann, Kevin Buchin, Thom Castermans, Astrid Pieterse and Rafael Cano, I looked at another way to make cartograms, that we call <i>mosaic maps</i>. For such a cartogram we use a hexagonal grid (as used by several games, like Settlers of Catan). We represent every region on the map by a group of hexagonal tiles. To get a proper cartogram, we need the areas to correspond to the population. But the area of a region is just its number of tiles. So, for example, every hexagon could represent 2 million inhabitants. The advantage of such a method is that the number of hexagons per region can be counted, so that viewers can obtain the population count more precisely than by just guessing the area.</p>
<p>We found a way to create mosaic maps like these automatically using a two-step process. First we create a mosaic map that does not respect the regions' shapes at all: we only care for the correct connections between regions. So, if Germany borders Switzerland in the original map, we require that their groups of hexagons also touch. In the second step, we refine the drawing bit by bit by taking into account the desired shapes and sizes, until we get a nice drawing.</p>
......@@ -3,8 +3,6 @@ id: graduates-viewer
title: Visualisatie van afgestudeerden
---
<h1>Visualisatie van afgestudeerden</h1>
<p><a href="http://denvelop.nl">Thom Castermans</a> en ik hebben een visualisatie gemaakt waarmee je kunt zien hoeveel studenten er zijn afgestudeerd aan de universiteiten in Nederland. Dit was een project voor een vak over Visualisatie.</p>
<p>De visualisatie is <a href="http://graduates.wimiso.nl">hier</a> te vinden.</p>
......@@ -3,6 +3,4 @@ id: applet-creator
title: Applet Creator
---
<h1>Applet Creator</h1>
<p>... (te doen)</p>
......@@ -4,10 +4,4 @@ title: Blog
layout: default
---
<div class="row">
<div class="col-xs-12">
<h1>Blog</h1>
<p>Op deze blog schrijf ik over dingen die ik gemaakt heb of dingen die ik meegemaakt heb.</p>
</div>
</div>
<%= render "/postlist.html" %>
\ No newline at end of file
---
id: 2015-08-04-windows-inconsistent
title: Waarom is Windows zo inconsistent?
kind: article
created_at: 2015-08-04 16:35
tags:
- random
---
Een paar dagen geleden hebben we op onze gezinslaptop de upgrade naar Windows 10 gekregen, vanaf Windows 8.1. Tijd om eens te kijken hoe goed dat werkt...
<!-- more -->
<div class="alert alert-warning"><b>Waarschuwing:</b> dit artikel is wellicht niet geheel objectief. Lees het op eigen risico.</div>
Ik was erg benieuwd naar Windows 10, omdat er beloofd werd dat veel rare dingen van Windows 8 (waar ik niet echt een fan van was) weer zouden worden teruggedraaid, en vanwege de nieuwe functies. (Virtuele bureaubladen! Hoera!) Ik was echter nogal teleurgesteld toen ik het had uitgeprobeerd.
Bugs
----
Ik heb echt niet lang zitten te zoeken naar bugs of zo; toch ben ik tegen meerdere problemen aangelopen. Cortana vraagt soms om je aandacht, maar daar gaat iets mis.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-user-name.png", :description => "Hoe gaat het, Voornaam Achternaam?" %>
(Overigens vroeg Cortana me al eerder om mijn naam, en toen heb ik gewoon *Willem* ingevuld.)
Cortana lijkt in het algemeen nogal in de war te zijn met interface-teksten. Ik heb het idee dat er ergens vertaalbare strings zijn omgewisseld.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-menu.png", :description => "Volgens mij zou er van boven naar beneden zoiets als dit moeten staan: Menu, Home, Notebooks, Reminders, Feedback. De icoontjes staan wel goed." %>
Dit zorgt er ook voor dat het nogal lastig is om Cortana te configureren. In het instellingenpaneel lijken alle strings één plaatsje te zijn opgeschoven.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/cortana-strange-menu.png", :description => "Let op het label Off bij de aan/uit-schakelaars." %>
De vervelendste bug zat &ndash; grappig genoeg &ndash; in de *Snipping tool* waarmee ik screenshots aan het maken was van het Start-menu. Het probleem leek te zijn dat het Start-menu op de voorgrond wilde blijven en de overlay van de *Snipping tool* ook. Ik kon niet eens bij een taakbeheer-venster komen om de *Snipping tool* te beëindigen. Uiteindelijk moest ik mijn sessie afmelden en opnieuw aanmelden om het op te lossen.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/clipping-tool-hang.jpg", :description => "Sorry voor de slechte kwaliteit, maar het gaat hier om een crash van het programma om screenshots te maken..." %>
Inconsistenties
---------------
Laten we er rekening mee houden dat Windows 10 pas een week uit is. Ik ga ervan uit dat deze bugs binnenkort wel zullen worden opgelost. Wat ik zelf veel irritanter vind, is dat Windows 10 in het geheel niet consistent is. Het systeem voelt niet aan als één geheel: het lijkt net alsof programma's gemaakt zijn door verschillende teams die compleet andere ontwerprichtlijnen hanteerden &ndash; o ja, dat is ook zo. Sommige programma's zijn nog &lsquo;ouderwetse&rsquo; applicaties met een normale desktop-interface, terwijl sommige programma's eruitzien als de Metro-apps uit Windows 8, maar dan in een venster.
We beginnen eens bij de *File Explorer*. Als je met de rechtermuisknop op een bestand klikt, krijg je een popup-menu.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-file.png", :description => "Tot zover is er geen probleem..." %>
Maar om een mij onbegrijpelijke reden krijg je een compleet anders uitziend popup-menu als je op de padnaam klikt.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-address-bar.png", :description => "Verschillende popup-menu's tot nu toe: 2." %>
En als je in het lint op een dropdown-menu klikt, krijg je weer een andere. (Zelfs de tekst-rendering is verschillend!)
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/file-explorer-popup-ribbon.png", :description => "Verschillende popup-menu's tot nu toe: 3." %>
En dat was alleen nog maar de *File Explorer* &ndash; een normale desktop-applicatie. Als we naar een Metro-applicatie kijken, krijgen we nog een compleet ander soort menu.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/alarms-popup.png", :description => "Verschillende popup-menu's tot nu toe: 4." %>
De shell heeft nog een paar andere popup-menu's voor ons, bijvoorbeeld als je met de rechtermuisknop op een item klikt.
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/start-menu-popup.png", :description => "Verschillende popup-menu's tot nu toe: 5." %>
Of als je op het pijltje achter *File Explorer* klikt om een submenu te openen. (Die lijkt veel op de vorige, maar deze heeft om de een of andere reden een subtiele schaduw, en de vorige niet. Het lettertype is ook een puntje kleiner.)
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/start-menu-submenu.png", :description => "Verschillende popup-menu's tot nu toe: 6." %>
Ander onderwerp: de systeem-instellingen. Microsoft dacht blijkbaar dat het een goed idee was om een Metro-applicatie voor de instellingen te maken. Goed, dat snap ik. Maar waarom hebben ze ook de oude desktop-applicatie laten staan?
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/two-settings-windows.png", :description => "Nog meer inconsistentie!" %>
De meeste dingen zijn instelbaar in beide versies...
<%= render "/image.html", :url => "/static/img/2015-08-04-windows-inconsistent/two-resolution-windows.png", :description => "Handig, je kunt nu de schermresolutie op twee plaatsen instellen." %>
... maar sommige dingen niet, zoals het thema van de vensters &ndash; dat kan alleen in de desktop-versie. En de privacy-instellingen zitten alleen in de Metro-versie. Waarom? Geen idee. En het dan raar vinden dat mensen dingen niet kunnen vinden, hè.
Ik stop hier maar eens, alhoewel ik nog uren door kan zeuren over dit soort dingen. Mijn mening moge duidelijk zijn, namelijk totale verwarring over waarom Microsoft dacht dat het een goed idee was om consistentie volledig overboord te gooien.
......@@ -3,9 +3,6 @@ id: contact
title: Contact
---
Contact
=======
Wil je me bereiken, dan kun je de volgende methoden gebruiken.
E-mail
......
......@@ -6,14 +6,10 @@ index_page: true
---
<div class="row">
<div class="col-xs-12 col-md-7">
<div class="hidden-xs col-md-2">
</div>
<div class="col-xs-12 col-md-8">
<h2>Welkom</h2>
<p>Hallo, en welkom op mijn site! Op deze site kun je softwareprojecten vinden die ik heb gemaakt, wat persoonlijke dingen, en wat andere dingen die je misschien nuttig vindt. Merk op dat de website nog niet helemaal klaar is. Ik ben nog aan het experimenteren met de opmaak, en ik moet ook nog wat inhoud toevoegen.</p>
</div>
<div class="col-xs-12 col-md-1">
</div>
<div class="col-xs-12 col-md-4">
<h2>Over mij</h2>
<p>Ik heet Willem Sonke en momenteel studeer ik informatica aan de <a href="http://www.tue.nl">Technische Universiteit Eindhoven</a>.</p>
</div>
</div>
......@@ -3,8 +3,6 @@ id: joxy
title: Joxy
---
<h1>Joxy</h1>
<p>Gebruik je Java-programma's onder KDE (een bureaubladomgeving voor &ndash; voornamelijk &ndash; Linux), dan heb je vast gemerkt dat het uiterlijk van die programma's niet overeenkomt met dat van KDE. KDE's standaard-stijl is Oxygen, terwijl de standaard-stijl van Java-programma's Metal heet en er compleet anders uitziet. Gelukkig is daar wel iets aan te doen, want Java ondersteunt zelfgemaakte thema's (in Java-terminologie <i>look-and-feels</i>).</p>
<p>Joxy is een look-and-feel die Thom Castermans en ik hebben gemaakt. Joxy probeert zo goed mogelijk om KDE's Oxygen-thema na te doen, zodat Java-programma's beter integreren in KDE.</p>
......
......@@ -6,7 +6,6 @@ layout: default
<div class="row">
<div class="col-xs-12">
<h1>Kunsttalen</h1>
<p>Ik ben geïnteresseerd in <a href="http://nl.wikipedia.org/wiki/Kunsttaal">kunsttalen</a>. Dat zijn talen die niet natuurlijkerwijs zijn geëvolueerd, maar die met opzet geconstrueerd zijn.</p>
</div>
</div>
......
......@@ -6,7 +6,6 @@ layout: default
<div class="row">
<div class="col-xs-12">
<h1>Onderzoek</h1>
<p>Inhoud volgt binnenkort...</p>
</div>
</div>
---
id: about-me
title: Over mij
layout: page
---
<p>Hoi! Ik heet Willem Sonke.</p>
<%= render "/image.html", :url => "/static/img/willem.jpg", :description => "Dit ben ik!" %>
<p>Ik ben momenteel aan het promoveren aan de vakgroep <a href="http://www.win.tue.nl/aga">Applied Geometric Algorithms</a> van de <a href="http://www.tue.nl">Technische Universiteit Eindhoven</a>.</p>
<p>Daarnaast heb ik behoorlijk wat hobby's, waaronder dingen programmeren voor de lol, 3D-animaties maken, geconstrueerde talen leren en dingen ontwerpen.</p>
<h2>Over deze website</h2>
<p>Ik onderhoud deze website met de statische-website-generator <a href="http://nanoc.ws">Nanoc 4</a>. In tegenstelling tot de meeste site-generatoren, is Nanoc erg flexibel &ndash; je kunt precies bepalen wat er moet gebeuren tijdens iedere stap van het genereren van de website. Ik vind het een prachtig systeem.</p>
<p>De frontend is gemaakt met <a href="http://getbootstrap.com">Bootstrap</a> en <a href="http://lesscss.org">Less</a>. Het gebruikte lettertype is <a href="https://typekit.com/fonts/open-sans">Open Sans</a>.</p>
......@@ -3,8 +3,6 @@ id: ti-programs
title: TI-84+-programma's
---
<h1>Programma's voor de TI-84+</h1>
<p>Op deze pagina staan enkele programma's die ik gemaakt heb voor de TI-84+, een grafische rekenmachine. De meeste werken waarschijnlijk ook op de TI-83+, maar dat heb ik niet getest.</p>
<p>Ik heb de programma's een paar jaar geleden geschreven, vooral in pauzes tussen lessen. Ik heb ze vaak niet geschreven met de bedoeling om ze te verspreiden. Dat betekent dat de code-stijl nogal waardeloos is (maar dat is ook onvermijdelijk met TI-Basic). Je kunt de programma's overzetten naar je rekenmachine met TI Connect, de software die bij de rekenmachine hoort, of met het vrije-software-alternatief <a href="http://lpg.ticalc.org/prj_tilp">TiLP</a>.
......
// the title block
#title {
background-color: darken(@color-primary, @darken-amount);
}
#title-inner {
margin: 0 auto;
padding: 20px @content-margin;
width: @content-width;
background-color: @color-primary;
}
// the content block
#content {
background-color: darken(@color-background, @darken-amount);
}
#content-inner {
margin: 0 auto;
padding: 20px @content-margin;
width: @content-width;
background-color: @color-background;
.clearfix();
}
@blog-line-width: 2px;
@blog-blob-size: 12px;
.blog-message-date {
width: 15%;
text-align: right;
color: @color-primary;
position: relative;
font-weight: bold;
padding-top: 10px;
float: left;
padding: 0 15px;
padding-top: 8px;
}
.blog-message-tags {
float: right;
color: @color-primary;
padding-left: 20px;
padding-bottom: 4px;
font-style: italic;
}
.blog-message-body {
position: relative;
float: left;
width: 85%;
padding: 0 15px;
padding-top: 10px;
border-left: @blog-line-width @color-primary solid;
/* put some padding between posts, but not below the last post */
padding-top: 10px;
padding-bottom: 20px;
.container .row:last-child & {
padding-bottom: 0px;
}
}
.blog-message-title {
font-weight: bold;
margin-bottom: 0px;
font-size: 110%;
margin-top: -2px;
}
.blog-blob {
position: absolute;
top: -2px + 10px + .5 * @blog-blob-size;
left: 0;
width: @blog-blob-size;
height: @blog-blob-size;
margin-left: -.5 * @blog-blob-size - .5 * @blog-line-width;
border-radius: 50%;
background: @color-primary;
border: 2px white solid;
}
{
"always-semicolon": true,
"block-indent": 2,
"color-case": "lower",
"color-shorthand": true,
"element-case": "lower",
"eof-newline": true,
"leading-zero": false,
"remove-empty-rulesets": true,
"space-after-colon": 1,
"space-after-combinator": 1,
"space-before-selector-delimiter": 0,
"space-between-declarations": "\n",
"space-after-opening-brace": "\n",
"space-before-closing-brace": "\n",
"space-before-colon": 0,
"space-before-combinator": 1,
"space-before-opening-brace": 1,
"strip-spaces": true,
"unitless-zero": true,
"vendor-prefix-align": true,
"sort-order": [
[
"position",
"top",
"right",
"bottom",
"left",
"z-index",
"display",
"float",
"width",
"min-width",
"max-width",
"height",
"min-height",
"max-height",
"-webkit-box-sizing",
"-moz-box-sizing",
"box-sizing",
"-webkit-appearance",
"padding",
"padding-top",
"padding-right",
"padding-bottom",
"padding-left",
"margin",
"margin-top",
"margin-right",
"margin-bottom",
"margin-left",
"overflow",
"overflow-x",
"overflow-y",
"-webkit-overflow-scrolling",
"-ms-overflow-x",
"-ms-overflow-y",
"-ms-overflow-style",
"clip",
"clear",
"font",
"font-family",
"font-size",
"font-style",
"font-weight",
"font-variant",
"font-size-adjust",
"font-stretch",
"font-effect",
"font-emphasize",
"font-emphasize-position",
"font-emphasize-style",
"font-smooth",
"-webkit-hyphens",
"-moz-hyphens",
"hyphens",
"line-height",
"color",
"text-align",
"-webkit-text-align-last",
"-moz-text-align-last",
"-ms-text-align-last",
"text-align-last",
"text-emphasis",
"text-emphasis-color",
"text-emphasis-style",
"text-emphasis-position",
"text-decoration",
"text-indent",
"text-justify",
"text-outline",
"-ms-text-overflow",
"text-overflow",
"text-overflow-ellipsis",
"text-overflow-mode",
"text-shadow",
"text-transform",
"text-wrap",
"-webkit-text-size-adjust",
"-ms-text-size-adjust",
"letter-spacing",
"-ms-word-break",
"word-break",
"word-spacing",
"-ms-word-wrap",
"word-wrap",
"-moz-tab-size",
"-o-tab-size",
"tab-size",
"white-space",
"vertical-align",
"list-style",
"list-style-position",
"list-style-type",
"list-style-image",
"pointer-events",
"-ms-touch-action",
"touch-action",
"cursor",
"visibility",
"zoom",
"flex-direction",
"flex-order",
"flex-pack",
"flex-align",
"table-layout",
"empty-cells",
"caption-side",
"border-spacing",
"border-collapse",
"content",
"quotes",
"counter-reset",
"counter-increment",
"resize",
"-webkit-user-select",
"-moz-user-select",
"-ms-user-select",
"-o-user-select",
"user-select",
"nav-index",
"nav-up",
"nav-right",
"nav-down",
"nav-left",
"background",
"background-color",
"background-image",
"-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient",
"filter:progid:DXImageTransform.Microsoft.gradient",
"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
"filter",
"background-repeat",
"background-attachment",
"background-position",
"background-position-x",
"background-position-y",
"-webkit-background-clip",
"-moz-background-clip",
"background-clip",