javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

mode font styling

Browse Source
This commit is contained in:
Adam Bradley
2015-12-05 11:19:09 -06:00
parent cc91591b2d
commit 5ae94e6559
15 changed files with 71 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
ionic/components/action-sheet/modes/ios.scss
View File

@@ -8,16 +8,15 @@ $action-sheet-ios-group-margin: 10px !default;
$action-sheet-ios-background-color: rgba(243,243,243,.95) !default;
$action-sheet-ios-height: 5.6rem !default;
$action-sheet-ios-padding: 1.8rem !default;
$action-sheet-ios-padding: 18px !default;
$action-sheet-ios-border-color: #d6d6da !default;
$action-sheet-ios-border-radius: 1.3rem !default;
$action-sheet-ios-border-radius: 13px !default;
$action-sheet-ios-title-color: #5f5f5f !default;
$action-sheet-ios-title-font-size: 1.2rem !default;
$action-sheet-ios-button-text-color: #007aff !default;
$action-sheet-ios-option-font-size: 2rem !default;
$action-sheet-ios-button-font-size: 21px !default;
$action-sheet-ios-button-font-size: 2rem !default;
$action-sheet-ios-background-active-color: #e9e9e9 !default;
$action-sheet-ios-destructive-button-text-color: #f53d3d !default;
@@ -71,10 +70,6 @@ ion-action-sheet {
}
}
.action-sheet-option {
font-size: $action-sheet-ios-option-font-size;
}
.action-sheet-destructive {
color: $action-sheet-ios-destructive-button-text-color;
}

1
ionic/components/action-sheet/modes/md.scss
View File

@@ -29,6 +29,7 @@ $action-sheet-md-icon-margin: 0 28px 0 0 !default;
.action-sheet-button {
background-color: transparent;
font-size: $action-sheet-md-button-font-size;
font-weight: normal;
min-height: $action-sheet-md-height;
color: $action-sheet-md-button-text-color;

2
ionic/components/app/modes/md.scss
View File

@@ -3,6 +3,8 @@
// Material Design App
// --------------------------------------------------
hr {
border-width: 0;
height: 1px;

4
ionic/components/app/normalize.scss vendored
View File

@@ -117,6 +117,10 @@ input[type="submit"] {
button {
border: 0;
line-height: 1;
font-family: inherit;
font-variant: inherit;
font-style: inherit;
text-transform: none;
-webkit-appearance: button;
cursor: pointer;

30
ionic/components/app/typography.scss
View File

@@ -1,39 +1,25 @@
@import "../../globals.core";
// Typography
// -------------------------
// --------------------------------------------------
// All font sizes use rem units
// By default, 1rem equals 10px. For example, 1.4rem === 14px
// $font-size-root value, which is on the <html> element
// is what can scale all fonts
$font-family-sans-serif: -apple-system, "Helvetica Neue", "Roboto", sans-serif !default;
$font-family-light-sans-serif: -apple-system, "HelveticaNeue-Light", "Roboto-Light", sans-serif-light !default;
$font-family-base: $font-family-sans-serif !default;
$font-size-root: 62.5% !default;
$font-size-base: 1.4rem !default; // 1.4rem == 14px
$font-size-small: 1rem !default;
$line-height-base: 1.4 !default;
$line-height-computed: 3rem !default;
$line-height-large: 1.33 !default;
$line-height-small: 1.5 !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
$font-size-root: 62.5% !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.2 !default;
html {
font-size: $font-size-root;
}
body {
font-size: $font-size-base;
font-family: $font-family-base;
}
a {
background-color: transparent;
}
.enable-hover a:hover {
opacity: 0.7;
}

3
ionic/components/button/button.scss
View File

@@ -31,9 +31,6 @@ $button-round-border-radius: 64px !default;
border-radius: $button-border-radius;
font-size: $button-font-size;
font-family: inherit;
font-variant: inherit;
font-style: inherit;
white-space: nowrap;
text-overflow: ellipsis;

1
ionic/components/content/modes/ios.scss
View File

@@ -6,7 +6,6 @@
$outer-content-ios-background-color: #efeff4 !default;
body,
ion-content {
background-color: $background-ios-color;
}

4
ionic/components/content/modes/md.scss
View File

@@ -6,6 +6,10 @@
$content-padding-md: 16px !default;
ion-content {
background-color: $background-md-color;
}
[padding],
[padding] > scroll-content {
padding: $content-padding-md;

7
ionic/ionic.ios.scss
View File

@@ -1,10 +1,13 @@
/*! Ionic: iOS */
@charset "UTF-8";
// Core Components
@import "components.core";
// iOS Components
@import "components.ios";
// iOS Body
body {
@include ios-body();
}

10
ionic/ionic.md.scss
View File

@@ -1,10 +1,16 @@
/*! Ionic: Material Design */
@charset "UTF-8";
// Core Components
@import "components.core";
// Material Design Components
@import "components.md";
// Material Design Body
body {
@include md-body();
}
// Roboto Font
@import "fonts/roboto";

8
ionic/ionic.scss
View File

@@ -1,17 +1,19 @@
@charset "UTF-8";
// Core Components
@import "components.core";
// iOS Components
.ios {
@import "components.ios";
@include ios-body();
}
// Material Design Components
.md {
@import "components.md";
@include md-body();
}
// Roboto Font
@import "fonts/roboto";

13
ionic/themes/default.ios.scss
View File

@@ -19,6 +19,9 @@ $link-ios-color: map-get($colors-ios, primary) !default;
$background-ios-color: $background-color !default;
$subdued-text-ios-color: $subdued-text-color !default;
$font-family-ios-base: $font-family-base !default;
$font-size-ios-base: $font-size-base !default;
// iOS Toolbar
// --------------------------------------------------
@@ -61,3 +64,13 @@ $icon-detail-push-background-svg: "<svg xmlns='http://www.w3.org/2000/svg' vi
$svg: str-replace($icon-detail-push-background-svg, 'fg-color', $fg-color);
@include svg-background-image($svg);
}
// iOS Body
// --------------------------------------------------
@mixin ios-body() {
font-family: $font-family-ios-base;
font-size: $font-size-ios-base;
background-color: $background-ios-color;
}

13
ionic/themes/default.md.scss
View File

@@ -19,6 +19,9 @@ $link-md-color: map-get($colors-md, primary) !default;
$background-md-color: $background-color !default;
$subdued-text-md-color: $subdued-text-color !default;
$font-family-md-base: "Roboto", "Helvetica Neue", sans-serif !default;
$font-size-md-base: $font-size-base !default;
// Material Design Toolbar
// --------------------------------------------------
@@ -58,3 +61,13 @@ $item-md-padding-icon-bottom: 10px !default;
@function ripple-background-color($button-color) {
@return rgba( red($button-color), green($button-color), blue($button-color), 0.1);
}
// Material Design Body
// --------------------------------------------------
@mixin md-body() {
font-family: $font-family-md-base;
font-size: $font-size-md-base;
background-color: $background-md-color;
}

3
ionic/themes/default.scss
View File

@@ -18,6 +18,9 @@ $link-color: map-get($colors, primary) !default;
$background-color: #fff !default;
$subdued-text-color: #666 !default;
$font-family-base: -apple-system, "Helvetica Neue", "Roboto", sans-serif !default;
$font-size-base: 1.4rem !default; // 1.4rem == 14px
$toolbar-background-color: #f8f8f8 !default;
$toolbar-border-color: #b2b2b2 !default;
$toolbar-text-color: $text-color !default;

4
scripts/snapshot/snapshot.config.js
View File

@@ -8,8 +8,8 @@ exports.config = {
domain: 'ionic-snapshot-go.appspot.com',
//domain: 'localhost:8080',
specs: 'dist/e2e/**/*e2e.js',
//specs: 'dist/e2e/searchbar/**/*e2e.js',
//specs: 'dist/e2e/**/*e2e.js',
specs: 'dist/e2e/action-sheet/**/*e2e.js',
sleepBetweenSpecs: 350,