Impressive component library for expressive web development! Build responsive projects on the web with the first front-end component library in Metro Style. And now there are even more opportunities every day!
MIT License
Bot releases are visible (Hide)
dialog
for themesm4q
, new methods: $.curry
, $.compose
, $.pipe
treeview
app-bar
, added dark
, light
themesd-menu
, added dark
, light
themesd-menu
in app-bar
collapse
componentspanel
, added dark
, light
themesexpand-button
renamed to transofrm-button
, added new states left
, right
, top
, bottom
, top-left
, top-right
, bottom-left
, bottom-right
theme-switcher
common css
for themesaccordion
for themescalendar
for themesbutton-group
for themescheckbox
for themes, style2
removedcards
for themeserror
breadcrumbs default
, added new style breadcrumbs arrow
Published by olton 5 months ago
useEffect
v-menu
grid2
Published by olton 6 months ago
d-menu
, fix interacts with other components (treeview
, sidenav-m3
, app-bar
)Published by olton 6 months ago
outline
styled-menu
Published by olton 6 months ago
Published by olton 6 months ago
Published by olton 6 months ago
Published by olton 9 months ago
Fixed older bug for dates in the calendar for any TZ
Published by olton 11 months ago
Update for using with webpack
Published by olton 11 months ago
Embed icon font into css as base64
Published by olton 11 months ago
upd pathes in mif-base.less
Published by olton 11 months ago
Minor fixes and improves, split precompiled css to metro.css and icons.css.
Published by olton 11 months ago
Fixed loading icon font.
Published by olton 12 months ago
Fixed build order, issue for outline button.
Published by olton 12 months ago
Published by olton 12 months ago
Published by olton over 2 years ago
setColor({...})
checkbox-three-state
xxxl: 1600px
, xxxxl: 1800px
, xxxxxl: 2000px
cell-xxxl-*
, cell-xxxxl-*
, cell-xxxxxl-*
, cell-*-fifth
(20%), cell-*-one-fifth
(20%), cell-*-two-fifth
(40%), cell-*-three-fifth
(60%), cell-*-four-fifth
(80%)table-search-placeholder
attributereset()
resetWith(str|obj)
onTabOpen
, onTabClose
onTab
, onTabOpen
, onTabClose
added second argument target
. Value for it child a.href
valuedata-update-uri="true|false"
(default false
). If true url hash will update with tab target valueopenByTarget("#...")
Published by olton about 3 years ago
Instpector
when table data loaded with method loadData()
, issue #1796data-on-clear
, fixed firing event data-on-change
when user click on the clear
button, issue #1802toggleState()
, issue #1799data()
for selecting option when defined, issue #1755addOptions(values = [] || {})
, removeOptions(values = [])
addOption(val, title, selected)
, removeOption(val)
1.0.1
, new global type Datetime
, and factory datetime()
1.0.0
, new global type Cake
, and factory cake()
$.ajax
($.json
, $.post
, ...) to fetch
(IE is dead)$.ajax
to fetch
$.ajax
to fetch
$.ajax
to fetch
$.ajax
to fetch
_create()
, _buid()
, _saveTableView()
, loadData()
now use fetch
, and send data to server as json
fetch
for loading datafetch
for loading datadate
for using with DatetimetoDate()
to Datetime.from()
)toDate()
to Datetime.from()
)Date
, use Datetime
Object
- Object.create()
, Object.values()
(IE is dead)String
, Array
Cake.lpad
where needlpad
, rpad
. If you need these functions, use Cake.pad
, Cake.lpad
, Cake.rpad
data-drop-full-size=true|false
(default: false), data-drop-width=int_value
to set drop container widthhintDeferred
if value of this > 0, a hint will display with delay.vertical-align
for multi-action
classcolor
onMaxClick
, issue #1735order
, zoom
with method css()
clear()
val()
, if you set argument as empty string val("")
, you clear calendar picker value$.get
for url with ?
, issue #1745div.grid role=list > div.row > div.cell
structuredata-cls-template-tag
to set class(es) for item childrendata-default-template-tag
to set wrapper element for item children, when template is not defineddata-cls-template-tag
. Now you can set many classes separated with comma to applying to elements with linked indexno-gap
class, now padding
cancels for .grid.no-gap .row > .cell*
and .row.no-gap > .cell*
Utils.isObject()
, issue #1755data-show-on-off='true'
and use attributes: data-on
, data-text-on
, data-off
, data-text-off
or i18n
configs with attribute data-locale
i18n
support with props locale.switch.on
, locale.switch.off
i18n(locale_name)
, issue #1761$.dark
open(index)
data-cls-accordion
, data-cls-frame
, data-cls-heading
, data-cls-content
, data-cls-active-frame
, data-cls-active-frame-heading
, data-cls-active-frame-content
data-use-current-slice
. If this attribute has a value true, click on select-all checkbox will only apply to the current (visible) data slice, issue #1778data-close-outside="true|false"
to close sidebar by a click outside the sidebar, issue #1777setItems([...])
Published by olton almost 4 years ago
attr
when user defining one argumentstopAll()
, pause(id)
, pauseAll()
, resume(id)
, resumeAll()
navview-pane
item height
and hover state, issue #1661makePlugin(...)
, now you can use it for set of elements.data-overlay-click-close=true|false
, default false
, issue #1668step
is not equals to 0
, issue #1676input-small
mode, issue #1675data-cls-group-name
data-display
, issue #1677Croatian
locale, thanks to dugi007
data-show-inspector-button=true|false
, data-inspector-button-icon
.data-cell-wrapper
to true
table-contaner
data-horizontal-scroll-stop
pluginExists(name)
to check if specified plugin registered in registryRGBA
, HSLA
to create with specified alpha
lpad()
, rpad()
functionsUtils.lpad()
Utils.lpad()
Component._fireEvents(...)
getWeek()
, used in calendar for showing week numbers.data-animate-func
to data-ease
op-*-hi
, op-*-low
classes0.5
data-except-keys
, data-key-separator
, data-key-delimiter
, data-trim-separator
.data-sortable
for th
.