I am using import TimePicker from '#mui/lab/TimePicker'; time picker, and I need ability to manually confirm or cancel the selection. In the documentation I see cancelText and okText options, but there are no ability to show those buttons (showToolbar is not relevant). Maybe I missed something, could somebody please help me?
`
nowiko
I had same issue, thats how i resolved it !!!
.css-1e6y48t-MuiButtonBase-root-MuiButton-root {
display: none !important;
}
Just add this class, this will hide whole div of buttons..
Related
I need to change the default icon colour in Time pickers. but I don't know the way. If you can help me with this, It's really mean to me. Changes can see the below picture.
Use the class css-i4bv87-MuiSvgIcon-root:
.css-i4bv87-MuiSvgIcon-root{
color: red;
}
You can check this demo
i am using material ui for my project and this is my textField
text field reality
as you can see there is an bottom border underline it, but i want to remove it completely, previously i usually use border: "0px" but i dont know how to customize it, this is what i want
text field expectation
thank for your time to help me out, highly appreciate your effort, hope you have a good day
you can edit in this codesandbox link: codesanboxlink
for this case you can import InputBase from material-ui
import InputBase from '#material-ui/core/InputBase';
you can see your example at codesandbox codesandboxlink
My users are complaining that the change in color for md-buttons on focus is too subtle.
What is the right way to make an adjustment to this for the default color palettes?
Append: I am looking on how to adjust the button styling when the button has focus, not looking for how to create my own theme.
Also, I am using Angular-Material 1, NOT 2
OK, for anyone else looking for this, I found the answer in angular-material.modules.closure.button and angular-material.modules.js.button
.md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]):hover {
background-color: '{{primary-600}}'; }
.md-button.md-THEME_NAME-theme.md-primary.md-raised:not([disabled]).md-focused, .md-button.md-THEME_NAME-theme.md-primary.md-fab:not([disabled]).md-focused {
background-color: '{{primary-600}}'; }
This tells me what I needed, which is that focused buttons get primary-600.
NOW I can customized the theme palletes as recommended in the first comment
toggle functions only fire on the second click. I had this problem some time ago with a datetimepicker libary. Now the problem exists with bootstrap.
Here is my Jade-Code:
ul.nav.navbar-nav.navbar-right
li.dropdown
a(href="#", class="dropdown-toggle", data-toggle="dropdown") Einstellungen
b.caret
ul.dropdown-menu
li
a(href="#") test
The dropwdown only toggles with the second click. And dont no where i have to search to find the mistake. Is there maybe a code to detect what is happend with my first click?
When is user the css to collapse on hower it works fine, with the first hover :(
ul.nav li.dropdown:hover ul.dropdown-menu{
display: block;
margin-top:0px
}
The project is to big to post it on Fiddle :(
I hope you can give me some advices.
Thanks!
One option might be using the angular-ui-bootstrap route instead of trying to get vanilla bootstrap javascript to work with your angular app. Below is a link to the angular-ui-bootstrap site; try implementing one of the angular-native directives for a drop down and see if that does the trick.
http://angular-ui.github.io/bootstrap/
Aside from that, it's hard to help if we can't recreate your problem. Can you try recreating small version of the problem in a codepen or jsfiddle?
Folks,
So I am using a angular dialogue box, however, setting custom size for this dialogue box ruins the format inside the box.
I have created a plunkr for this. http://plnkr.co/edit/yXf1kNMqhAdo3iM8dFBy
If you look at the "save" and "cancel" buttons, they appear somewhere near center of the page even though they are part of modal-footer.
Does anyone know how to resolve this.
Thanks in advance
They are appearing to the right because modal-footer has a css property set as text-align: right. They flow off of the plunker because model-body is being set as 800px in your code here: modal.css("width",'800px');.
You can add a style to override this if you want:
.modal-footer.left
{
text-align:left;
}
Updated plunker
Hope this helps.