Releases: OfficeDev/office-ui-fabric-core
11.1.0
11.0.1
What's Changed
- Fix incompatibility with Angular 8.x and up. by @josteink in #1216
- Update icons to v3.70 by @Jahnp in #1210
- [admin] add M365 dev program info by @lindalu-MSFT in #1245
- Bump lodash from 4.17.15 to 4.17.20 by @dependabot in #1246
- Update README.md by @demonslayer10 in #1241
- Fix missing edit (and other) icons by @sayers24 in #1242
- Update icons.json by @fsheik in #1240
- Fix SASS compilation error with ms-animation mixin by @KevinTCoughlin in #1256
Full Changelog: 11.0.0...11.0.1
11.0.0
This release includes the icon changes captured in PR #1195 . While that change is mostly minor additions and changes to the icon font, it removes 4 icons that are no longer supported, so it's technically a breaking change if you were using those icons.
Here're the release notes adapted from that PR.
Update icons to v3.54
This release updates the base Fabric Core icon set to more closely match Fabric React's. The big news here is that this adds 356 new icons to Fabric Core. There may be some additional visual tweaks to existing icons as well, to match the latest design intent in Fabric React.
First, let's review what else has been changed.
No more .woff2 and .ttf support
After the last release of the icons, there were a number of changes to the icon font/production toolchain that resulted in some different outputs. Today, that means that .woff2 and .tt files are not included. These may be restored in a future addition, but for now, .woff is the only format that will be provided.
Renamed icons
Two icons have been renamed from their original versions. These include:
Old name | New name |
---|---|
OneDrive | OneDriveLogo |
ToggleOff | ToggleRight |
The original names have been retained in the definitions, variables, mixins, and classnames to support backwards compatibility.
Removed icons (breaking changes)
Four icons have been removed that are no longer supported for public distribution. These are considered a breaking change as they will affect the build and runtime usage of anyone using Fabric Core <=10 with any of these icons today.
Icons removed include:
- ExternalGit
- GitFork
- MTMLogo
- NonprofitLogo32
New icons
356 new icons have been added to Fabric Core. These represent requests from dozens of Microsoft product teams and other developers using Fabric Core.
- AccessibiltyChecker
- AccountActivity
- AccountBrowser
- ActionCenter
- AddHome
- AddIn
- AddLink
- AddReaction
- AddToShoppingList
- AddWork
- AlertSettings
- AllCurrency
- AppIconDefaultAdd
- AppIconDefaultList
- AuthenticatorApp
- BacklogList
- Bank
- BarChartVerticalEdit
- BarChartVerticalFill
- BarChartVerticalFilter
- BarChartVerticalFilterSolid
- Blocked2Solid
- BlockedSiteSolid12
- Blog
- BookAnswers
- BookmarkReport
- Brush
- BuildDefinition
- BulletedListBullet
- BulletedListBulletMirrored
- BulletedListText
- BulletedListTextMirrored
- BulletedTreeList
- BullseyeTarget
- BullseyeTargetEdit
- ButtonControl
- CalculatorPercentage
- CalendarYear
- Calories
- CampaignTemplate
- ChangeEntitlements
- ChartTemplate
- ChatBot
- CheckboxFill
- CheckListCheck
- CheckListCheckMirrored
- CheckListText
- CheckListTextMirrored
- Childof
- ChromeFullScreen
- ChromeRestore
- CityNext2
- ClearFormattingA
- ClearFormattingEraser
- ClearSelection
- ClearSelectionMirrored
- ClipboardList
- ClipboardListMirrored
- CloudImportExport
- ColumnVerticalSection
- ColumnVerticalSectionEdit
- CommentActive
- CommentSolid
- Compare
- ComplianceAudit
- ConnectVirtualMachine
- ContactHeart
- ContactList
- Coupon
- CRMCustomerInsightsApp
- CRMProcesses
- CRMServices
- CubeShape
- CustomizeToolbar
- D365TalentHRCore
- D365TalentInsight
- D365TalentLearn
- DatabaseSync
- Dataflows
- DataflowsLink
- DataManagementSettings
- Decimals
- DecreaseIndentArrow
- DecreaseIndentArrowMirrored
- DecreaseIndentText
- DecreaseIndentTextMirrored
- DefenderTVM
- DependencyAdd
- DependencyRemove
- Devices2
- DiagnosticDataBarTooltip
- Diamond
- DisconnectVirtualMachine
- DistributeDown
- DoubleDownArrow
- DuplicateRow
- EaseOfAccess
- eDiscovery
- EditCreate
- EntitlementPolicy
- EntitlementRedemption
- Event12
- EventDateMissed12
- EventToDoLogo
- Eyedropper
- EyeShadow
- FabricFolderConfirm
- FabricNetworkFolder
- FabricTextHighlight
- FabricTextHighlightComposite
- FabricUserFolder
- FileRequest
- FilterSettings
- FitPage
- FitWidth
- Flashlight
- FlowChart
- Flower
- Focus
- Footer
- Forum
- FrontCamera
- FunnelChart
- Game
- GenericScanFilled
- GIF
- GlobalNavButtonActive
- Go
- GoMirrored
- GoToDashboard
- GreetingCard
- GripperDotsVertical
- GroupList
- Header
- Hide3
- HistoricalWeather
- HomeGroup
- HomeVerify
- HorizontalTabKey
- IgnoreConversation
- ImportAllMirrored
- IncomingCall
- IncreaseIndentArrow
- IncreaseIndentArrowMirrored
- IncreaseIndentText
- IncreaseIndentTextMirrored
- InformationBarriers
- InkingTool
- Insert
- Installation
- InternalInvestigation
- KeyboardClassic
- KnowledgeArticle
- Link12
- LinkedDatabase
- Lock12
- M365InvoicingLogo
- MailAttached
- MailOptions
- MailSchedule
- Manufacturing
- MapLayers
- MarkAsProtected
- MedalSolid
- Media
- MicOff2
- MicrosoftTranslatorLogo
- MicrosoftTranslatorLogoBlue
- MicrosoftTranslatorLogoGreen
- MiniContractMirrored
- MiniExpandMirrored
- ModelingView
- MountainClimbing
- MuteChat
- NewMail
- NumberedListNumber
- NumberedListNumberMirrored
- NumberedListText
- NumberedListTextMirrored
- NumberSymbol
- OfficeChat
- OfficeChatSolid
- OfflineStorage
- Onboarding
- OneDriveLogo
- OpenEnrollment
- OpenInNewTab
- OpenWith
- OpenWithMirrored
- Orientation2
- PageArrowRight
- PageData
- PageHeader
- PageHeaderEdit
- PageLink
- PageList
- PageListFilter
- PageShared
- PassiveAuthentication
- PasswordField
- PenWorkspace
- Photo
- Photo2Fill
- PhotoVideoMedia
- PinnedSolid
- PinSolid12
- PinSolidOff12
- PlainText
- PlaybackRate1x
- PlayReverse
- PlayReverseResume
- PollResults
- PowerAppsCDS
- PowerBILogo16
- PowerBILogoBackplate16
- PowerShell
- PowerShell2
- Presentation
- Presentation12
- ProductCatalog
- ProductionFloorManagement
- ProductList
- ProductRelease
- ProductVariant
- ProjectDocument
- PromotedDatabase
- PublishContent
- QandA
- QandAMirror
- QRCode
- QuadColumn
- Quantity
- RealEstate
- RecruitmentManagement
- RectangleShape
- Relationship
- ReleaseDefinition
- ReleaseGate
- ReleaseGateCheck
- ReleaseGateError
- ReminderTime
- RemoveFromShoppingList
- RemoveFromTrash
- RemoveLinkChain
- RemoveLinkX
- RepeatAll
- RepeatOne
- ReportDocument
- ReportLock
- ReportWarning
- Rerun
- ReservationOrders
- ResetDevice
- ResponsesMenu
- ReturnKey
- RingerSolid
- Rotate90Clockwise
- Rotate90CounterClockwise
- SaveTemplate
- SaveToMobile
- ScaleVolume
- ScatterChart
- SchoolDataSyncLogo
- ScreenCast
- SearchData
- SearchNearby
- SecondaryNav
- SeeDo
- ShakeDevice
- Shapes
- SharepointAppIcon16
- ShieldAlert
- Shirt
- ShowGrid
- ShowTimeAs
- Signin
- SkypeArrow
- SkypeCircleArrow
- SkypeCircleSlash
- SkypeSlash
- Slideshow
- SmartGlassRemote
- SnapToGrid
- SpecialEvent
- StackColumnChart
- StackedColumnChart2
- StackedColumnChart2Fill
- StatusCircleBlock
- StatusCircleSync
- StickyNotesOutlineAppIcon
- StickyNotesSolidAppIcon
- StorageOptical
- Street
- StreetsideSplitMinimize
- SyncStatus
- SyncStatusSolid
- TabCenter
- TableComputed
- TableGroup
- TableLink
- TabOneColumn
- TabThreeColumn
- TabTwoColumn
- TagSolid
- TagUnknown
- TagUnknown12
- TagUnknown12Mirror
- TagUnknownMirror
- TeamsLogo16
- TeamsLogoFill16
- Telemarketer
- TimePicker
- ToDoLogoOutline
- ToggleLeft
- ToggleRight
- Toolbox
- Translate
- TriangleShape
- Trim
- TrimEnd
- TrimStart
- TripleColumnWide
- Uneditable2
- Uneditable2Mirrored
- UnpublishContent
- UnSetColor
- UnstackSelected
- Untag
- UpgradeAnalysis
- USB
- UserGauge
- UserOptional
- UserWarning
- Variable2
- VerifiedBrand
- VerifiedBrandSolid
- Video360Generic
- VideoLightOff
- ViewOriginal
- VisioDiagramSync
- VisuallyImpaired
- WarningSolid
- WavingHand
- WebAppBuilderFragment
- WebAppBuilderFragmentCreate
- WebAppBuilderModule
- WebAppBuilderSlot
- Webcam2
- Webcam2Off
- WebComponents
- WebTemplate
- Wheelchair
- WifiWarning4
- WorkItemAlert
- ZoomOut
- ZoomToFit
10.1.0
10.0.0
This release updates Fabric to include a new set of styles that support the Fluent Design System.
What this release includes
The Fluent style updates include new colors, type styles, depths (shadows), and motion helpers. Here are details on some of the style updates:
- Colors are updated to include neutrals that are warmer and more approachable. There are also new color palettes for different types of use cases, like Personas, Communication, and a shared set for common components like personas, sites, and more.
- Typography has been updated to a new common type ramp that is or will be in use across core Microsoft apps, leveraging the latest type weights from Fluent.
- Depth styles now include a common set of shadow levels from Fluent, which can be applied to context menus, dialogs, panels, and other surfaces.
- Motion styles have been updated to match the latest Fluent styles.
Note: this release is also backwards-compatible with 9.x classes, meaning it does not remove any existing class names. We recognize that most Fabric Core users are likely using these classes, so we've retained them in .MDL2.scss
files. We will monitor their usage to see if it makes sense to remove them in the future.
What this release does not include
We aren't including the new Office App Icons in this release (#1162). We're still working on some details to release these soon, but in the meantime, we want to get the base Fluent styles out the door.
What is Fluent?
Fluent is Microsoft's Design System, which includes the following principles:
- Adaptive: Experiences feel natural on each device
- Empathetic: Experiences are intuitive and powerful
- Beautiful: Experiences are engaging and immersive
You can read more about these principles on the Fluent Design System website.
Breaking Changes
To cleanly support the new Fluent styles, the contents of some .scss files no longer include their MDL2 styles, e.g. _Animation.scss
. Those have been moved to *.MDL2.scss
files, e.g. _Animation.MDL2.scss
. While this is not technically a breaking change if you're using Fabric.css, it will be breaking if you are using any of the MDL2 variables & mixins from the below files in 9.x
.
9.x filename | 10.x filename |
---|---|
_Color.Variables.scss | _Color.Variables.MDL2.scss |
_Font.Variables.scss | _Font.Variables.MDL2.scss |
_Color.Mixins.scss | _Color.Mixins.MDL2.scss |
_Font.Mixins.scss | _Font.Mixins.MDL2.scss |
_Animation.scss | _Animation.MDL2.scss |
_Font.scss | _Font.MDL2.scss |
If you are consuming these .scss files directly downstream, you may need to switch to the MDL2 variants to include those classes in your compiled SCSS. To use the MDL2 variables and mixins, consider importing dist/_References.scss
, which imports all Fluent and MDL2 .scss files.
What else is new
- #1144: Adds variable CDN path for icons and fonts (thanks @thornyweb!)
Deprecated
- The MDL2 styles are deprecated in the 10.x releases, but for backwards-compatibility will not be removed until a future date.
9.6.1
9.6.0
9.5.0
9.4.0
9.3.1
Fixed
-
#1083 Fixes a bug (introduced in version 9.3.0 by #1070) where animation and transition classes weren't working on many browsers, due to the incorrect usage of a media query that is not yet widely available. This fix restores animation for most users while continuing to remove it for those who prefer reduced motion and are on supported browsers.
-
#1082 Updates the license for this repository to point to the correct location of the Fabric assets license.