Skip to content

masonstrap
masonstrap
Commit 4c8c39b7 authored by David Haynes's avatar David Haynes 🙆
Browse files
Options

Progress on homepage & reset styling 

- plus footer css
parent 962f8ec6
Pipeline #1600 passed with stages
      in 1 minute and 11 seconds
      Hide whitespace changes
      Inline Side-by-side
      Showing with 126 additions and 18 deletions
      README.md
      View file @ 4c8c39b7
      ......@@ -45,9 +45,9 @@ files such as JS dependencies and fonts.
      You can spin up a development server with:
      gulp
      gulp
      Head to [127.0.0.1:8080](127.0.0.1:8080) to view!
      Head to [127.0.0.1:8000](127.0.0.1:8000) to view!
      Any changes made in `src/` are automatically applied to the dev server. DO NOT
      EDIT IN `build/`, changes WILL NOT be committed.
      \ No newline at end of file
      src/html/demo.html 0 → 100644
      View file @ 4c8c39b7
      <!DOCTYPE html>
      <html lang="en">
      <head>
      <!-- Metatags -->
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
      <!-- Chrome on Android navbar color -->
      <meta name="theme-color" content="#006633">
      <!-- Opengraph tags -->
      <meta property="og:url" content="https://srct.gmu.io/masonstrap/">
      <meta property="og:type" content="website">
      <meta property="og:title" content="SRCT Masonstrap">
      <meta property="og:image" content="https://srct.gmu.io/masonstrap/img/masonstrap.png">
      <meta property="og:description" content="Easily provide any web project with Mason branding.">
      <meta property="og:site_name" content="SRCT Masonstrap">
      <meta property="og:locale" content="en_US">
      <meta property="article:author" content="SRCT">
      <!-- Twitter card tags -->
      <meta name="twitter:card" content="summary">
      <meta name="twitter:site" content="@MasonSRCT">
      <meta name="twitter:creator" content="@MasonSRCT">
      <meta name="twitter:url" content="https://srct.gmu.io/masonstrap/">
      <meta name="twitter:title" content="SRCT Masonstrap">
      <meta name="twitter:description" content="Easily provide any web project with Mason branding.">
      <meta name="twitter:image" content="https://srct.gmu.io/masonstrap/img/masonstrap.png">
      <!-- Title -->
      <title>Masonstrap 4 &bull; Home</title>
      <!-- Load in static content -->
      <link rel="icon" href="./img/favicon.ico" sizes="16x16">
      <link rel="stylesheet" href="./css/masonstrap.min.css" media="screen">
      </head>
      <!-- Navbar -->
      <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
      <a class="navbar-brand d-flex mx-auto" href="./index.html">
      <img src="./img/SRCT_square.svg" width="30" height="30" class="d-inline-block align-top" alt="SRCT Masonstrap">
      &nbsp;Masonstrap&nbsp;
      </a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
      aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
      <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
      <li class="nav-item">
      <a class="nav-link" href="./demo.html">Demo</a>
      </li>
      <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="http://example.com" id="navbarDropdownMenuLink"
      data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      Source Files
      </a>
      <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
      <a class="dropdown-item" href="./css/masonstrap.css">masonstrap.css</a>
      </div>
      </li>
      </ul>
      <a class="btn accent-btn-outline" href="https://git.gmu.edu/srct/masonstrap/-/jobs/artifacts/master/download?job=build">Download</a>
      </div>
      </nav>
      <!-- Footer -->
      <footer class="footer">
      <div class="container">
      <span class="text-muted">A project of <a href="http://srct.gmu.edu/">GMU<strong> SRCT</strong></a>.</span>
      </div>
      </footer>
      <!-- load in external js -->
      <script src="./js/jquery.min.js"></script>
      <script src="./js/popper.min.js"></script>
      <script src="./js/bootstrap.min.js"></script>
      </html>
      \ No newline at end of file
      src/html/index.html
      View file @ 4c8c39b7
      ......@@ -35,10 +35,11 @@
      <link rel="stylesheet" href="./css/masonstrap.min.css" media="screen">
      </head>
      <!-- Navbar -->
      <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
      <a class="navbar-brand d-flex mx-auto" href="#">
      <a class="navbar-brand d-flex mx-auto" href="./index.html">
      <img src="./img/SRCT_square.svg" width="30" height="30" class="d-inline-block align-top" alt="SRCT Masonstrap">
      &nbsp;Masonstrap
      &nbsp;Masonstrap&nbsp;
      </a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
      ......@@ -48,7 +49,7 @@
      <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
      <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
      <li class="nav-item">
      <a class="nav-link" href="#">Demo</a>
      <a class="nav-link" href="./demo.html">Demo</a>
      </li>
      <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="http://example.com" id="navbarDropdownMenuLink"
      ......@@ -56,16 +57,25 @@
      Source Files
      </a>
      <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
      <a class="dropdown-item" href="#">Action</a>
      <a class="dropdown-item" href="#">Another action</a>
      <a class="dropdown-item" href="#">Something else here</a>
      <a class="dropdown-item" href="./css/masonstrap.css">masonstrap.css</a>
      </div>
      </li>
      </ul>
      <button class="btn btn-outline-accent my-2 my-sm-0" type="submit">Download</button>
      <a class="btn accent-btn-outline" href="https://git.gmu.edu/srct/masonstrap/-/jobs/artifacts/master/download?job=build">Download</a>
      </div>
      </nav>
      <body style="">
      <div class="container" style="padding-top: 5rem;">
      <h1>
      <span class="fa-stack fa-md hidden-sm-down">
      <i class="fa fa-circle fa-stack-2x"></i>
      <i class="fa fa-paint-brush fa-stack-1x fa-inverse"></i>
      </span> Masonstrap
      </h1>
      <hr />
      </body>
      <!-- load in external js -->
      <script src="./js/jquery.min.js"></script>
      <script src="./js/popper.min.js"></script>
      ......
      src/scss/_mixins.scss
      View file @ 4c8c39b7
      // Custom Mixins
      \ No newline at end of file
      // Custom Mixins
      src/scss/_overwrites.scss
      View file @ 4c8c39b7
      // Things that originate from Bootstrap that we overwrite
      @each $color, $value in $theme-colors {
      .btn-outline-#{$color} {
      @include button-outline-variant($value, $gray-900);
      }
      }
      src/scss/_styles.scss
      View file @ 4c8c39b7
      // Custom classes and styling
      \ No newline at end of file
      // Custom classes and styling
      .accent-btn-outline {
      @include button-outline-variant(theme-color('accent'), $gray-900);
      }
      html {
      position: relative;
      min-height: 100%;
      }
      body {
      /* Margin bottom by footer height */
      margin-bottom: 60px;
      }
      .footer {
      position: absolute;
      bottom: 0;
      width: 100%;
      /* Set the fixed height of the footer here */
      height: 60px;
      line-height: 60px;
      /* Vertically center the text there */
      background-color: #f5f5f5;
      }
      \ No newline at end of file
      src/scss/_variables.scss
      View file @ 4c8c39b7
      ......@@ -105,6 +105,7 @@ $colors: (
      $theme-colors: (
      primary: get-primary-palette('mason-green'),
      accent: get-primary-palette('mason-gold'),
      secondary: $gray-600,
      success: $green,
      info: $cyan,
      ......@@ -112,5 +113,4 @@ $theme-colors: (
      danger: $red,
      light: $gray-100,
      dark: $gray-800,
      accent: get-primary-palette('mason-gold')
      );
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment