From a76bf9a94a2df806e801d7e51f5df80e2a195b45 Mon Sep 17 00:00:00 2001 From: Aniket Handa Date: Mon, 29 Aug 2016 18:33:23 -0700 Subject: [PATCH 1/2] Depending upon fabric-core 4.0.0, adding neutralPrimary color --- package.json | 2 +- src/components/Breadcrumb/Breadcrumb.scss | 1 + src/components/Button/Button.scss | 1 + src/components/Callout/Callout.scss | 3 +++ src/components/CommandBar/CommandBar.scss | 2 ++ src/components/ContextualMenu/ContextualMenu.scss | 1 + src/components/DatePicker/DatePicker.scss | 4 ++++ src/components/Dialog/Dialog.scss | 2 ++ src/components/DocumentCard/DocumentCardActivity.scss | 1 + src/components/DocumentCard/DocumentCardLocation.scss | 1 + src/components/DocumentCard/DocumentCardTitle.scss | 1 + src/components/Dropdown/Dropdown.scss | 1 + src/components/MessageBar/MessageBar.scss | 1 + src/components/Panel/Panel.scss | 1 + src/components/PeoplePicker/PeoplePicker.scss | 1 + src/components/SearchBox/SearchBox.scss | 1 + src/components/Toggle/Toggle.scss | 1 + src/demo/pages/GettingStartedPage/GettingStartedPage.scss | 1 - 18 files changed, 24 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 3ed922c7f4e3d..821a1c9d5563b 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "gulp-util": "3.0.7", "gutil": "1.6.4", "highlight.js": "9.4.0", - "office-ui-fabric-core": "^3.1.0", + "office-ui-fabric-core": "^4.0.0", "react-addons-test-utils": "^15.1.0", "react-highlight": "0.8.0", "source-map-loader": "0.1.5", diff --git a/src/components/Breadcrumb/Breadcrumb.scss b/src/components/Breadcrumb/Breadcrumb.scss index 57810b22b078a..52da224092422 100644 --- a/src/components/Breadcrumb/Breadcrumb.scss +++ b/src/components/Breadcrumb/Breadcrumb.scss @@ -47,6 +47,7 @@ $Breadcrumb-itemMaxWidth-sm: 116px; .ms-Breadcrumb-itemLink { @include focus-border; @include ms-font-xl; + color: $ms-color-neutralPrimary; display: inline-block; padding: 0 4px; max-width: $Breadcrumb-itemMaxWidth; diff --git a/src/components/Button/Button.scss b/src/components/Button/Button.scss index 1c66a5840e1a0..294a7cfdfebbf 100644 --- a/src/components/Button/Button.scss +++ b/src/components/Button/Button.scss @@ -13,6 +13,7 @@ @include focus-border(); @include ms-font-m; @include ms-u-normalize; + color: $ms-color-neutralPrimary; background-color: $ms-color-neutralLighter; border: 1px solid $ms-color-neutralLighter; cursor: pointer; diff --git a/src/components/Callout/Callout.scss b/src/components/Callout/Callout.scss index 62a6f701be7e9..91fee50c3f89f 100644 --- a/src/components/Callout/Callout.scss +++ b/src/components/Callout/Callout.scss @@ -51,17 +51,20 @@ $Callout-beak-slant-width: 28px; .ms-Callout-title { margin: 0; @include ms-font-xl; + color: $ms-color-neutralPrimary; font-weight: $ms-font-weight-semilight; } .ms-Callout-subText { margin: 0; @include ms-font-s; + color: $ms-color-neutralPrimary; font-weight: $ms-font-weight-semilight; } .ms-Callout-link { @include ms-font-m; + color: $ms-color-neutralPrimary; } .ms-Callout-actions { diff --git a/src/components/CommandBar/CommandBar.scss b/src/components/CommandBar/CommandBar.scss index 37873196a9afa..20464ae3a45b9 100644 --- a/src/components/CommandBar/CommandBar.scss +++ b/src/components/CommandBar/CommandBar.scss @@ -43,6 +43,7 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without .ms-CommandBar { @include ms-font-m; + color: $ms-color-neutralPrimary; position: relative; background-color: $ms-color-neutralLighter; @@ -99,6 +100,7 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without @mixin CommandBarItem-text { @include focus-border(2px); @include ms-font-m; + color: $ms-color-neutralPrimary; position: relative; background: none; diff --git a/src/components/ContextualMenu/ContextualMenu.scss b/src/components/ContextualMenu/ContextualMenu.scss index 53690997433b1..641ec962f2890 100644 --- a/src/components/ContextualMenu/ContextualMenu.scss +++ b/src/components/ContextualMenu/ContextualMenu.scss @@ -22,6 +22,7 @@ $ContextualMenu-iconWidth: 14px; .ms-ContextualMenu-item { @include ms-font-m; + color: $ms-color-neutralPrimary; position: relative; box-sizing: border-box; diff --git a/src/components/DatePicker/DatePicker.scss b/src/components/DatePicker/DatePicker.scss index 1be5ea96e3432..52e3316ac8dda 100644 --- a/src/components/DatePicker/DatePicker.scss +++ b/src/components/DatePicker/DatePicker.scss @@ -112,6 +112,7 @@ .ms-DatePicker-year { display: inline-block; @include ms-font-xl; + color: $ms-color-neutralPrimary; margin-top: -1px; &:hover { @@ -155,6 +156,7 @@ padding: 0; line-height: 40px; @include ms-font-m-plus; + color: $ms-color-neutralPrimary; } @@ -268,6 +270,7 @@ .ms-DatePicker-currentDecade { display: block; @include ms-font-xl; + color: $ms-color-neutralPrimary; height: 40px; line-height: 42px; @include margin-left(15px); @@ -325,6 +328,7 @@ color: $ms-color-themePrimary; cursor: pointer; @include ms-font-s-plus; + color: $ms-color-neutralPrimary; height: 30px; line-height: 30px; padding: 0 10px; diff --git a/src/components/Dialog/Dialog.scss b/src/components/Dialog/Dialog.scss index 85002c57df42e..a5c3bcd92e462 100644 --- a/src/components/Dialog/Dialog.scss +++ b/src/components/Dialog/Dialog.scss @@ -94,6 +94,7 @@ $Dialog-default-max-width: 340px; margin: 0; display: table-cell; @include ms-font-xl; + color: $ms-color-neutralPrimary; padding: 20px 28px 20px; width: 100%; } @@ -122,6 +123,7 @@ $Dialog-default-max-width: 340px; margin: 0 0 20px 0; padding-top: 8px; @include ms-font-s; + color: $ms-color-neutralPrimary; font-weight: $ms-font-weight-semilight; line-height: 1.5; } diff --git a/src/components/DocumentCard/DocumentCardActivity.scss b/src/components/DocumentCard/DocumentCardActivity.scss index f42563bedc908..e226b1452a42a 100644 --- a/src/components/DocumentCard/DocumentCardActivity.scss +++ b/src/components/DocumentCard/DocumentCardActivity.scss @@ -59,6 +59,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px; .ms-DocumentCardActivity-activity { display: block; @include ms-font-s; + color: $ms-color-neutralPrimary; line-height: 14px; height: 14px; overflow: hidden; diff --git a/src/components/DocumentCard/DocumentCardLocation.scss b/src/components/DocumentCard/DocumentCardLocation.scss index 59db9d3545744..987b2eed69ecc 100644 --- a/src/components/DocumentCard/DocumentCardLocation.scss +++ b/src/components/DocumentCard/DocumentCardLocation.scss @@ -2,6 +2,7 @@ .ms-DocumentCardLocation { @include ms-font-s; + color: $ms-color-neutralPrimary; display: block; padding: 8px 16px; position: relative; diff --git a/src/components/DocumentCard/DocumentCardTitle.scss b/src/components/DocumentCard/DocumentCardTitle.scss index 5fbba534a6af5..307c2fc85c704 100644 --- a/src/components/DocumentCard/DocumentCardTitle.scss +++ b/src/components/DocumentCard/DocumentCardTitle.scss @@ -4,6 +4,7 @@ padding: 8px 16px; display: block; @include ms-font-l; + color: $ms-color-neutralPrimary; height: 36px; // Two lines of text, making sure the third line is hidden line-height: 20px; overflow: hidden; diff --git a/src/components/Dropdown/Dropdown.scss b/src/components/Dropdown/Dropdown.scss index 6726dd565ba0c..d4b32dda09555 100644 --- a/src/components/Dropdown/Dropdown.scss +++ b/src/components/Dropdown/Dropdown.scss @@ -32,6 +32,7 @@ $Dropdown-selectedItem-hover-bg: $ms-color-neutralLighter; .ms-Dropdown { @include ms-u-normalize; @include ms-font-m; + color: $ms-color-neutralPrimary; margin-bottom: 10px; position: relative; diff --git a/src/components/MessageBar/MessageBar.scss b/src/components/MessageBar/MessageBar.scss index 80b21bf4d1d23..a84b4fe74650d 100644 --- a/src/components/MessageBar/MessageBar.scss +++ b/src/components/MessageBar/MessageBar.scss @@ -40,6 +40,7 @@ $MessageBar-padding: 8px; .ms-MessageBar-text { @include ms-font-s; + color: $ms-color-neutralPrimary; min-width: 0; display: flex; } diff --git a/src/components/Panel/Panel.scss b/src/components/Panel/Panel.scss index 898769306b8ff..428ec57fe7b43 100644 --- a/src/components/Panel/Panel.scss +++ b/src/components/Panel/Panel.scss @@ -314,6 +314,7 @@ $CommandBarHeight: 40px; // Header text at the top of the panel. .ms-Panel-headerText { @include ms-font-xl; + color: $ms-color-neutralPrimary; margin: 10px 0; padding: 4px 0; line-height: 1; diff --git a/src/components/PeoplePicker/PeoplePicker.scss b/src/components/PeoplePicker/PeoplePicker.scss index f7da0d8676ee0..e098e17840b0a 100644 --- a/src/components/PeoplePicker/PeoplePicker.scss +++ b/src/components/PeoplePicker/PeoplePicker.scss @@ -30,6 +30,7 @@ $personaItemHeight: 42px; .ms-PeoplePicker { @include ms-font-m; @include ms-u-normalize; + color: $ms-color-neutralPrimary; background-color: $ms-color-white; margin-bottom: 10px; position: relative; diff --git a/src/components/SearchBox/SearchBox.scss b/src/components/SearchBox/SearchBox.scss index 66da6c497df10..0bf875d64f9f6 100644 --- a/src/components/SearchBox/SearchBox.scss +++ b/src/components/SearchBox/SearchBox.scss @@ -14,6 +14,7 @@ $SearchBox-height: 36px; .ms-SearchBox { @include ms-font-m; @include ms-u-normalize; + color: $ms-color-neutralPrimary; position: relative; margin-bottom: 10px; display: inline-block; diff --git a/src/components/Toggle/Toggle.scss b/src/components/Toggle/Toggle.scss index 5a064f34b6732..cbedef75253e3 100644 --- a/src/components/Toggle/Toggle.scss +++ b/src/components/Toggle/Toggle.scss @@ -22,6 +22,7 @@ @include ms-baseFont; @include ms-font-m; @include ms-u-normalize; + color: $ms-color-neutralPrimary; position: relative; display: block; diff --git a/src/demo/pages/GettingStartedPage/GettingStartedPage.scss b/src/demo/pages/GettingStartedPage/GettingStartedPage.scss index 67844a70a6a31..194c9fd8b27b2 100644 --- a/src/demo/pages/GettingStartedPage/GettingStartedPage.scss +++ b/src/demo/pages/GettingStartedPage/GettingStartedPage.scss @@ -19,7 +19,6 @@ .ms-GettingStartedPage-banner { background: $ms-color-neutralLight; - color: white; padding: 1px 20px; margin: -20px; margin-bottom: 20px; From 991bcf1bd69445d5f031f504b3ad4c25532a36f5 Mon Sep 17 00:00:00 2001 From: Aniket Handa Date: Mon, 29 Aug 2016 18:47:55 -0700 Subject: [PATCH 2/2] Remove extra icons file Fabric-core added 400+ icon classes --- src/common/_common.scss | 1 - src/common/_fabricExtraIcons.scss | 4 ---- .../DetailsListPage/examples/DetailsList.Advanced.Example.tsx | 4 ++-- 3 files changed, 2 insertions(+), 7 deletions(-) delete mode 100644 src/common/_fabricExtraIcons.scss diff --git a/src/common/_common.scss b/src/common/_common.scss index 2ff5336ebc6ba..b7fa0d0c7cb20 100644 --- a/src/common/_common.scss +++ b/src/common/_common.scss @@ -3,5 +3,4 @@ @import './themeOverrides'; @import './focusBorder'; @import './semanticColorVariables'; -@import './fabricExtraIcons'; diff --git a/src/common/_fabricExtraIcons.scss b/src/common/_fabricExtraIcons.scss deleted file mode 100644 index 9bc6b96418aa0..0000000000000 --- a/src/common/_fabricExtraIcons.scss +++ /dev/null @@ -1,4 +0,0 @@ -.ms-Icon--GroupedAscending:before { content: '\EE67'; } -.ms-Icon--GroupedDescending:before { content: '\EE66'; } -.ms-Icon--SortUp:before { content: '\EE68'; } -.ms-Icon--SortDown:before { content: '\EE69'; } \ No newline at end of file diff --git a/src/demo/pages/DetailsListPage/examples/DetailsList.Advanced.Example.tsx b/src/demo/pages/DetailsListPage/examples/DetailsList.Advanced.Example.tsx index 1f8c780ec64ab..f66fdb5ad89aa 100644 --- a/src/demo/pages/DetailsListPage/examples/DetailsList.Advanced.Example.tsx +++ b/src/demo/pages/DetailsListPage/examples/DetailsList.Advanced.Example.tsx @@ -355,7 +355,7 @@ export class DetailsListAdvancedExample extends React.Component this._onSortColumn(column.key, false) @@ -363,7 +363,7 @@ export class DetailsListAdvancedExample extends React.Component this._onSortColumn(column.key, true)