mvcss.github.com/application/index.html at master · RandomStuffs22/mvcss.github.com · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang='en'>
  <head>
    <meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible'>
    <meta charset='utf-8'>
    <meta content='width=device-width, initial-scale=1.0' name='viewport'>
    <title>Application / MVCSS</title>
    <meta content='MVCSS - A Sass-based CSS architecture for creating predictable and maintainable application style.' name='description'>
    <link href="http://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300" media="screen" rel="stylesheet" type="text/css" />
    <link href="../assets/stylesheets/application.css" media="screen" rel="stylesheet" type="text/css" />
    <script>
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-32794837-1']);
      _gaq.push(['_trackPageview']);

      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();
    </script>
  </head>
  <body class='application application_index'>
    <div class='l-controls'>
      <a class='btn--a' href='https://github.com/mvcss/mvcss'>View Code &rarr;</a>
      <p><a href="/changelog/">Changelog (v3.0.1)</a></p>
    </div>
    <a class='l-sidebar-toggle' href='#'>Navigation</a>
    <aside class='l-sidebar'>
      <header class='l-header'>
        <div class='c-logo'>
          <a href='/'><img width="100" height="110" alt="MVCSS" src="../assets/images/logo.svg" /></a>
          <b>MVCSS <span>Version 3.0.1</span></b>
        </div>
        <p class='c-tagline'>A Sass-based CSS Architecture</p>
      </header>
      <nav class='l-nav'>
        <ul>
          <li><a href="/">About</a></li>
          <li><a class="is-active" href="/application/">Application</a></li>
          <li>
            <a href="/core/">Core</a>
            <ul>
              <li><a href="/core/reset/">Reset</a></li>
              <li><a href="/core/settings/">Settings</a></li>
              <li><a href="/core/helpers/">Helpers</a></li>
              <li><a href="/core/base/">Base</a></li>
              <li><a href="/core/content/">Content</a></li>
              <li><a href="/core/layout/">Layout</a></li>
            </ul>
          </li>
          <li><a href="/modules/">Modules</a></li>
          <li>
            <a href="/styleguide/">Styleguide</a>
            <ul>
              <li><a href="/styleguide/basics/">Basics</a></li>
              <li><a href="/styleguide/sass-specific/">Sass-specific</a></li>
              <li><a href="/styleguide/naming/">Naming Conventions</a></li>
            </ul>
          </li>
          <li><a href="/library/">Library</a></li>
        </ul>
      </nav>
      <footer class='l-about'>
        <b>Crafted with care by</b>
        <a href="http://twitter.com/nickawalsh">Nick Walsh</a>
        &amp;
        <a href="http://twitter.com/drewbarontini">Drew Barontini</a>
      </footer>
    </aside>
    <main class='l-cell'>
      <h1>Application</h1>

      <p>The application consists of one file, <code>application.sass</code>, and it acts as the loader file for <strong>MVCSS</strong>. The file consists of imports and the inbox.</p>

      <h2>Imports</h2>

      <ul>
      <li><a href="http://compass-style.org/">Compass</a> (optional, see below)</li>
      <li><a href="/core/">Core</a></li>
      <li><a href="/modules/">Modules</a></li>
      </ul>

      <p><strong>Note</strong>: <a href="http://compass-style.org/">Compass</a> provides utilities and niceties to make your life easier. We use it, and we recommend that you give it a try.</p>

      <h2>Inbox</h2>

      <p>The inbox allows developers, and those not actively working on the CSS, to quickly add styles that are easily seen by the maintainer of the file. This section of the Application has worked wonders for us.</p>
    </main>
    <script>
      var _gauges = _gauges || [];
      (function() {
        var t   = document.createElement('script');
        t.type  = 'text/javascript';
        t.async = true;
        t.id    = 'gauges-tracker';
        t.setAttribute('data-site-id', '4fe1bcaa613f5d1bfe000020');
        t.src = '//secure.gaug.es/track.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(t, s);
      })();
    </script>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script>
      (function() {

        $(function() {
          return $('.l-sidebar-toggle').on('click', function(e) {
            e.preventDefault();
            $(this).toggleClass('is-active');
            return $('body').toggleClass('is-sidebar-toggled');
          });
        });

      }).call(this);
    </script>
  </body>
</html>