Skip to content

Commit

Permalink
Reverting f562f49
Browse files Browse the repository at this point in the history
  • Loading branch information
Sérgio Gomes committed Apr 28, 2015
1 parent b5a1abd commit 1992fb7
Show file tree
Hide file tree
Showing 55 changed files with 107 additions and 120 deletions.
2 changes: 1 addition & 1 deletion docs/_templates/embedded_customizer.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
<link rel="stylesheet" href="/assets/customizer.css">
<script src="/assets/customizer.js"></script>
</head>
<body class="mdl-gen mdl-base mdl-color--grey-200" onload="init();" id="mdl-gen-body">
<body class="mdl-gen mdl-color--grey-200" onload="init();" id="mdl-gen-body">
<div class="mdl-gen-color-row">
<div class="mdl-gen-color mdl-color--red mdl-gen--light-text" index="0">Red</div>
<div class="mdl-gen-color mdl-color--pink mdl-gen--light-text is-accent" index="1">Pink</div>
Expand Down
2 changes: 1 addition & 1 deletion docs/_templates/layout.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@
<link rel="stylesheet" href="/assets/main.css">
<script src="/material.min.js"></script>
</head>
<body class="mdl-base">
<body>

<div class="demo-layout">
<div class="mdl-layout mdl-js-layout">
Expand Down
2 changes: 1 addition & 1 deletion src/animation/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="stylesheet" href="demo.css">
<link href="//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en" rel="stylesheet">
</head>
<body class="demo-page demo-page--animation mdl-base">
<body class="demo-page demo-page--animation">
<div class="demo-preview-block demo-animation demo-js-animation">
<div class="demo-animation__container">
<div class="demo-animation__container-background">Click me to animate</div>
Expand Down
2 changes: 1 addition & 1 deletion src/button/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--button mdl-base">
<body class="demo-page demo-page--button">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/card/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="stylesheet" href="demo.css">
<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>
</head>
<body class="demo-page demo-page--card mdl-base">
<body class="demo-page demo-page--card">
<div class="demo-preview-block">
<div class="mdl-card mdl-shadow--z1">
<div class="mdl-card--img-container">
Expand Down
2 changes: 1 addition & 1 deletion src/checkbox/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--checkbox mdl-base">
<body class="demo-page demo-page--checkbox">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/column-layout/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--column-layout mdl-base">
<body class="demo-page demo-page--column-layout">
<div class="mdl-column-layout">
<div class="mdl-column-layout__child">Each child</div>
<div class="mdl-column-layout__child">gets to be</div>
Expand Down
2 changes: 1 addition & 1 deletion src/footer/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>

</head>
<body class="demo-page demo-page--footer mdl-base">
<body class="demo-page demo-page--footer">

<footer class="mdl-mega-footer">
<div class="mdl-mega-footer--top-section">
Expand Down
2 changes: 1 addition & 1 deletion src/grid/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--grid mdl-base">
<body class="demo-page demo-page--grid">
<div class="demo-ruler mdl-grid">
<div class="mdl-cell mdl-cell--1-col">1</div>
<div class="mdl-cell mdl-cell--1-col">1</div>
Expand Down
2 changes: 1 addition & 1 deletion src/icon-toggle/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<link href='//fonts.googleapis.com/css?family=RobotoDraft:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>

</head>
<body class="demo-page demo-page--icon-toggle mdl-base">
<body class="demo-page demo-page--icon-toggle">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/icons/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--icon mdl-base">
<body class="demo-page demo-page--icon">
<h2>action</h2>
<div class="demo-category">
<div class="demo-icon-block"><span class="mdl-icon mdl-icon--3d-rotation" title="mdl-icon--3d-rotation"></span><span class="demo-icon-name">mdl-icon--3d-rotation</span></div>
Expand Down
2 changes: 1 addition & 1 deletion src/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@

<link rel="stylesheet" href="styleguide.css">
</head>
<body class="mdl-base">
<body>
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer mdl-styleguide">

<div class="mdl-layout__drawer">
Expand Down
2 changes: 1 addition & 1 deletion src/layout/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--layout mdl-base">
<body class="demo-page demo-page--layout">
<h3>Default layout</h3>
<p>Uses a header for large screen sizes and a collapsible drawer for smaller
screens.</p>
Expand Down
4 changes: 2 additions & 2 deletions src/list/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@

</head>

<body class="demo-page demo-page--list mdl-base">
<body class="demo-page demo-page--list">

<div class="demo-preview-block">

Expand Down Expand Up @@ -47,7 +47,7 @@ <h2>Styled List View</h2>

<p>
<div class="List">
<p class="mdl-typography--body-2">Contacts</p>
<p class="mdl-typography-Body-2">Contacts</p>
<div class="mdl-list--styled-view">
<ul>
<li>
Expand Down
5 changes: 0 additions & 5 deletions src/material-design-lite.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,3 @@
@import "tabs/tabs";
@import "textfield/textfield";
@import "tooltip/tooltip";

// Base class definition.
.mdl-base {
@extend .mdl-typography;
}
2 changes: 1 addition & 1 deletion src/menu/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>

</head>
<body class="demo-page demo-page--menu mdl-base">
<body class="demo-page demo-page--menu">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/palette/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

<title>Palette</title>
</head>
<body class="demo-page demo-page--palette mdl-base">
<body class="demo-page demo-page--palette">
<div class="demo-preview-block">
<div class="demo-palette demo-palette--red">
<div class="demo-palette-heading demo-palette-color--500">
Expand Down
2 changes: 1 addition & 1 deletion src/progress/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--progress mdl-base">
<body class="demo-page demo-page--progress">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/radio/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--radio mdl-base">
<body class="demo-page demo-page--radio">

<p>A radio button can either be a primary action or a secondary action.</p>

Expand Down
2 changes: 1 addition & 1 deletion src/shadow/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>

</head>
<body class="demo-page demo-page--shadow mdl-base">
<body class="demo-page demo-page--shadow">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/slider/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--slider mdl-base">
<body class="demo-page demo-page--slider">

<div class="demo-preview-block">
<p>
Expand Down
2 changes: 1 addition & 1 deletion src/spinner/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--spinner mdl-base">
<body class="demo-page demo-page--spinner">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/switch/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--switch mdl-base">
<body class="demo-page demo-page--switch">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/tabs/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<link rel="stylesheet" href="demo.css">
</head>
<body class="demo-page demo-page--tabs mdl-base">
<body class="demo-page demo-page--tabs">

<div class="demo-preview-block">

Expand Down
2 changes: 1 addition & 1 deletion src/textfield/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en' rel='stylesheet' type='text/css'>

</head>
<body class="demo-page demo-page--textfield mdl-base">
<body class="demo-page demo-page--textfield">

<div class="demo-preview-block">
<form action="#">
Expand Down
2 changes: 1 addition & 1 deletion src/tooltip/demo.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@

</head>

<body class="demo-page demo-page--tooltip mdl-base">
<body class="demo-page demo-page--tooltip">

<div class="demo-preview-block">

Expand Down
7 changes: 4 additions & 3 deletions src/typography/README.md
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
#Typography

##Introduction
The Material Design Lite (MDL) **typography** component is a comprehensive approach to standardizing the use of typefaces in applications and page displays. MDL typography elements are intended to replace the myriad fonts used by developers (which vary significantly in appearance) and provide a robust, uniform library of text styles from which developers can choose.
The Material Design Lite (MDL) **typography** component is a comprehensive approach to standardizing the use of typefaces in applications and page displays. MDL typography elements are intended to replace the myriad fonts used by developers (which vary significantly in appearance) and provide a robust, uniform library of text styles from which developers can choose.

The "Roboto" typeface is the standard for MDL display; it can easily be integrated into a web page using the CSS3 `@font-face` rule. However, Roboto is most simply accessed and included using a single standard HTML `<link>` element, which can be obtained at [this Google fonts page](http://www.google.com/fonts#UsePlace:use/Collection:Roboto).

Because of the many possible variations in font display characteristics in HTML and CSS, MDL typography aims to provide simple and intuitive styles that use the Roboto font and produce visually attractive and internally consistent text results. See the typography component's [Material Design specifications page](http://www.google.com/design/spec/style/typography.html) for details.
Because of the many possible variations in font display characteristics in HTML and CSS, MDL typography aims to provide simple and intuitive styles that use the Roboto font and produce visually attractive and internally consistent text results. See the typography component's [Material Design specifications page](http://www.google.com/design/spec/style/typography.html) for details.

##Basic use
MDL typography does not require the inclusion of the minified CSS and JavaScript files that drive the other MDL components. Instead, just include a link to the Google stylesheet that accesses the font and its desired variations.
Expand Down Expand Up @@ -72,7 +72,7 @@ The MDL CSS classes specify the style to use. The table below lists the availabl
| `mdl-typography--body-1` | Regular 14px (Device), Regular 13px (Desktop) | Optional |
| `mdl-typography--body-1-force-preferred-font` | Regular 14px (Device), Regular 13px (Desktop) | Optional |
| `mdl-typography--body-2` | Medium 14px (Device), Medium 13px (Desktop) | Optional |
| `mdl-typography--body-2` | mdl-typography--body-2 | Optional |
| `mdl-typography--body-2` | mdl-typography-body-2 | Optional |
| `mdl-typography--body-2-color-contrast` | Body with color contrast | Optional |
| `mdl-typography--body-2-force-preferred-font` | Medium 14px (Device), Medium 13px (Desktop) | Optional |
| `mdl-typography--button` | Medium (All Caps) 14px | Optional |
Expand Down Expand Up @@ -105,3 +105,4 @@ For working examples of the **typography** component, see the MDL [typography de
## License

Copyright Google, 2015. Licensed under an Apache-2 license.

101 changes: 46 additions & 55 deletions src/typography/_typography.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,77 +17,68 @@
@import "../variables";

html, body {
&.mdl-typography {
font-family: $performance_font;
font-size: 14px;
font-weight: 400;
line-height: 20px;
}
font-family: $performance_font;
font-size: 14px;
font-weight: 400;
line-height: 20px;
}

.mdl-typography {

h1, h2, h3, h4, h5, h6, p {
margin: 0;
padding: 0;
}

/**
* Styles for HTML elements
*/

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
@include typo-display-3($colorContrast: true);
font-size: 0.6em;
}
h1, h2, h3, h4, h5, h6, p {
margin: 0;
padding: 0;
}

h1 {
@include typo-display-3();
}
/**
* Styles for HTML elements
*/

h2 {
@include typo-display-2();
}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
@include typo-display-3($colorContrast: true);
font-size: 0.6em;
}

h3 {
@include typo-display-1();
}
h1 {
@include typo-display-3();
}

h4 {
@include typo-headline();
}
h2 {
@include typo-display-2();
}

h5 {
@include typo-title();
}
h3 {
@include typo-display-1();
}

h6 {
@include typo-subhead();
}
h4 {
@include typo-headline();
}

p {
@include typo-body-1();
h5 {
@include typo-title();
}

margin: 0 0 16px 0;
}
h6 {
@include typo-subhead();
}

a {
color: $text-link-color;
}
p {
@include typo-body-1();

blockquote {
@include typo-blockquote();
}
a {
color: $text-link-color;
}

mark {
background-color: #f4ff81;
}
blockquote {
@include typo-blockquote();
}

dt {
font-weight: 700;
}
mark {
background-color: #f4ff81;
}

dt {
font-weight: 700;
}

/**
* Class Name Styles
Expand Down
Loading

0 comments on commit 1992fb7

Please sign in to comment.