Component and page demos with different content configurations
| No. | Description | Components | Status | Delivery | Revised |
|---|---|---|---|---|---|
| D00 | Wrapper | S1.1, S1.2,S1.3, S1.6, S1.7, S1.9 | Complete | ||
| D01 | Person and Video | S1.19, S1.15.1, S2.11 | Revised | 9/27/2014 | 10/08/2014 |
| D02 | Page Demo: Engineering Connection | Wrapper + S3.1, S1.14, | Complete | ||
| D03 | Page Demo: Beverages and Recycling | Wrapper + | Complete | ||
| D04 | Page Demo: Article | Wrapper + | Complete | ||
| D05 | Form Demo: Technical Community Share Builder | S1.1, S3.3 | Updated | 10/15/2014 | 11/14/2014 |
| D06 | Demo with Search Bar (verify login by opening this file first) | Wrapper + S1.7 (from GSA team) | Complete | 10/22/2014 | |
| D07 | Demo with server error | Wrapper + S3.9 | Complete | ||
| D08 | Form Builder: Print PDF Template | Unique template | Updated | 10/29/2014 | 11/14/2014 |
| D09 | Form Builder: Preview PDF Template | D08 + buttons at top | Updated | 10/29/2014 | 11/14/2014 |
| D10 | Form Builder: Dashboard, with Thanks, Approver version | Unique template | Complete | 11/04/2014 | |
| D11 | Hydration: step navigation | D08 + step navigation | Complete | 11/05/2014 | |
| D12 | Containers Demo | Demo of Container Component Strategy | Complete | 2/18/2015 | |
| D13 | Demo Page - Safari overlap | Log in here first to see images | Complete |
| No. | Component | Status | Delivery | Revised | |
|---|---|---|---|---|---|
| S1.1 | Logo | Complete | 8/29/2014 | Notes | |
|
This logo graphic is sized for retina screen support (@2x) |
|||||
| S1.2 | Navigation | Complete | 8/29/2014 | Notes | |
|
This component is hidden at mobile sizes, and revealed via S1.17 |
|||||
| S1.3 | Site Map | Updated | 8/29/2014 | 10/22/2014 | Notes |
|
This is hidden by default, see wrapper for working demo |
|||||
| S1.4 | Authentication | Skipped | |||
| S1.6 | Personalized Content Drawer | Updated | 8/29/2014 | 11/1/2014 | Notes |
|
This now overlays the page as per updated spec |
|||||
| S1.7 | Search Bar | Complete | 8/29/2014 | Notes | |
|
This is based off of HTML given by the GSA team |
|||||
| S1.8 | Search Results | Skipped | |||
| S1.9 | Footer | Complete | 8/29/2014 | Notes | |
|
The "sitemap" link reveals the sitemap below, see the wrapper demo. The sitemap link is hidden at mobile sizes. |
|||||
| S1.10.1 | List with Thumbnails Regular,Linked as block |
Updated | 8/29/2014 | 10/29/2014 | |
| S1.10.2 | List with Bullet Icons Regular, Expanding, with Summaries |
Updated | 8/29/2014 | 10/25/2014 | |
| S1.10.3 | List with Simple Bullets Regular, Expanding, with Summaries |
Updated | 8/29/2014 | 10/25/2014 | |
| S1.10.4 | List Link Outs Regular, Expanding, with Summaries |
Updated | 8/29/2014 | 10/25/2014 | |
| S1.10.5 | List with content type icons Regular, Expanding, with Summaries |
Complete | 8/29/2014 | ||
| S2.16 | Personalized Content Drawer - My Interests Selection | Complete | 8/29/2014 | ||
| S1.16 | SME Community - Multi-column list | Updated | 8/29/2014 | 02/02/2015 | |
| S1.17 | Mobile Navigation Toggles viewable at mobile size | Complete | 8/29/2014 | Notes | |
|
These reveal at mobile size only, and hide/show the navigation, search, and sidebar |
|||||
| S1.18 | Container 1 Column: Transparent Light Gray Dark Gray |
Updated | 8/29/2014 | 12/17/2014 | Notes |
|
Padding is now included in these components |
|||||
| S1.18.1 | Container Header: Red Light Gray Dark Gray |
New | 2/18/2015 | ||
| S1.18.2 | Container No Padding: Light Gray Dark Gray |
New | 2/18/2015 | ||
| S1.19 | Container 2 Column: Transparent Light Gray Dark Gray |
Updated | 8/29/2014 | 12/17/2014 | Notes |
|
Padding is now included in these components |
|||||
| S1.20 | Container 3 Column: Transparent Light Gray Dark Gray |
Updated | 8/29/2014 | 12/17/2014 | Notes |
|
Padding is now included in these components |
|||||
| S1.21 | Container 4 Column: Transparent Light Gray Dark Gray |
Updated | 8/29/2014 | 12/17/2014 | Notes |
|
Padding is now included in these components |
|||||
| No. | Component | Status | Delivery | Revised | |
|---|---|---|---|---|---|
| S1.15.1 | Featured 1up: red background light gray background dark gray background |
Updated | 9/12/2014 | 12/18/2014 | |
| S1.15.2 | Featured 2up: w/ red background w/ light gray background w/ dark gray background |
Updated | 9/6/2014 | 12/18/2014 | |
| S1.15.3 | Featured 3up: w/ red background w/ light gray background w/ dark gray background |
Updated | 9/6/2014 | 12/18/2014 | Notes |
|
Features 3 and 4 up turn into carousels in mobile widths |
|||||
| S1.15.4 | Featured 4up: w/ red background w/ light gray background w/ dark gray background |
Updated | 9/6/2014 | 12/18/2014 | Notes |
|
Features 3 and 4 up turn into carousels in mobile widths |
|||||
| S1.10.5 | List with content type icons Regular, Expanding, with Summaries |
Complete | 9/12/2014 | ||
| S1.11 | Responsive table list, with files | Updated | 9/12/2014 | 02/02/2015 | Notes |
|
This is a resonsive table solution, at mobile, sorting is handled by a pulldown menu. |
|||||
| S1.10.6 | Lists with Icons, with Summaries, Icon class reference | Updated | 9/12/2014 | 11/14/14 | |
| S1.13 | Text Section Headers | Complete | 9/20/2014 | Notes | |
|
Headers can be specified by class, and have 3 color options, also assigned by class. |
|||||
| S1.14 |
Graphic/Image Section Headers with icon, without icon, Graphic headers reference |
Updated | 9/12/2014 | 11/06/2014 | Notes |
|
Font size scales automatically based on page width via fittext. |
|||||
| S2.7 | Content Drawer, Nested for year/quarter grouping | Updated | 9/12/2014 | 10/17/2014 | Notes |
|
This is used to change pages via javascript, but accessible nav links are also provided. |
|||||
| S2.15 | Cascading Filters | Complete | 9/12/2014 | ||
| S3.10.1 | Carousel 1 for Homepage | Revised | 9/12/2014 | 10/10/2014 | |
| S3.3 | Form Elements | Complete | 9/12/2014 | Notes | |
|
The form elements leverage CSS from Bootstrap |
|||||
| S3.3.1 | Form Element: text input | Complete | 9/12/2014 | ||
| S3.3.2 | Form Element: textarea | Complete | 9/12/2014 | ||
| S3.3.3 | Form Element: textarea editing | Complete | 9/12/2014 | ||
| S3.3.4 | Form Element: select | Complete | 9/12/2014 | ||
| S3.3.5 | Form Element: radio | Complete | 9/12/2014 | ||
| S3.3.6 | Form Element: checkbox | Complete | 9/12/2014 | ||
| S3.3.7 | Form Element: button | Complete | 9/12/2014 | ||
| S3.4 | Columns in Forms | Complete | 9/12/2014 | Notes | |
|
Thie column example shows form inputs used in a grid layout. |
|||||
| S2.11 | Embedded Video, Version for video from DAM | Complete | 9/12/2014 | Notes | |
|
YouTube video embeds stretch and scale but Brightcove embeds are sized based on page load. The video embeds will fill whatever container they are placed in by way of the fitvids javascript function |
|||||
| No. | Component | Status | Delivery | Revised | |
|---|---|---|---|---|---|
| S2.4.1 | Article Headings | Complete | 9/20/2014 | ||
| S2.4.2 | Article - Embedded image with caption | Complete | 9/20/2014 | ||
| S2.4.3 | Article - Copy with aligned images | Complete | 9/20/2014 | ||
| S2.4.4 | Article - Copy styling | Complete | 9/20/2014 | ||
| S2.4.6 | Article - Button Callout, no icon | Revised | 9/27/2014 | 10/08/2014 | |
| S2.4.5 | Article - Byline | Complete | 9/20/2014 | ||
| S2.6 | Tables | Revised | 9/20/2014 | 10/10/2014 | |
| S2.9 | Embedded Image with Headline and Caption | Complete | 9/20/2014 | ||
| S2.14 | Inline Text Expansion | Complete | 9/27/2014 | ||
| S2.13 | Content Modal | Updated | 9/27/2014 | 11/6/2014 | Notes |
|
The modal content is inline in the page and only revealed whent he link it clicked. |
|||||
| S2.1.2 | Secondary Content Grid
Variatons: 12 results, 15 results, 26 results |
Updated | 9/27/2014 | 10/25/2014 | Notes |
|
This pulls in content from a JSON file, based on the number of results, the "load more" button will display more items in gropus of 12. |
|||||
| S3.23 | Pagination | Updated | 9/20/2014 | 02/02/2015 | |
| No. | Component | Status | Delivery | Revised | |
|---|---|---|---|---|---|
| S3.1 | Breadcrumbs | Complete | 10/10/2014 | ||
| S2.10 / S2.12 | Photo and Video Gallery, Version for video from DAM | Updated | 10/10/2014 | 1/23/2015 | Notes |
|
In version for videos from DAM, video playback will not work in this demo. Pathing is specific to CQ environment. |
|||||
| S3.24 | Horizontal Rule | Complete | 10/3/2014 | ||
| S3.8 | Tags | Complete | 10/10/2014 | ||
| S3.9 | Server Errors | Updated | 10/3/2014 | 10/25/2014 | |
| S3.11 | Alert | Updated | 10/3/2014 | 10/17/2014 | |
| S3.12 | Sticky Navigation | Updated | 10/15/2014 | 11/05/2014 | |
| S2.1.3 | Gallery Grid | Updated | 10/3/2014 | 10/17/2014 | |
| S2.3 | HTML Buttons - with/without icon | Complete | 10/10/2014 | ||
| S3.2 | Linked Logo Gallery | Updated | 10/15/2014 | 10/22/2014 | |
| S3.5 | Jump Links | Revised | 10/3/2014 | 10/10/2014 | |
| S3.14a | Email Template | Development | |||
| S3.14b | Email Template - header/footer | Development | |||
| S3.6 | Icons | Complete | 10/10/2014 | ||
| S1.16.1 | SME Community No-Link Version | Updated | 10/10/2014 | 02/02/2015 | |
| S2.5 | Comments/Rating | Development | |||
| S2.2 | Toolbar (test text-resizer here) | Complete | 10/17/2014 | ||
| S5.1 | Step Navigation | Complete | 11/05/2014 | ||
| R01 | Icon class name reference | ||||