layout tweaks for mac instructions

Author: leematos

app/views/install_steps/config_virtualenv.html.erb

@@ -4,40 +4,44 @@
 
   <ol>
     <li>
-      <p>Run <code>mkdir ~/Envs</code> in the terminal</p>
+      <p>In your terminal run the following command:
+         <pre><code>mkdir ~/Envs</code></pre></p>
       <p>This makes a folder in our home directory that we’ll use to store our venvs.</p>
     </li>
     <li>
-      <p><code>export WORKON_HOME=~/Envs</code></p>
+      <p>Then run:</p>
+      <pre><code>export WORKON_HOME=~/Envs</code></pre>
       <p>This says that we have set our virtualenvs to live in our home directory in a folder called Envs.</p>
     </li>
     <li>
       <p>Next we’ll tell our computer where to find python3 (which has our virtualenv software that we installed via pip3).</p>
-      <p><code>export VIRTUALENVWRAPPER_PYTHON=”$(command \which python3)”</code></p>
+      <pre><code>export VIRTUALENVWRAPPER_PYTHON="$(command \which python3)"</code></pre>
     </li>
     <li>
       <p>Then we can run the last command telling our computer how to set up virtualenv.</p>
-      <p><code>source /usr/local/bin/virtualenvwrapper.sh</code></p>
+      <pre><code>source /usr/local/bin/virtualenvwrapper.sh</code></pre>
       <p>If successful the output should look like this</p>
       <%= image_tag "mac_steps/config_virtualenv_terminal.png", class: "img-responsive" %>
     </li>
     <li>
       <p>Now we can go ahead and make this permanent.</p>
-      <p>Run, <code>touch ~/.bash_profile</code>.</p>
-      <p>Then, <code>open ~/.bash_profile</code>.</p>
+      <p>Run:</p> 
+      <pre><code>touch ~/.bash_profile</code>.</pre>
+      <p>Then:</p>
+      <pre> <code>open ~/.bash_profile</code>.</pre>
       <p>This should open a text editor for you to paste the following into that file. NOTICE NO QUOTES ON THE VIRTUALENV LINE.</p>
       <p>
-        <pre>export WORKON_HOME=~/Envs
+        <pre><code>export WORKON_HOME=~/Envs
 export VIRTUALENVWRAPPER_PYTHON=$(command \which python3)
-source /usr/local/bin/virtualenvwrapper.sh</pre>
+source /usr/local/bin/virtualenvwrapper.sh</code></pre>
       </p>
       <p>Save the file and close the editor. To make sure it worked, we will need to close terminal.app as well and re-open it.</p>
     </li>
     <li>
       <p>To test our work, run:</p>
-      <p><code>echo $VIRTUALENVWRAPPER_PYTHON</code></p>
+      <pre><code>echo $VIRTUALENVWRAPPER_PYTHON</code></pre>
       <p>This will read from the variable we set, if you see</p>
-      <p><samp>usr/local/bin/python3</samp></p>
+      <pre><code>usr/local/bin/python3</code></pre>
       <p>You are set!</p>
     </li>
   </ol>

app/views/install_steps/getting_git.html.erb

@@ -3,13 +3,13 @@
   <ol>
     <li>
       <p>In your terminal type</p>
-      <p><code>brew install git</code></p>
+      <pre><code>brew install git</code></pre>
     </li>
     <li>
       <p>To verify your installation, in your terminal type</p>
-      <p><code>git --version</code></p>
+      <pre><code>git --version</code></pre>
       <p>Approximate expected result</p>
-      <p><code>git version 2.x.x</code></p>
+      <pre><code>git version 2.x.x</code></pre>
     </li>
   </ol>
 </section>

app/views/install_steps/install_python.html.erb

@@ -3,16 +3,16 @@
   <ol>
     <li>
       <p>Next we get python 3 using brew. Type the following into your terminal</p>
-      <p><code>brew install python3</code></p>
+      <pre><code>brew install python3</code></pre>
       <p>When that’s finished, you should see a screen like this</p>
       <%= image_tag 'mac_steps/python_terminal_install.png', class: "img-responsive" %>
       <p>Notice the <samp>==> Summary line</samp>, that shows we are done and it worked!</p>
     </li>
     <li>
       <p>Let’s test python3 now by checking the version. In your terminal run the following to check the version</p>
-      <p><code>Python3 --version</code></p>
+      <pre><code>Python3 --version</code></pre>
       <p>It should return</p>
-      <p><samp>Python 3.x.x</samp></p>
+      <pre><code>Python 3.x.x</code></pre>
       <p>If you get that, we’ve confirmed Python 3 is installed and able to be used by your user! Woo!</p>
     </li>
   </ol>

app/views/install_steps/test_virtualenv.html.erb

@@ -3,13 +3,13 @@
   <ol>
     <li>
       <p>Lets make a virtualenv. To do this we can now use the commands that we just finished enabling.</p>
-      <p><code>mkvirtualenv test-venv</code></p>
+      <pre><code>mkvirtualenv test-venv</code></pre>
       <%= image_tag "mac_steps/testing_virtualenv_terminal.png", class: "img-responsive" %>
     </li>
     <li>
       <p>Take a look at your prompt after you run the command. It shows you that you are in the virtualenv <samp>(test-venv)</samp>.</p>
       <p>If we close the terminal and reopen, your prompt no longer shows you are in the test-venv. To get back into it, you’ll need to use the workon command</p>
-      <p><code>workon test-venv</code></p>
+      <pre><code>workon test-venv</code></pre>
       <p>THIS IS IMPORTANT. You will forget at some point to run that command, and it will cause errors like “package not found” or “can’t load x” because you aren’t in the right environment. :)</p>
     </li>
   </ol>

app/views/install_steps/using_pip.html.erb

@@ -1,18 +1,19 @@
 <section class="instructions">
   <h1>Using Pip</h1>
-  <p>Earlier, we installed Homebrew, which is a system-level package manager that lets us install software that our Mac uses. Pip is a programming-language-level package manager that lets us install python code that we can use in our projects. We are going to use Pip now to install two very helpful libraries, virtualenv and virtualenv-wrapper which makes working with virtualenv easier.</p>
-  <p>A word on Virtualenv. This piece of software allows us to make isolated environments so that we don’t run into version conflicts while programming. Each one is completely separate and allows you to code knowing that you have a safe place to work.</p>
+  <p>Earlier, we installed Homebrew, which is a system-level package manager that lets us install software that our Mac uses. Pip is a programming-language-level package manager that lets us install python code that we can use in our projects. </p>
+<p>We are going to use Pip now to install two very helpful libraries, virtualenv and virtualenv-wrapper which makes working with virtualenv easier.</p>
+  <h2>A quick word on Virtualenv.</h2><p> This piece of software allows us to make isolated environments so that we don’t run into version conflicts while programming. Each one is completely separate and allows you to code knowing that you have a safe place to work.</p>
 
   <ol>
     <li>
       <p>To install virtualenv we can run</p>
-      <p><code>pip3 install virtualenv</code></p>
+      <pre><code>pip3 install virtualenv</code></pre>
       <p>The output should look like this</p>
       <%= image_tag "mac_steps/virtualenv_terminal_install.png", class: "img-responsive" %>
     </li>
     <li>
       <p>Then we can grab virtualenv-wrapper</p>
-      <p><code>pip3 install virtualenvwrapper</code></p>
+      <pre><code>pip3 install virtualenvwrapper</code></pre>
       <p>This is what the output should look like</p>
       <%= image_tag "mac_steps/virtualenvwrapper_terminal_install.png", class: "img-responsive"  %>
       <p>Great! Now we have all python tools we need to finish out our python environment. Let’s set up the last pieces, which may prove a little challenging. Don’t get discouraged!</p>

app/views/install_steps/verify_python.html.erb

@@ -3,18 +3,18 @@
   <ol>
     <li>
       <p>Let’s verify where Python is installed by running the following command</p>
-      <p><code>which python 3</code></p>
+      <pre><code>which python3</code></pre>
       <p>If the output says <samp>/usr/local/bin</samp>, we are set!</p>
       <p>If the output says <samp>/Library/Frameworks</samp> we have to make some changes.</p>
     </li>
     <li>
       <p>You’ll need to open your bash profile by running the following</p>
-      <p><code>open ~/.bash_profile</code></p>
+      <pre><code>open ~/.bash_profile</code></pre>
       <p>Then you’ll need to remove the two lines that start with</p>
       <p><samp>PATH=”/Library/Frameworks/</samp></p>
       <p><samp>export PATH</samp></p>
       <p>Save the file. We’ll check our work by opening terminal and typing,</p>
-      <p><code>which python</code></p>
+      <pre><code>which python</code></pre>
       <p>If we see,</p>
       <p><samp>/usr/local/bin</samp></p>
       <p>We were successful!</p>

app/views/layouts/_step_navigation.html.erb

@@ -1,5 +1,4 @@
 <section class="prompt center">
   <%= link_to "Previous Step", previous_wizard_path, class: "option" %>
-  <%= button_tag "Troubleshooting", type: "button", class: "troubleshooting", data: {toggle: "collapse", target: "#trouble"} %>
   <%= link_to "Next Step", next_wizard_path, class: "option"%>
 </section>

app/views/main/congratulations.html.erb

@@ -9,50 +9,10 @@
   <h2>What’s next?</h2>
   <ol>
     <li>
-      <strong><%= link_to "One Month Python", "https://onemonth.com/courses/one-month-python?utm_source=installpython", target: "_blank" %></strong> helps you build your first app in less than one month!
-    </li>
-    <li><strong><%= link_to "Enroll now", "https://onemonth.com/courses/one-month-python?utm_source=installpython", target: "_blank" %></strong> and get started learning Rails.
+      <strong><%= link_to "One Month Python", "https://onemonth.com/courses/one-month-python?utm_source=installpython", target: "_blank" %></strong> helps you learn the basics of python in less than one month!
     </li>
   </ol>
 
-  <strong><h3>Other Resources We Love for Learning Ruby and Rails:</h3></strong>
-
-  <div class="row">
-    <div class="col-sm-6">
-      <ul>
-        <li>
-          <a href="https://gorails.com/?utm_source=installpython" target="_blank">GoRails (Weekly Rails Screencasts)</a>
-        </li>
-        <li>
-          <a href="https://www.railstutorial.org/book" target="_blank">Ruby on Rails Tutorial by Michael Hartl</a>
-        </li>
-        <li>
-          <a href="http://railscasts.com/" target="_blank">RailsCasts by Ryan Bates</a>
-        </li>
-        <li>
-          <a href="http://guides.rubyonrails.org/" target="_blank">Ruby on Rails Guides</a>
-        </li>
-      </ul>
-    </div>
-
-
-    <div class="col-sm-6">
-      <ul>
-        <li>
-        <a href="http://generalassemb.ly/" target="_blank">General Assembly (12 week offline)</a>
-        </li>
-        <li>
-        <a href="http://codecademy.com" target="_blank">Codecademy</a>
-        </li>
-        <li>
-        <a href="http://codeschool.com" target="_blank">Codeschool</a>
-        </li>
-        <li>
-        <a href="http://teamtreehouse.com/" target="_blank">Treehouse</a>
-        </li>
-      </ul>
-    </div>
-  </div><!-- .row -->
 </section>
 
 <a href="https://github.com/onemonth/install_rails"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://github-camo.global.ssl.fastly.net/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>

app/views/main/index.html.erb

@@ -6,7 +6,7 @@
         <div class="col-lg-12">
 
           <div class="header-description">
-            <h1>Install Python:<br><span style="font-size: 45px;"> <!-- A step-by-step guide --> Coming Soon</span></h1>
+            <h1>Install Python:<br><span style="font-size: 45px;">A step-by-step guide</span></h1>
             <%= link_to "Start now", install_steps_path, class: "header-btn" %>
           </div><!-- /header-description -->