Difference between revisions of "Team:Oxford/InitialIdeas"

Line 54: Line 54:
 
         <!-- Page Content -->
 
         <!-- Page Content -->
 
     <!-- Header - set the background image for the header in the line below -->
 
     <!-- Header - set the background image for the header in the line below -->
−
     <header class="py-5 background-img" style="background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQn49xONLprIuteGlCSHz3q6rxjAhwXlXenPEQudw4H3ikDnuzIfg');">
+
     <header class="py-5 background-img" style="background-image: url('https://cdn.dribbble.com/users/94246/screenshots/3267395/sharp_ps2_8x6.png');">
 
       <div class="translucent-back" style="height: 500px;">
 
       <div class="translucent-back" style="height: 500px;">
−
<h1 class="header-text">Initial Ideas</h1>
+
<h1 class="header-text">Description</h1>
 
</div>
 
</div>
 
     </header>
 
     </header>
−
        <div id="page-content-wrapper">
+
 
−
            <div class="container-fluid">
+
    <section id="about">
−
                <h1>Simple Sidebar</h1>
+
      <div class="container">
−
                <p>This template has a responsive menu toggling system. The menu will appear collapsed on smaller screens, and will appear non-collapsed on larger screens. When toggled using the button below, the menu will appear/disappear. On small screens, the page content will be pushed off canvas.</p>
+
        <div class="row">
−
                <p>Make sure to keep all page content within the <code>#page-content-wrapper</code>.</p>
+
          <div class=".col-md-8 .offset-md-2">
−
            </div>
+
            <h2>Section 1</h2>
 +
            <p class="lead">This is a great place to talk about your webpage. This template is purposefully unstyled so you can use it as a boilerplate or starting point for you own landing page designs! This template features:</p>
 +
            <ul>
 +
              <li>Clickable nav links that smooth scroll to page sections</li>
 +
              <li>Responsive behavior when clicking nav links perfect for a one page website</li>
 +
              <li>Bootstrap's scrollspy feature which highlights which section of the page you're on in the navbar</li>
 +
              <li>Minimal custom CSS so you are free to explore your own unique design options</li>
 +
            </ul>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </section>
 +
 
 +
    <section id="services">
 +
      <div class="container">
 +
        <div class="row">
 +
          <div class=".col-md-8 .offset-md-2 .bg-light">
 +
            <h2>Section 2</h2>
 +
            <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut optio velit inventore, expedita quo laboriosam possimus ea consequatur vitae, doloribus consequuntur ex. Nemo assumenda laborum vel, labore ut velit dignissimos.</p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </section>
 +
 
 +
    <section id="contact">
 +
      <div class="container">
 +
        <div class="row">
 +
          <div class=".col-md-8 .offset-md-2">
 +
            <h2>Section 3</h2>
 +
            <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero odio fugiat voluptatem dolor, provident officiis, id iusto! Obcaecati incidunt, qui nihil beatae magnam et repudiandae ipsa exercitationem, in, quo totam.</p>
 +
          </div>
 +
        </div>
 +
      </div>
 +
    </section>
 +
 
 +
    <!-- Footer -->
  
 
<div class="footer-social-icons">
 
<div class="footer-social-icons">
Line 74: Line 109:
 
</div>
 
</div>
 
     </footer>
 
     </footer>
−
 
  
 
     <!-- Bootstrap core JavaScript -->
 
     <!-- Bootstrap core JavaScript -->

Revision as of 11:26, 30 August 2018

Full Width Pics - Start Bootstrap Template

Description

Section 1

This is a great place to talk about your webpage. This template is purposefully unstyled so you can use it as a boilerplate or starting point for you own landing page designs! This template features:

  • Clickable nav links that smooth scroll to page sections
  • Responsive behavior when clicking nav links perfect for a one page website
  • Bootstrap's scrollspy feature which highlights which section of the page you're on in the navbar
  • Minimal custom CSS so you are free to explore your own unique design options

Section 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut optio velit inventore, expedita quo laboriosam possimus ea consequatur vitae, doloribus consequuntur ex. Nemo assumenda laborum vel, labore ut velit dignissimos.

Section 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero odio fugiat voluptatem dolor, provident officiis, id iusto! Obcaecati incidunt, qui nihil beatae magnam et repudiandae ipsa exercitationem, in, quo totam.