From cb8ff6f5e6c9cccff484280b8234f6789f8ca6dc Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Wed, 9 Mar 2016 15:01:44 -0500 Subject: [PATCH 1/9] bump version no --- package.json | 2 +- xmeter.less | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 766014c..6f7b745 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "xmeter", - "version": "4.0.0", + "version": "4.0.1", "description": "A default stylesheet with a set of tools that make designing with vertical rhythm easy.", "main": "xmeter.css", "dependencies": {}, diff --git a/xmeter.less b/xmeter.less index 5979aa6..811679f 100644 --- a/xmeter.less +++ b/xmeter.less @@ -1,7 +1,7 @@ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*\ xmeter - Version: 4.0.0 + Version: 4.0.1 Licence: MIT Repo : https://github.com/chharvey/xmeter.git Home : https://github.com/chharvey/xmeter/blob/gh-pages/README.md From d31a50c7f85fa712d3020157ea8f12b60217516d Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Wed, 9 Mar 2016 15:11:51 -0500 Subject: [PATCH 2/9] move hr element to grouping --- src/_base.grouping.less | 4 ++++ src/_base.sections.less | 4 ---- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/_base.grouping.less b/src/_base.grouping.less index f81954b..220ce1b 100644 --- a/src/_base.grouping.less +++ b/src/_base.grouping.less @@ -6,3 +6,7 @@ div { } + +hr { + display: none; +} diff --git a/src/_base.sections.less b/src/_base.sections.less index ff7fd56..63daffc 100644 --- a/src/_base.sections.less +++ b/src/_base.sections.less @@ -41,9 +41,5 @@ h1 { .spacing-top(@g-vru); } -hr { - display: none; -} - address { } From a33504cbda41fb75c459a79b07a9ce8d2d8fbeff Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Wed, 9 Mar 2016 15:12:10 -0500 Subject: [PATCH 3/9] fix bug involving blocks inside inline --- src/_base.generic.less | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/_base.generic.less b/src/_base.generic.less index 1e4a4c3..99fd367 100644 --- a/src/_base.generic.less +++ b/src/_base.generic.less @@ -51,7 +51,6 @@ span, br, em, strong, i, mark, u, small, dfn, b, abbr, var, q, cite, sup, sub, data, time, code, kbd, samp { - display: inline; line-height: 0; } @@ -65,9 +64,9 @@ a, s, ins, del { line-height: inherit; h1 > &, h2 > &, h3 > &, h4 > &, h5 > &, h6 > &, p > &, pre > &, - figure > &, figcaption > &, blockquote > &, - li > &, dt > &, dd > &, - caption > &, th > &, td > &, + // figure > &, figcaption > &, blockquote > &, + // li > &, dt > &, dd > &, + // caption > &, th > &, td > &, legend > &, summary > & { display: inline; line-height: 0; From 01c5c5fbcdf02780df07e0e3147d952028b0ef59 Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Sat, 12 Mar 2016 22:23:42 -0500 Subject: [PATCH 4/9] use display: contents for trans elements --- src/_base.generic.less | 22 ++++++++++------------ 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/src/_base.generic.less b/src/_base.generic.less index 99fd367..c7ffdde 100644 --- a/src/_base.generic.less +++ b/src/_base.generic.less @@ -55,20 +55,18 @@ data, time, code, kbd, samp { } // Elements with a transparent content model -// should inherit their display and line-height, except -// if they are inside an element containing -// only text and/or other inline elements. -// This behavior may be overrided with classes/inline styles. +// should display what their contents display. a, s, ins, del { - display: inherit; - line-height: inherit; - h1 > &, h2 > &, h3 > &, h4 > &, h5 > &, h6 > &, - p > &, pre > &, + // display: inherit; + // line-height: inherit; + // h1 > &, h2 > &, h3 > &, h4 > &, h5 > &, h6 > &, + // p > &, pre > &, // figure > &, figcaption > &, blockquote > &, // li > &, dt > &, dd > &, // caption > &, th > &, td > &, - legend > &, summary > & { - display: inline; - line-height: 0; - } + // legend > &, summary > & { + // display: inline; + // line-height: 0; + // } + display: contents; } From 07c83fe4a611828e7ff9cc14ab54552d0a07da9d Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Tue, 15 Mar 2016 12:59:12 -0400 Subject: [PATCH 5/9] fix html & body settings close #6 --- src/_base.generic.less | 6 ------ src/_base.sections.less | 10 ++++++++++ 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/src/_base.generic.less b/src/_base.generic.less index c7ffdde..d640f48 100644 --- a/src/_base.generic.less +++ b/src/_base.generic.less @@ -24,12 +24,6 @@ } } -// [1] addresses support for `rem` units (otherwise these would be in `body` selector) -html { - font-size: @g-font_size; // [1] - line-height: @g-line_height; // [1] -} - // Vertical spacing between typographical blocks h1, h2, h3, h4, h5, h6, p, pre, figure, blockquote, diff --git a/src/_base.sections.less b/src/_base.sections.less index 63daffc..447dc16 100644 --- a/src/_base.sections.less +++ b/src/_base.sections.less @@ -7,6 +7,16 @@ @import (reference) url('__tool.module.fontsize.less'); +html, +body { + width: 100%; + height: 100%; +} +html { + // addresses support for `rem` units (otherwise these would be in `body` selector) + font-size: @g-font_size; + line-height: @g-line_height; +} body { } main { From 047a34d45a9515c11fe8f3ece2d3210538fd880b Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Thu, 24 Mar 2016 13:23:29 -0400 Subject: [PATCH 6/9] remove doc comments from base.text elements --- src/_base.text.doctext.less | 74 ------------------------------------- src/_base.text.stress.less | 51 ------------------------- 2 files changed, 125 deletions(-) diff --git a/src/_base.text.doctext.less b/src/_base.text.doctext.less index 53be7e4..cb3815d 100644 --- a/src/_base.text.doctext.less +++ b/src/_base.text.doctext.less @@ -5,108 +5,34 @@ @import (reference) url('__tool.module.delims.less'); -// A span or block of text that has been inserted into a document. -// This is used to explicitly indicate that the text has been intentionally inserted. -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-06-13 ins { background: #a6f3a6; // GitHub-flavored // background: #d1e1ad; // StackOverflow-flavored } -// A span or block of text that has been deleted from a document. -// This is used to explicitly indicate that the text has been intentionally deleted. -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-06-13 del { background: #f8cbcb; // GitHub-flavored // background: #e5bdb2; // StackOverflow-flavored } -// A vocabulary term. -// Every `dfn` should have an `id` attribute, thus there must only be one `dfn` per page that -// contains a given term in question. Furthermore, hyperlinks can point to the defining instance -// of the term. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-02-10 dfn { font-style: inherit; // undo Normalize font-weight: 700; } -// A keyword, technical or specific term, or key phrase -// A `b` Element is any generic keyword or term, whose definition is not present. If the term is -// being defined, use the `dfn` Element. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-11-05 b { font-weight: 700; } -// An abbreviation or acronym. -// The `[title]` attribute should contain the expanded term. -// ``` -// U.S.A. -// ``` -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-03-07 abbr { &[title] { cursor: help; border-bottom: 0; // undo Normalize } } -// A placeholder for some textual element. Could be a filename, etc. -// This does *not* represent a variable in a `code`, e.g., the following HTML would be incorrect: -// ``` -// String $welcome = "Hello world!"; -// ``` -// It would be better to use a `span` with a class for syntax coloring. -// -// Rather, the `var` Element represents a placeholder of text. The following HTML is correct: -// ``` -//

The following git commmand shows you diff: -// $ git diff filepath -// where filepath is the path or name of the file you want to see the diff for.

-// ``` -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-07-21 var { font-style: italic; } -// An inline quotation: a span of text that is taken directly from another source -// (real or fictional). -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-11-05 q { .quotes-double(); // fallback for `initial` quotes: initial; } -// Represents a placeholder reference to a name or title of a heading, section, figure, -// table (or column in a table), or creative work. -// This Object may also represent a proper noun traditionally italicized, e.g. periodical name or ship name. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-02-10 cite { font-style: italic; } diff --git a/src/_base.text.stress.less b/src/_base.text.stress.less index 64cc721..f8489e4 100644 --- a/src/_base.text.stress.less +++ b/src/_base.text.stress.less @@ -4,75 +4,24 @@ \*################################*/ -// Emphasized text represents words or phrases that are stressed, as if the tone of voice would be -// affected. More importantly, **the placement of stress should affect the meaning of the passage**. -// If the emphasis were to be removed or relocated, the passage’s meaning should change. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-02-10 em { font-style: italic; } -// Strong text has a level of importance. Important text does not necessarily affect tone of voice -// (although it may), but rather upsets the normal prose by causing the reader to examine the text -// more carefully. The placement of importance should not affect the meaning of the passage. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-11-05 strong { font-weight: 700; } -// A phrase interpreted in an alternate voice or mood, without carrying extra emphasis, -// such as scare quotes and mentions. -// Or a phrase in a foreign language, such as the taxonomic classification (in Latin) of an organism. -// (If a foreign language, be sure to add the `[lang]` attribute.) -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-07-23 i { font-style: italic; } -// A span of text that is relevant in some context. It is advisable to use the `[class]` attribute -// to indicate the context in which the span is relevant. -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-08-05 mark { } -// A span of text to which the reader’s attention should be brought for purposes of illustration. -// This span is typically in a figure or example. -// -// ^author -// : Chris Harvey -// ^updated -// : 2014-08-05 u { text-decoration: underline; color: #080; } -// side comments. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-02-10 small { font-size: 0.75em; } -// text that is shown to be no longer relevant. -// -// ^author -// : Chris Harvey -// ^updated -// : 2015-02-10 s { text-decoration: line-through; color: #b00; From 121880a942f7c3069c2c1016dee991842db6a24d Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Fri, 25 Mar 2016 22:14:23 -0400 Subject: [PATCH 7/9] minor formatting changes --- README.md | 2 +- doc/styles/doc.less | 6 +++--- src/_base.forms.less | 2 +- src/_base.grouping.paras.less | 1 - src/_base.text.links.less | 3 --- 5 files changed, 5 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 48f021d..65c784b 100644 --- a/README.md +++ b/README.md @@ -52,7 +52,7 @@ at the top of your stylesheet. Then when you want to “call” the mixin, do } ``` -To use the xmeter variables, import the `__settings` stylesheet. +To use the Xmeter global variables, import the `__settings` stylesheet. ```less @import (reference) url('/node_modules/xmeter/src/__settings.less'); diff --git a/doc/styles/doc.less b/doc/styles/doc.less index 2f11679..947047f 100644 --- a/doc/styles/doc.less +++ b/doc/styles/doc.less @@ -1,5 +1,3 @@ -@import (reference) url('../../src/__settings.less'); -@import (reference) url('../../src/__tool.module.borders.less'); /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*\ xmeter @@ -9,6 +7,8 @@ /*================================*\ doc.less \*================================*/ +@import (reference) url('../../src/__settings.less'); +@import (reference) url('../../src/__tool.module.borders.less'); // Stylesheet for Xmeter documentation files. @@ -18,7 +18,7 @@ body { background-image: url('https://chharvey.github.io/core/images/crossgrid-lined.svg'); background-size: 1px 24px; background-repeat: repeat; - background-position: left bottom; + background-position: left top; } .x-c-Code { padding: 1px 2px; diff --git a/src/_base.forms.less b/src/_base.forms.less index 8d28ba0..36ea386 100644 --- a/src/_base.forms.less +++ b/src/_base.forms.less @@ -9,7 +9,7 @@ @p-color_gray_fb: #c0c0c0; // fallback -@p-color_gray: fadeout(#000, 75%); +@p-color_gray: fadeout(#000, 75%); // consistent borders for all fieldset, diff --git a/src/_base.grouping.paras.less b/src/_base.grouping.paras.less index 5e64df0..c0fbb55 100644 --- a/src/_base.grouping.paras.less +++ b/src/_base.grouping.paras.less @@ -7,7 +7,6 @@ p { } pre { - // makes block code look pretty text-align: left; text-indent: 0; white-space: pre; diff --git a/src/_base.text.links.less b/src/_base.text.links.less index 9228275..59ab4ce 100644 --- a/src/_base.text.links.less +++ b/src/_base.text.links.less @@ -8,9 +8,6 @@ a { color: #00e; // default :link // color: #551a8b; // default :visited // color: #f00; // default :active - // NOTE: these used to be under `a[href]`, which selected both `a:link` and `a:visited`, - // in order to override browser default styles. However for some reason this works, - // so keeping it under `a`. } a:not([href]) { @media screen { From 870665d7e9011634cabae6380bdce1a20d16d4e4 Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Fri, 25 Mar 2016 22:19:01 -0400 Subject: [PATCH 8/9] address Chrome fz inheritance bug more tactfully --- src/__settings.less | 1 - src/_base.sections.less | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__settings.less b/src/__settings.less index 2d19c51..b82359f 100644 --- a/src/__settings.less +++ b/src/__settings.less @@ -16,7 +16,6 @@ // - IE9 and IE10 on the `font` shorthand property and on pseudo-elements/classes @g-font_size: 100%; // defined by user agent -@g-font_size: @g-1rem; // HACK fixes Chrome inheritance bug @g-line_height: 1.5; @g-vru_px: (@g-line_height * @g-1rem); // fallback for @g-vru, which is in rems @g-vru: (@g-line_height * 1rem); diff --git a/src/_base.sections.less b/src/_base.sections.less index 447dc16..5aed91f 100644 --- a/src/_base.sections.less +++ b/src/_base.sections.less @@ -15,6 +15,7 @@ body { html { // addresses support for `rem` units (otherwise these would be in `body` selector) font-size: @g-font_size; + font-size: @g-1rem; // HACK fixes Chrome inheritance bug line-height: @g-line_height; } body { From c68aad31dc8cdc9692a94f107d8348b3a8683848 Mon Sep 17 00:00:00 2001 From: Chris Harvey Date: Fri, 25 Mar 2016 22:19:31 -0400 Subject: [PATCH 9/9] rebuild stage 2016-03-25T22:19 --- doc/styles/doc.css | 30 +++++++++++++ doc/test.html | 75 ++++++++++++++++++++++++++++++++ xmeter.css | 105 +++++++-------------------------------------- xmeter.min.css | 2 +- 4 files changed, 121 insertions(+), 91 deletions(-) create mode 100644 doc/styles/doc.css create mode 100644 doc/test.html diff --git a/doc/styles/doc.css b/doc/styles/doc.css new file mode 100644 index 0000000..197b0b5 --- /dev/null +++ b/doc/styles/doc.css @@ -0,0 +1,30 @@ +/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*\ + xmeter +\*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ +/*================================*\ + doc.less +\*================================*/ +body { + background-image: url('https://chharvey.github.io/core/images/crossgrid-lined.svg'); + background-size: 1px 24px; + background-repeat: repeat; + background-position: left top; +} +.x-c-Code { + padding: 1px 2px; + border-radius: 3px; + background-color: #f4f8f0; + color: #008080; +} +.x-c-Fig { + margin-left: 1rem; + margin-right: 1rem; + padding: 0.75rem 0.5rem; + border-width: 1px; + margin-top: -2px; + border-style: solid; + border-color: #e5eaef; + border-radius: 8px; + position: relative; + background: rgba(245, 250, 255, 0.5); +} diff --git a/doc/test.html b/doc/test.html new file mode 100644 index 0000000..acf202c --- /dev/null +++ b/doc/test.html @@ -0,0 +1,75 @@ +Base Typography | Xmeter

Xmeter — Base Typography

Headings & Paragraphs

Heading 1 h1

Paragraph p +Lorem ipsum dolor sit amet, consectetur adipiscing elit. +Aliquam sagittis suscipit nunc, a cursus libero euismod at. +Nulla placerat neque massa, quis interdum leo efficitur vel. +Donec feugiat varius arcu non volutpat. +Mauris eget mauris ut mauris auctor mattis id vel justo. +Nulla dictum arcu nec suscipit mollis. +Maecenas a iaculis nisl, ut pretium est. Nulla facilisi.

Heading 2 h2

Paragraph p +Suspendisse ut auctor enim. +Aliquam viverra enim vitae ante aliquet venenatis. +Sed vel nibh sit amet sapien fermentum mattis nec non arcu. +Praesent dapibus velit quis lectus tempus, ut ullamcorper nibh facilisis. +Aenean tincidunt ante risus, semper malesuada libero consectetur id. +Praesent vel ligula ut enim porttitor porta. Aenean eu ullamcorper mi. +Integer blandit est quam, eget mattis urna scelerisque quis. +Maecenas sapien sapien, ornare nec lobortis eget, tincidunt sed ligula. +Maecenas risus nibh, volutpat sed euismod non, semper eget neque. +Integer varius egestas risus, volutpat sagittis turpis convallis eget. +Vivamus pulvinar ligula eget mi tincidunt, eget faucibus justo laoreet. +In sapien lacus, egestas faucibus laoreet eu, tempor sit amet lorem. +Sed luctus congue tortor a scelerisque.

Heading 3 h3

Paragraph p +Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. +Nunc sit amet scelerisque lectus. Cras cursus sed dui quis convallis. +Quisque id justo elit. +Fusce ut quam non sem efficitur accumsan sed id neque. +Mauris finibus dignissim gravida. +In dignissim mauris ac odio molestie volutpat. +Nulla tellus justo, finibus sed volutpat sed, tristique ac lacus. +Suspendisse sit amet fermentum sapien. +Aliquam luctus laoreet iaculis. +Proin lacinia orci vitae tellus pellentesque porttitor.

Heading 4 h4

Paragraph p +Aenean consectetur suscipit urna, non vehicula lacus blandit et. +Integer at lacus et diam tristique suscipit. +Ut cursus massa sit amet nisl convallis, elementum accumsan sapien mattis. +Vestibulum vitae magna ac tellus accumsan pharetra vulputate vitae erat. +Vestibulum est dui, elementum non sagittis ac, sagittis accumsan justo. +Donec at vestibulum diam. Nam et volutpat dolor, at pulvinar nisi. +Curabitur aliquam maximus nulla eu venenatis. +Nam aliquam lorem non felis dignissim dictum. +Pellentesque sagittis vehicula nisl non luctus. +Pellentesque eget ligula hendrerit, blandit enim consequat, dictum sem. +In quis lectus in lectus interdum laoreet eu quis quam. +Fusce auctor posuere purus, quis semper libero dignissim euismod. +Curabitur commodo mauris a sapien vulputate, eget pharetra urna facilisis.

Heading 5 h5

Paragraph p +Donec finibus ut lectus finibus pellentesque. +Nulla euismod feugiat nulla nec posuere. +Sed ac est id sem sagittis rhoncus eu ac neque. +Aliquam eu metus sagittis, porta turpis id, scelerisque magna. +Nulla venenatis elementum est, semper viverra felis tristique sit amet. +Mauris nec ipsum id orci porttitor auctor sed sit amet sem. +Lorem ipsum dolor sit amet, consectetur adipiscing elit. +Etiam tellus leo, venenatis sit amet ipsum non, sagittis feugiat ante.

Heading 6 h6

Paragraph p +Donec vel dolor ut felis dapibus ultricies vitae a nibh. +Ut semper odio est, sed lacinia ligula gravida ut. +Vestibulum facilisis viverra pulvinar. +Suspendisse maximus nisl sit amet augue vulputate, vel porta nunc molestie. +Aliquam mauris diam, pharetra vel consectetur quis, rhoncus in risus. +Donec ut quam massa. +Vestibulum sapien justo, commodo a eros in, rhoncus interdum nisl. +Etiam a porta lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem Ipsum h1

Lorem Ipsum h2

Lorem Ipsum h3

Lorem Ipsum h4

Lorem Ipsum h5
Lorem Ipsum h6
12345 address Ave br
+Washington, DC 00000 br
+United States of America
Pellentesque pre habitant() {
+  morbi.tristique = senectus;
+  et (netus = malesuada; fames < ac; turpis.egestas++) {
+    Nunc.sit += [amet, scelerisque][et];
+    Cras = {
+      lectus: cursus
+    , sed: dui
+    , quis: convallis(id () { justo Quisque.elit; })
+    };
+  }
+}
Aenean consectetur figure suscipit urna, non vehicula lacus blandit et.
Integer at lacus et diam tristique figure figcaption suscipit.
Donec blockquote vel dolor ut felis dapibus ultricies vitae a nibh.

Lists

Ordered List ol
  1. List item li
  2. List item li
    1. Nested list item
    2. Nested list item
      1. Another nested list item
      2. Another nested list item
Unrdered List ul
  • List item li
  • List item li
    • Nested list item
    • Nested list item
      • Another nested list item
      • Another nested list item
Dictionary List dl
key dt
value dd
  • 1st key
  • 2nd key
value
key
  • 1st value
  • 2nd value

Tables

table caption
theader trow 1 theading 1theader trow 1 theading 2theader trow 1 theading 3
tfooter trow 1 tdata 1tfooter trow 1 tdata 2tfooter trow 1 tdata 3
tfooter trow 2 tdata 1tfooter trow 2 tdata 2tfooter trow 2 tdata 3
tbody trow 1 tdata 1tbody trow 1 tdata 2tbody trow 1 tdata 3
tbody trow 2 tdata 1tbody trow 2 tdata 2tbody trow 2 tdata 3
tbody trow 3 tdata 1tbody trow 3 tdata 2tbody trow 3 tdata 3

Text-Level Elements

Stress

  • emphasized text em
  • important text strong
  • alternate voice/mood (scare quotes, mentioning words, foreign expressions) i
  • relevant in some context mark
  • unarticulated annotation u
  • side comment small
  • text shown to be no longer relevant s

Documentation

  • content shown to be inserted into a document ins
  • content shown to be deleted from a document del
  • definining instance of a term dfn
  • keyword or technical term b
  • abbreviation or acronym abbr[title]
  • variable var
  • quoted material q
  • reference to a work, some part of a work, or the creator of a work cite
  • superscript sup
  • subscript sub

Data

  • generic machine-readable data data
  • a fragment of code code
  • user input kbd
  • a button or key on a physical device kbd > kbd
  • sample computer output samp

Embedded Elements

Forms

Integer at lacus et diam tristique fieldset legend suscipit.Aenean consectetur fieldset suscipit urna, non vehicula lacus blandit et.
single line text inputs
date/time
without text input
check boxes
radio buttons
drop-down list (select only one)
drop-down list (select multiple)
buttons
textarea

Interactive Elements

Integer at lacus et diam tristique details summary suscipit.Aenean consectetur details suscipit urna, non vehicula lacus blandit et.
\ No newline at end of file diff --git a/xmeter.css b/xmeter.css index aec7302..6fb1bf5 100644 --- a/xmeter.css +++ b/xmeter.css @@ -1,6 +1,6 @@ /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*\ xmeter - Version: 4.0.0 + Version: 4.0.1 Licence: MIT Repo : https://github.com/chharvey/xmeter.git Home : https://github.com/chharvey/xmeter/blob/gh-pages/README.md @@ -580,10 +580,6 @@ th { text-shadow: none !important; } } -html { - font-size: 16px; - line-height: 1.5; -} h1, h2, h3, @@ -633,99 +629,28 @@ time, code, kbd, samp { - display: inline; line-height: 0; } a, s, ins, del { - display: inherit; - line-height: inherit; -} -h1 > a, -h1 > s, -h1 > ins, -h1 > del, -h2 > a, -h2 > s, -h2 > ins, -h2 > del, -h3 > a, -h3 > s, -h3 > ins, -h3 > del, -h4 > a, -h4 > s, -h4 > ins, -h4 > del, -h5 > a, -h5 > s, -h5 > ins, -h5 > del, -h6 > a, -h6 > s, -h6 > ins, -h6 > del, -p > a, -p > s, -p > ins, -p > del, -pre > a, -pre > s, -pre > ins, -pre > del, -figure > a, -figure > s, -figure > ins, -figure > del, -figcaption > a, -figcaption > s, -figcaption > ins, -figcaption > del, -blockquote > a, -blockquote > s, -blockquote > ins, -blockquote > del, -li > a, -li > s, -li > ins, -li > del, -dt > a, -dt > s, -dt > ins, -dt > del, -dd > a, -dd > s, -dd > ins, -dd > del, -caption > a, -caption > s, -caption > ins, -caption > del, -th > a, -th > s, -th > ins, -th > del, -td > a, -td > s, -td > ins, -td > del, -legend > a, -legend > s, -legend > ins, -legend > del, -summary > a, -summary > s, -summary > ins, -summary > del { - display: inline; - line-height: 0; + display: contents; } /*################################*\ xmeter | _base.sections.less \*################################*/ +html, +body { + width: 100%; + height: 100%; +} +html { + font-size: 100%; + font-size: 16px; + line-height: 1.5; +} h1, h2, h3, @@ -768,13 +693,13 @@ h1 { margin-top: 0; padding-top: 1.5rem; } -hr { - display: none; -} /*################################*\ xmeter | _base.grouping.less \*################################*/ +hr { + display: none; +} /*################################*\ xmeter | _base.grouping.paras.less diff --git a/xmeter.min.css b/xmeter.min.css index da49132..16a1665 100644 --- a/xmeter.min.css +++ b/xmeter.min.css @@ -1 +1 @@ -body,mark{color:#000}body,pre,table{text-align:left}legend,ol,td,th,ul{padding:0}caption,th{text-align:center}img,table{max-width:100%}pre,textarea{overflow:auto}body{background:#fff}blockquote,body,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,ol,p,pre,ul{margin:0}address,b,cite,code,dfn,em,h1,h2,h3,h4,h5,h6,i,kbd,pre,samp,small,strong,sub,sup,th,var{font:inherit}table{border-collapse:collapse;border-spacing:0}a,del,ins,s,u{text-decoration:none}ol,ul{list-style:none;padding:0 0 0 4rem}/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent;color:#00e}a:active,a:hover{outline:0}h1{margin:.67em 0}mark{background:#ff0}sub,sup{line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:0 0 1em}hr{box-sizing:content-box;height:0}pre{text-indent:0;white-space:pre}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}b,dfn,h1,h2,h3,h4,h5,h6,optgroup,strong,th{font-weight:700}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px}legend{border:0}*,::after,::before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:0 solid;content:' ';content:'';content:none}@media print{*,::after,::before{background:0 0!important;box-shadow:none!important;text-shadow:none!important}}html{font-size:16px;line-height:1.5}blockquote,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,ol,p,pre,table,ul{margin-bottom:1.5rem}dd>dl,dd>ol,dd>ul,dt>dl,dt>ol,dt>ul,li>dl,li>ol,li>ul{margin-bottom:0}abbr,b,blockquote>a,blockquote>del,blockquote>ins,blockquote>s,br,caption>a,caption>del,caption>ins,caption>s,cite,code,data,dd>a,dd>del,dd>ins,dd>s,dfn,dt>a,dt>del,dt>ins,dt>s,em,figcaption>a,figcaption>del,figcaption>ins,figcaption>s,figure>a,figure>del,figure>ins,figure>s,h1>a,h1>del,h1>ins,h1>s,h2>a,h2>del,h2>ins,h2>s,h3>a,h3>del,h3>ins,h3>s,h4>a,h4>del,h4>ins,h4>s,h5>a,h5>del,h5>ins,h5>s,h6>a,h6>del,h6>ins,h6>s,i,kbd,legend>a,legend>del,legend>ins,legend>s,li>a,li>del,li>ins,li>s,mark,p>a,p>del,p>ins,p>s,pre>a,pre>del,pre>ins,pre>s,q,samp,small,span,strong,sub,summary>a,summary>del,summary>ins,summary>s,sup,td>a,td>del,td>ins,td>s,th>a,th>del,th>ins,th>s,time,u,var{display:inline;line-height:0}a,del,ins,s{display:inherit;line-height:inherit}h1{font-size:32px;font-size:2rem;line-height:.75;margin-top:0;padding-top:1.5rem}h2{font-size:24px;font-size:1.5rem;line-height:1}h3{font-size:20px;font-size:1.25rem;line-height:1.2}h4{font-size:16px;font-size:1rem;line-height:1.5}h5{font-size:14px;font-size:.875rem;line-height:1.71428571}h6,input:not([type=button]):not([type=reset]):not([type=submit]),textarea{font-size:12px;font-size:.75rem;line-height:2}code,kbd,samp,small,sub,sup{font-size:.75em}hr{display:none}dd>ol,dd>ul,dt>ol,dt>ul,li>ol,li>ul{padding-left:2rem}ol{list-style-type:decimal}ul{list-style-type:disc}tfoot,thead{vertical-align:bottom}tbody{vertical-align:top}@media screen{a:not([href]){opacity:.5}}cite,em,i,var{font-style:italic}u{text-decoration:underline;color:#080}s{text-decoration:line-through;color:#b00}ins{background:#a6f3a6}del{background:#f8cbcb}dfn{font-style:inherit}abbr[title]{cursor:help;border-bottom:0}q{quotes:'\201c' '\201d';quotes:initial}q::before{content:open-quote}q::after{content:close-quote}code,kbd,samp{white-space:nowrap}code code,code kbd,code samp,kbd code,kbd kbd,kbd samp,samp code,samp kbd,samp samp{font-size:inherit}img{border:0;width:auto;height:auto;font-style:italic;vertical-align:middle}button,fieldset,input,select,textarea{border-width:1px;margin-top:-2px;border-style:solid;border-color:silver;border-color:rgba(0,0,0,.25)}fieldset{padding:0 1rem;margin-left:0;margin-right:0}button,input,select,textarea{padding:0 .25rem}textarea{width:30rem;height:9rem;line-height:1.5}button,input[type=button],input[type=reset],input[type=submit]{background-color:silver;background-color:rgba(0,0,0,.25)}input[type=search]{-webkit-appearance:textfield;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} \ No newline at end of file +body,mark{color:#000}audio:not([controls]),hr{height:0;display:none}[hidden],hr,template{display:none}body,pre,table{text-align:left}legend,ol,td,th,ul{padding:0}caption,th{text-align:center}img,table{max-width:100%}pre,textarea{overflow:auto}body{background:#fff}blockquote,body,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,ol,p,pre,ul{margin:0}address,b,cite,code,dfn,em,h1,h2,h3,h4,h5,h6,i,kbd,pre,samp,small,strong,sub,sup,th,var{font:inherit}table{border-collapse:collapse;border-spacing:0}a,del,ins,s,u{text-decoration:none}ol,ul{list-style:none;padding:0 0 0 4rem}/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}a{background-color:transparent;color:#00e}a:active,a:hover{outline:0}h1{margin:.67em 0}mark{background:#ff0}sub,sup{line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:0 0 1em}hr{box-sizing:content-box}pre{text-indent:0;white-space:pre}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}h4,html{line-height:1.5}b,dfn,h1,h2,h3,h4,h5,h6,optgroup,strong,th{font-weight:700}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px}legend{border:0}*,::after,::before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:0 solid;content:' ';content:'';content:none}@media print{*,::after,::before{background:0 0!important;box-shadow:none!important;text-shadow:none!important}}blockquote,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,ol,p,pre,table,ul{margin-bottom:1.5rem}dd>dl,dd>ol,dd>ul,dt>dl,dt>ol,dt>ul,li>dl,li>ol,li>ul{margin-bottom:0}abbr,b,br,cite,code,data,dfn,em,i,kbd,mark,q,samp,small,span,strong,sub,sup,time,u,var{line-height:0}a,del,ins,s{display:contents}body,html{width:100%;height:100%}html{font-size:100%;font-size:16px}h1{font-size:32px;font-size:2rem;line-height:.75;margin-top:0;padding-top:1.5rem}h2{font-size:24px;font-size:1.5rem;line-height:1}h3{font-size:20px;font-size:1.25rem;line-height:1.2}h4{font-size:16px;font-size:1rem}h5{font-size:14px;font-size:.875rem;line-height:1.71428571}h6,input:not([type=button]):not([type=reset]):not([type=submit]),textarea{font-size:12px;font-size:.75rem;line-height:2}code,kbd,samp,small,sub,sup{font-size:.75em}dd>ol,dd>ul,dt>ol,dt>ul,li>ol,li>ul{padding-left:2rem}ol{list-style-type:decimal}ul{list-style-type:disc}tfoot,thead{vertical-align:bottom}tbody{vertical-align:top}@media screen{a:not([href]){opacity:.5}}cite,em,i,var{font-style:italic}u{text-decoration:underline;color:#080}s{text-decoration:line-through;color:#b00}ins{background:#a6f3a6}del{background:#f8cbcb}dfn{font-style:inherit}abbr[title]{cursor:help;border-bottom:0}q{quotes:'\201c' '\201d';quotes:initial}q::before{content:open-quote}q::after{content:close-quote}code,kbd,samp{white-space:nowrap}code code,code kbd,code samp,kbd code,kbd kbd,kbd samp,samp code,samp kbd,samp samp{font-size:inherit}img{border:0;width:auto;height:auto;font-style:italic;vertical-align:middle}button,fieldset,input,select,textarea{border-width:1px;margin-top:-2px;border-style:solid;border-color:silver;border-color:rgba(0,0,0,.25)}fieldset{padding:0 1rem;margin-left:0;margin-right:0}button,input,select,textarea{padding:0 .25rem}textarea{width:30rem;height:9rem;line-height:1.5}button,input[type=button],input[type=reset],input[type=submit]{background-color:silver;background-color:rgba(0,0,0,.25)}input[type=search]{-webkit-appearance:textfield;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} \ No newline at end of file