Skip to content

Commit 5bea4ba

Browse files
WiltoWilto
committed
Intro
1 parent a6cb4b0 commit 5bea4ba

File tree

6 files changed

+54
-19
lines changed

6 files changed

+54
-19
lines changed

‎_dist/_css/all.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎_dist/_css/critical.css

Lines changed: 9 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎_dist/index.php

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,9 @@
3333
<h1 class="logo"><img src="_img/ricg-logo.png" alt="Responsive Issues Community Group"></h1>
3434
</header>
3535

36-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, magni dolor cumque fugiat aspernatur excepturi explicabo! Perferendis, libero, autem, magni debitis fugit quibusdam assumenda quas minus adipisci maiores nisi numquam.</p>
36+
<div class="intro">
37+
<p>The <abbr title="Responsive Issues Community Group">RICG</abbr> is a group of independent designers and developers working toward standards that will help build fast, accessible, responsive websites.</p>
38+
</div>
3739

3840
<div class="issues">
3941

@@ -227,7 +229,7 @@
227229
</div>
228230
</div>
229231
<div class="col-a">
230-
<p><p>Media queries allow authors to vary the layout of their page based on the dimensions of the viewport. Element queries will allow developers to vary the layout within specific elements on a page (and their children) based on the dimensions of the parent elements themselves, allowing for much more modular approaches to layout.</p><p>Work on element queries has just begun; we are still collecting use cases and working to understand technical constraints. Please contribute!</p></p>
232+
<p><p>Media queries allow authors to vary the layout of their page based on the dimensions of the viewport. <strong>Element</strong> queries will allow developers to vary the layout within specific elements on a page (and their children) based on the dimensions of the parent elements themselves, allowing for much more modular approaches to layout.</p><p>Work on element queries has just begun; we are still collecting use cases and working to understand technical constraints. Please contribute!</p></p>
231233

232234
<h3 class="subhed">Usage</h3>
233235
<div class="usage">

‎_tmpl/_css/all.css

Lines changed: 36 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -44,9 +44,31 @@ p {
4444
.logo img {
4545
display: block;
4646
margin: 0 auto;
47-
padding: 1.75em 0 1.5em 0;
48-
max-width: 340px;
49-
width: 60%;
47+
padding: 2em 0 .5em 0;
48+
max-width: 300px;
49+
width: 50%;
50+
}
51+
52+
.intro {
53+
padding-bottom: 1.5em;
54+
max-width: 920px;
55+
margin: 0 auto;
56+
}
57+
58+
.intro p {
59+
color: #444;
60+
font-size: 1.1em;
61+
font-weight: bold;
62+
line-height: 1.4;
63+
padding: 0 5%;
64+
text-align: center;
65+
text-shadow: 1px 1px 0 #fff;
66+
}
67+
@media(min-width: 45em) {
68+
.intro p {
69+
font-size: 1.2em;
70+
line-height: 1.5;
71+
}
5072
}
5173

5274
.issues {
@@ -68,6 +90,7 @@ p {
6890
.head {
6991
border-left: .3125em solid #000;
7092
clear: both;
93+
cursor: pointer;
7194
float: left;
7295
display: block;
7396
padding: .3em 0;
@@ -90,9 +113,9 @@ p {
90113
}
91114
.head .status {
92115
clear: both;
93-
opacity: .8;
94116
font-size: .925em;
95117
margin-top: .525em;
118+
opacity: .8;
96119
}
97120
@media( min-width: 30em ) {
98121
.head .status {
@@ -103,17 +126,20 @@ p {
103126

104127

105128
/* */
106-
.body {
107-
display: none !important;
129+
.issues .body {
130+
height: 1px;
131+
left: -9999px;
132+
overflow: hidden;
133+
position: absolute;
108134
}
109-
.open .body {
110-
display: block !important;
135+
.issues .open .body {
136+
height: auto;
137+
overflow: visible;
138+
position: static;
111139
}
112140
.open .head {
113141
background: #000;
114142
}
115-
/* */
116-
117143
.body {
118144
clear: both;
119145
padding-top: 1em;

‎_tmpl/_partials/primary.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<head>
1+
<head>
22
<meta charset="utf-8">
33
<title>Responsive Issues Community Group</title>
44
<meta name="viewport" content="width=device-width, initial-scale=1">

‎_tmpl/index.hbs

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,9 @@
77
<h1 class="logo"><img src="_img/ricg-logo.png" alt="Responsive Issues Community Group"></h1>
88
</header>
99

10-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, magni dolor cumque fugiat aspernatur excepturi explicabo! Perferendis, libero, autem, magni debitis fugit quibusdam assumenda quas minus adipisci maiores nisi numquam.</p>
10+
<div class="intro">
11+
<p>The <abbr title="Responsive Issues Community Group">RICG</abbr> is a group of independent designers and developers working toward standards that will help build fast, accessible, responsive websites.</p>
12+
</div>
1113

1214
<div class="issues">
1315
{{> issues }}

0 commit comments

Comments
 (0)