basic: add pics for basic pages

git-svn-id: svn+ssh://atelier.inf.usi.ch/home/bevilj/group-1@256 a672b425-5310-4d7a-af5c-997e18724b81

site/pages/cmd/basic/0-openshell.html

@@ -13,31 +13,29 @@ There are mainly two ways to access to the terminal on a MacOS system.
 
 <h3>Through the Finder</h3>
 
+<img src="{{ site.baseurl }}/assets/cmd/basic/open-from-finder.png" width="80%" alt="Open from Finder" />
+
 <ol>
   <li>Open a new <i>Finder</i> window by clicking on the icon on the system dock.</li>
-  <img src="" alt="Open Finder" />
   <li>On the menu bar, click on <i>Go</i>.</li>
-  <img src="" alt="Click on Go" />
   <li>Click on <i>Utilities</i>.</li>
-  <img src="" alt="Click on Utilities" />
   <li>Look for <i>Terminal</i> and click on it.</li>
-  <img src="" alt="Open Terminal" />
 </ol>
 
+<img src="{{ site.baseurl }}/assets/cmd/basic/open-from-spotlight.png" width="80%" alt="Open from Finder" />
+
 <h3>Through <i>Spotlight</i></h3>
 <ol>
   <li>You can use the shortcut <code>cmd+space</code> to access to <i>Spotlight</i>.</li>
-  <img src="" alt="Access to Spotlight" />
   <li>Then search for <i>Terminal</i>.</li>
-  <img src="" alt="Search Terminal" />
   <li>Click on the <i>Terminal</i> icon displayed as result.</li>
-  <img src="" alt="Open Terminal" />
 </ol>
 
-As you open the Terminal, a new blank window opens:
+<img src="{{ site.baseurl }}/assets/cmd/basic/terminal.png" width="80%" alt="Terminal" />
 
-<img src="" alt="Terminal Blank Window" />
+<h3>The terminal</h3>
 
+As you open the Terminal, a new blank window opens:<br>
 You can notice that the top lines in the window follow this structure:
 
 <pre>

site/pages/cmd/basic/1-terminal-toolbar.html

@@ -17,7 +17,7 @@ that could be very useful once you have become familiar with the program.
 
 <h3>Terminal</h3>
 
-<img src="" alt="Terminal section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-terminal.png" width="30%" alt="Open from Finder" />
 
 <ul>
     <li><b>Secure Keyboard Entry</b>:
@@ -49,9 +49,9 @@ that could be very useful once you have become familiar with the program.
 
 <h3>Shell</h3>
 
-<img src="" alt="Shell section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-shell.png" width="30%" alt="Open from Finder" />
 
-  <ul>
+<ul>
     <li><b>New Window</b>: It creates a new window.</li>
     <li><b>New Tab</b>: It creates a new tab</li>
     <li><b>Close window</b>: This option closes the window without quitting the terminal.</li>
@@ -77,11 +77,11 @@ that could be very useful once you have become familiar with the program.
         The text must be selected by holding down the touchpad and then moving the mouse cursor.
     </li>
     <li><b>Print</b>: This options prints all the content of the shell.</li>
-  </ul>
+</ul>
 
 <h3>Edit</h3>
 
-<img src="" alt="Edit section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-edit.png" width="30%" alt="Open from Finder" />
 
 <ul>
     <li><b>Undo</b>: Undo the last input action.</li>
@@ -116,7 +116,7 @@ that could be very useful once you have become familiar with the program.
 
 <h3>View</h3>
 
-<img src="" alt="View section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-view.png" width="30%" alt="Open from Finder" />
 
  <ul>
     <li><b>Show All Tabs</b>:
@@ -152,7 +152,7 @@ that could be very useful once you have become familiar with the program.
 
 <h3>Window</h3>
 
-<img src="" alt="Window section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-window.png" width="30%" alt="Open from Finder" />
 
 <ul>
     <li><b>Minimise</b>: It reduces the terminal to an icon.</li>
@@ -170,7 +170,7 @@ that could be very useful once you have become familiar with the program.
 
 <h3>Help</h3>
 
-<img src="" alt="Help section" height="">
+<img src="{{ site.baseurl }}/assets/cmd/basic/bar-help.png" width="30%" alt="Open from Finder" />
 
 <ul>
     <li><b>Terminal Help</b>: