Side by Side Diff: demo/css/demo.css
Issue 29361708:
Issue 4609 - Default grid component (Closed)
Patch Set: Updated name, inverse class, and documentation
Created Dec. 1, 2016, 6:45 p.m.
| Left: | ||
| Right: |
Use n/p to move between diff chunks;
N/P to move between comments.
« no previous file with comments
|
« no previous file
|
demo/grid.html » ('j')
|
demo/grid.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')
| OLD | NEW |
|---|---|
| 1 /*! | 1 /*! |
| 2 * This file is part of website-defaults | 2 * This file is part of website-defaults |
| 3 * Copyright (C) 2016 Eyeo GmbH | 3 * Copyright (C) 2016 Eyeo GmbH |
| 4 * | 4 * |
| 5 * website-defaults is free software: you can redistribute it and/or | 5 * website-defaults is free software: you can redistribute it and/or |
| 6 * modify it under the terms of the GNU General Public License as published by | 6 * modify it under the terms of the GNU General Public License as published by |
| 7 * the Free Software Foundation, either version 3 of the License, or | 7 * the Free Software Foundation, either version 3 of the License, or |
| 8 * (at your option) any later version. | 8 * (at your option) any later version. |
| 9 * | 9 * |
| 10 * website-defaults is distributed in the hope that it will be useful, | 10 * website-defaults is distributed in the hope that it will be useful, |
| 11 * but WITHOUT ANY WARRANTY; without even the implied warranty of | 11 * but WITHOUT ANY WARRANTY; without even the implied warranty of |
| 12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | 12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| 13 * GNU General Public License for more details. | 13 * GNU General Public License for more details. |
| 14 * | 14 * |
| 15 * You should have received a copy of the GNU General Public License | 15 * You should have received a copy of the GNU General Public License |
| 16 * along with website-defaults. If not, see <http://www.gnu.org/licenses/>. | 16 * along with website-defaults. If not, see <http://www.gnu.org/licenses/>. |
| 17 */ | 17 */ |
| 18 | 18 |
| 19 /* The following styles are for demonstration purposes **only** */ | 19 /* The following styles are for demonstration purposes **only** */ |
| 20 | 20 |
| 21 body | 21 body |
| 22 { | 22 { |
| 23 margin: 3em 0; | 23 margin: 3em 0; |
| 24 } | 24 } |
| 25 | |
| 26 /** | |
| 27 * Highlight text with inverse colors and padding | |
| 28 */ | |
| 29 .inverse-text | |
| 30 { | |
| 31 padding: 0.5em 1em; | |
| 32 color: #fff; | |
| 33 background-color: #000; | |
| 34 } | |
| 35 | |
| 36 /** | |
| 37 * Tablet width container | |
| 38 */ | |
| 39 .tablet | |
| 40 { | |
| 41 width: 720px; | |
| 42 } | |
| 43 | |
| 44 /** | |
| 45 * Mobile width container | |
| 46 */ | |
| 47 .mobile | |
| 48 { | |
| 49 width: 540px; | |
| 50 } | |
| 51 | |
| 52 /* Collapse mobile & tablet container widths to 100% on small screens */ | |
| 53 | |
| 54 .mobile, | |
| 55 .tablet | |
| 56 { | |
| 57 max-width: 100%; | |
| 58 } | |
| 59 | |
| 60 .mobile .column, | |
| 61 .tablet .column | |
| 62 { | |
| 63 width: 100%; | |
| 64 } | |
| 65 | |
| 66 @media(min-width: 768px) | |
| 67 { | |
| 68 /* Collapse one fourth columns to one half columns inside tablet containers */ | |
| 69 .tablet .column.one-fourth | |
| 70 { | |
| 71 width: 50%; | |
| 72 } | |
| 73 } | |
| OLD | NEW |
« no previous file with comments
|
« no previous file
|
demo/grid.html » ('j')
|
demo/grid.html » ('J')
