Stack Overflow
Stack Overflow

Questions tagged [fluentui-react]

Fluent UI react or web represents a collection of utilities, React components, and web components for building web applications. A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior. Home: https://developer.microsoft.com/en-us/fluentui#/ Source: https://github.com/microsoft/fluent-ui-react

Fluent UI react or web represents a collection of utilities, React components, and web components for building web applications. A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior.

Home: https://developer.microsoft.com/en-us/fluentui#/ Source: https://github.com/microsoft/fluent-ui-react

311 questions
1
vote
1 answer

Use Grid from @fluentui/react-northstar without borders

How to use Grid and Segment in @fluentui/react-northstar without borders or horizontal lines? import { Grid, Segment } from "@fluentui/react-northstar"; Usage:
Harsh Shrivastava
  • 28
  • 3
1
vote
1 answer

How can I change the color of the Fluent-React UI's command bar?

This is my code. And I want to change the background color maintaining the hovering effect. How can I do that?
Intern
  • 51
  • 7
1
vote
2 answers

FluentUI dropdown not working in create-react-app

I created a create-react-app project on my machine. I ran npm i @fluentui/react in my project directory terminal to install the fluent ui package. I have simple code to display a dropdown, with all the correct imports import { Dropdown,…
Cameron
  • 185
  • 2
  • 11
1
vote
1 answer

React - Fluent UI DetailsList onRenderDetailsHeader

I am currently running DetailsList in Fluent UI like this: this is with headers export function OperationsTable(this: any) { return (
Alex Osipov
  • 23
  • 4
1
vote
1 answer

How do I divide the Office UI Fabric ChoiceGroup into 2 rows and 5 columns?

I am new to UI, and currently working on making on creating options using Fluent UI ChoiceGroup. I have 10 entries, let's say 0,1,2,3,4,5,6,7,8,9. I am trying to force UI to always show like 0 1 2 3 4 5 6 7 8 9 but it changes according to…
MasterMaddy
  • 23
  • 3
1
vote
0 answers

How to use docusaurus with Fluent UI?

I am now working on Docusaurus (which is a static site generator) with Fluent UI, and I don't know how to setup SSR for Fluent UI, there's no any useful information on Internet. What I've known: Fluent UI use a lib called merge-styles to achieve its…
AkiraVoid
  • 61
  • 8
1
vote
1 answer

How to change input text color of fluent ui TextField?

I simply want to change the input text color to another one. Component example is:
ingmar ramzan shidqi
  • 83
  • 7
1
vote
1 answer

What does IRenderFunction interface definition mean in FluentUI?

I'm new to typescript and have started to working with DetailsList in Fluent UI. https://developer.microsoft.com/en-us/fluentui#/controls/web/detailslist. I am looking into the prop onRenderRow which is of type…
aakashdp
  • 81
  • 11
1
vote
3 answers

cannot figure out how to control width of react-northstar Dropdown

I uploaded a sample to my github here: https://github.com/gyrevik/dropdown-width/blob/master/src/App.js Where I'm trying to control width like this:
Alex
  • 51
  • 4
1
vote
1 answer

fluent ui - How to display/overlay a Spinner component in a TextField where iconProps usually renders the icon?

I want the TextField to conditionally display the Spinner component exactly where an icon would render if you pass an icon to iconProps. I got the conditional rendering of the icon and spinner but I couldn't figure out how to include a component…
Tim
  • 51
  • 1
  • 7
1
vote
1 answer

How to remove chevron icon when providing menuProps for a FluentUI IconButton component

I would like to not show the chevron (arrow down) next to the icon in my IconButton const Support = (): React.ReactElement => { return ( ) } Do you…
Jens Madsen
  • 1,154
  • 1
  • 10
  • 18
1
vote
2 answers

fluentui/react-nortstar Menu how to provide space between content and wrapper

how do we override the styles and provide the space between the content and wrapper, tried to add styles const myTheme: ThemeInput = { componentStyles: { Menu: { root: { color: "yellow", //tried to provide maring space…
umgolla
  • 39
  • 8
1
vote
1 answer

Fluent UI React ContextualMenu closes immediately

I use ContextualMenu inside a DetailsList column. But when I click the trigger, the menu appears for a short time and immediately closes. What am i doing wrong? Is it acting like this because there are multiple renders? My code is like…
abdllhcay
  • 69
  • 2
  • 6
1
vote
1 answer

TimePicker in @fluentui/react

I am a bt confused. I can import and use TimePicker from fleuntui/react. But there is no any documentation or any other information about one. Is this a legacy, or experiments? import { TimePicker, ITimePickerProps } from…
Ilya Suglobov
  • 11
  • 3
1
vote
0 answers

Fluent UI React - About multiple column header in DetailsList

I want to create multi header like following image using DetailsList of Fluent UI React. IMAGE Then, I found this issue. That seems the same issue as I facing. According to the issue's answer, I understood that able to use…
07JP27
  • 11
  • 2
1 2 3
…
20 21