Framing things out.

ResponsiveImagesCG · d6559ff69352769be5da7fc283ca9121410e7edf · Wilto committed Apr 24, 2015 · Apr 24, 2015 · d6559ff
1 parent 998198d
commit d6559ff69352769be5da7fc283ca9121410e7edf
Unified Split

Showing 895 changed files with 230,396 additions and 0 deletions.
diff --git a/gruntfile.js b/gruntfile.js
@@ -0,0 +1,13 @@
+/*global module:true*/
+(function() {
+  "use strict";
+
+  module.exports = function(grunt) {
+    "gh-pages": {
+      options: {
+        base: '.'
+      },
+      src: ["**/*", "!node_modules/**/*"]
+    }
+  };
+})();
diff --git a/index.bs b/index.bs
@@ -0,0 +1,55 @@
+<pre class='metadata'>
+Title: Container Queries
+Shortname: container-queries
+Level: 1
+Status: ED
+Group: ricg
+URL: https://github.com/ResponsiveImagesCG/container-queries
+Editor: Mat Marquis, Bocoup http://bocoup.com
+Abstract: Container queries allow an author to control styling based on the size of a containing element rather than the size of the user’s viewport.
+!Version History: <a href="https://github.com/ResponsiveImagesCG/picture-element/commits/gh-pages">Commit History</a>
+!Version History: <a href="https://twitter.com/respimg_commits">Github commits on Twitter</a>
+!Participate: <a href="http://w3c.responsiveimages.org/">Join the Responsive Issues Community Group</a>
+!Participate: <a href="http://list.responsiveimages.org/">Public Mailing List</a>
+!Participate: <a href="irc://irc.w3.org:6665/#respimg">IRC: #respimg on the W3C IRC server</a>
+!Participate: <a href="https://twitter.com/respimg">Twitter</a>
+!Participate: <a href="https://github.com/ResponsiveImagesCG/picture-element">GitHub</a>
+</pre>
+
+Introduction {#intro}
+=====================
+
+	Given a complex responsive layout, developers often require granular control over how the contents of an individual module will respond relative to the size of their parent container rather than the viewport size. This limitation conflicts with the goal of creating modular, independent components, often requiring a number of redundant CSS, complex exception cases, and workarounds, and the problem compounds itself depending on how dramatically a module adapts at each of its breakpoints.
+
+	Container queries allow an author to control styling based on the size of a containing element rather than the size of the user’s viewport.
+
+
+## When to use Container Queries ## {#when-to-use}
+
+	Container queries are intended for use when…
+
+
+## Examples of Usage ## {#usage}
+
+	<div class="example" id="example-1">
+	</div>
+
+
+Container Queries {#container-queries}
+=====================
+
+## Syntax ## {#syntax}
+
+	The formal container query syntax is described in this section, with the rule/property grammar syntax defined in [[!CSS3SYN]] and [[!CSS3VAL]].
+
+
+Definitions {#defs}
+=====================
+
+	The following terms are used throughout this specification so they are gathered here for the readers convenience. The following list of terms is not exhaustive; other terms are defined throughout this specification.
+
+
+Acknowledgements {#acks}
+=====================
+
+	A <a href="http://www.w3.org/community/respimg/participants">complete list of participants</a> of the Responsive Issues Community Group is available at the W3C Community Group Website.