material-blazor / material.blazor Goto Github PK
View Code? Open in Web Editor NEWLightweight Material Theme components for Blazor
License: Other
Lightweight Material Theme components for Blazor
License: Other
The Styles directory is presently published along with the nuget package, getting included in a consuming project which ought only to use <link href="_content/BlazorMdc/css/styles.min.css" rel="stylesheet" />
When a previously empty text field is populated by the browser with cached data, labels fail to float.
It isn't an MDC control
It may even need to be deprecated
Per title. Run demo in WASM mode and observe failure when clicking button to set the tab.
Prior to v1.0.0:
@attributes="[]"
, remembering that attributes are given precedence from right to left. This has particular impact when BlazorMdc uses event handlers, e.g. in the numeric input component.When a toast is requested from a dialog the visual appearance is under the dialog
If the Items parameter is an IEnumerable resulting from a LINQ query (and therefore lazy enumerated), the default radio button isn't set. This was not a problem before the migration to PMdcRadioButtonGroup.
Once a component has rendered and been intialized with Material Theme JS, Blazor must not render otherwise Blazor and the MT JS conflict with each other. Investigate rolling the pattern of using ShouldRender()
as in MdcRadioButton
and PMdcRadioButtonGroup
across all components. This ha the potential to fix one or two other issues en route.
Seems to mark up incorrectly since migration to material theme 6.0.0. Need to reveiw markup in BMdc.TopAppBar.razor.
Changing the Value parameter from the app consuming PMdcDatePicker has not effect.
Per title
Create PMdcPasswordField
Icon or not?
Toggle visibility or not?
Shows a flash of unstyled content ("FOUC") when a field that disallows blanks is cleared and then loses focus. The floating label stops floating and superimposes over the selected text.
The Material Theme icon set in MdcIcons.cs and icons.css seems incomplete - needs review.
Per the title...
Autocomplete fields are supposed to be able to disallow blanks, however this is not working for the first autocomplete on the demo page.
It was this way before the work I did on MdcSelect
Should MdcListItem form the basis for MdcList? And should MdcList ne using MdcListElement?
Also examine PMdcRadioButtonGroup.
Pros/cons/decide/resultant code structure
Seems not to be used and so is marked as deprecated with [Obsolete]
Some of the aria settings appear to be nonsensical.
Setting a BMdc.List to dense doesn't mark up correctly. This may be a material theme css issue.
@key appears to be used in situations where it isn't a contributor
I've added use of a PMdcDatePicker to my application.
It is wrapped in an identical fashion to what I have with MdcTextField:
@namespace GeneralComponents
<PMdcDatePicker Value="@pDateTimeValue"
ValueChanged="@pDateTimeValueChanged"
ValueExpression="@pDateTimeValueExpression"
Label="@pLabel"
MinDate="@pEarliestDate"
MaxDate="@pLatestDate"
SelectInputStyle="MdcSelectInputStyle.Outlined"
Style="@pAdditionalStyles" />
When I click the control to select a different date the popup is rather mangled. It's functional but ugly.
The first text field in the demo (filled) overwrites the label which doesn't move (MdcTextField issue)
The password field is using currentValueRight instead of its own backing store (demo page issue)
Empty PMdcNumericDoubleField input correctly defaults to zero value but loses floating label. This is a Flash of Unstyled Content ("FOUC").
Presently an MdcMenu is dismissed when a disabled list item is clicked. This is for review. Was previously not dismissed, but only by way of a complex overlay div blocking mouse clicks. To investigate whether there is a better solution that may also be configurable.
Cleanup MdcListItem
These classes seem superflous:
Checkbox and Radio Button ripples are misaligned when the dialog is first opened. This link is probably the solution.
Review:
Issues to review:
inline-block
from year lineThis is poorly applied only for the interaction between numeric inputs and their base text inputs. Needs to be rethought and applied on DRY principles to component bases.
The icon foundry mechanism need the following enhancements and tests:
Need to develop a policy for comments and inline documentation and to apply consistently.
a la MatBlazor
Per title, and see top app bar behaviour in the demo.
Plus componets are presently prefixed with "Mdcp" such as MdcpDatePicker
. The only thing differentiating this from core components is the fourth character, a lower case "p". To better differentiate change the Plus naming convention to "PMdc", eg PMdcDatePicker
.
Restrict splats to known values in parameter validation
JS for scrolling to the current year when opening the year pad is disabled. This is because in addition to scrolling the drop down to the right point as desired, the whole browser window is scrolled to hold the datepicker at the top of the viewport. This is undesired.
See https://github.com/BlazorMdc/BlazorMdc/blob/develop/BlazorMdc/Scripts/scripts.js#L91
I have a lurking suspicion that there is a better approach. Just not sure yet what that would be!
MdcTextField
and MdcTextArea
have TextFieldCssClass
property that is also used in PMdcCascadingDefaults
. Review its need and implementation.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.