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 hidden (Show)
Published by olton over 5 years ago
m4q
m4q
m4q
Published by olton over 5 years ago
setMaxDate
, setMinDate
, issue #1374val()
methodPublished by olton over 5 years ago
fix use strict
Published by olton over 5 years ago
m4q
Published by olton over 5 years ago
data-length
to data-key-length
margin-top
for lists inside a lists, ex: ul > ul
data-expanded
to data-expand
, fix for using with m4q
Published by olton over 5 years ago
.input-small
for using with input
, select
, spinner
, tag-input
, keypad
, file
, issue #1245$.on
and addEventListener()
customButtons()
for add custom buttons at runtimemargin-top: 1rem
for class .table
margin-top: 1rem
for ul
, ol
, dl
data-input-format
value
to setup component date4
setContent
, setTitle
, setIcon
, changePlace
isJQueryObject
to isJQuery
isM4Q
, isQ
. Method isQ
return one of isJQuery
or isM4Q
apple magic mouse
and firefox
events-area
when source changedexpandNode
and collapseNode
eventsdata-actions
for predefined dialogdata-on-tabs-scroll
scrollStart
, scrollStop
events was removedPublished by olton over 5 years ago
hotkey
at runtimeUncaught ReferenceError: function is not defined
for onchange
eventflex-card
to create card in flex modeldata-on-events-scroll
source
data
to dataSet
Published by olton over 5 years ago
data-on-data-load-error
template
template
and value wrapper this.cellValue
Metro.pagination
begin
and end
template symbols with third argument {beginToken, endToken}
data-method
, data-request-data
data-on-html-load
, data-on-html-load-fail
, data-on-html-load-done
line-height
for p
, .text-leader
, .text-leader2
to 1.2
data-on-toggle
.data-on-next-page
, data-on-prev-page
$.on()
or addEventListener()
data-on-next-page
, data-on-prev-page
, data-on-first-page
, data-on-last-page
, data-on-finish-page
metro{ComponentName}Setup
to set up all components on the page with own global options set.canResize
propertystartAll
, moveAll
, stopAll
data-on-data-load
, data-on-data-loaded
, data-on-data-load-error
changeSource
, changeData
row
for eventhtml
for event with custom htmlPublished by olton over 5 years ago
skill-box
, social-box
, more-info-box
white
op-*
alpha value from 0.7
to 0.1
open
, it will be open after initializationmetro4:about
. Thanks to Ken Kitay
Metro.events.startAll
, Metro.events.stopAll
, Metro.events.moveAll
. Constants contains both mouse and touch.change
when user drop files into drop areainput[type=submit]
, input[type=reset]
, input[type=button]
.data-half="true"
margin-top
to display*
, h1-h5
and .h1-.h5
text-ellipsis
to caption
updateItem(key, field, value)
, getIndex()
, rebuildIndex()
, getItem(key)
tr.data('original')
to get table row original datatd.data('original')
to get cell original datamargin-bottom
place-right
to right-side
for right side quotestay-open
. When an element has this class, an element can't be closed when the user clicks on the document.100ms
center center
data-cover-position
data-scroll-speed
to 1
data-scroll-speed
to 1
12px 24px
primary
, alert
, info
, warning
, ...primary
, alert
, info
, warning
, ...each
functioneach
function.accent-block
for using with accent colors classes primary
, alert
, info
, warning
, ...data-close-button
data-full-screen-mode="desktop"
d-menu
data-drop-filter
. Filtering elements on closing.data-show-marker="false"
Published by olton over 5 years ago
pullClick()
for emulate pull button click at runtime.focusableItems
to add focus state for itemsdata-active-state="true|false"
to add active state for menu items.badges
container for menu item for collect menu item badges.data-box
container for navigation view panedata-cls-head-cell
.breadcrumb-item
classmultiple
option, issue #1338length
, minlength
, maxlength
for select with multiple
optionPublished by olton over 5 years ago
.vertical-layout
for icons-*
view modePublished by olton over 5 years ago
justify-content
for days-row
keyInObject
onSearch
for clearing search fieldtoggleNode
, pr #1326index > 9
, issue #1328group-list horizontal
Published by olton over 5 years ago
icon
and title
if these not definedchange
when nodes selected/deselected, issue #1313Published by olton over 5 years ago
align-items
property for selected
and tag-input
, pull-request #1306, issue #1305change
for autocomplete
feature, issue #1310val(...)
, issue #1308data-popover-text
, issue #1309tiles
and notifies
with classes .charm-tile
and .charm-notify
Published by olton almost 6 years ago
Published by olton almost 6 years ago
Published by olton almost 6 years ago
on-select
for FF when user drops fileson-select
for IE11 when user drops filesonChange
eventdata-on-data-load-error
Happy new year!
Published by olton almost 6 years ago
.content-container
data-size
to set sidebar widthdata-position
to set sidebar right
or left
(default)contains(val, idx)
toArray(delim, type, format)
this function is equal to Utils.strToArray
data-exclude-day
. Comma separated string with day number from 0 (Sunday) to 6 (Saturday)data-show-week-number="true|false"
data-week-number-click="true|false"
data-on-week-number-click="..."
data-on-day-draw="..."
day-border
and attribute data-day-border="true|false"
date
now support additional input attribute data-value-format
for non ECMAScript datesdate
now support additional input attribute data-value-locale
for non ECMAScript datesappbar
, bottomnav
, bottomsheet
, tabsmaterial
data-bullet-style
to data-bullets-style
data-bullet-size
with values default
, mini
, small
, large
cycle
data-popover-timeout
to 10
, issue #1277storage
and session storage
combined into one object. Access to objects remained unchanged: Metro.storage
, Metro.session
String.toDate
now support locale
as second parameter: "21 грудня 1972".toDate('%d %m %y', 'uk-UA')
items-list
, feed-list
, group-list
to use with not a list element.data-horizontal-scroll-stop
. You can use this attribute to define media to stop scrolling.Published by olton almost 6 years ago
init(options)
, now you can set toast top
position and distance
. See docs for details.dropdown-toggle
, drop-up
, drop-left
, drop-right
data-min-sizes
comma separated valuesidenav-counter-expand-*
, issue #1269spacing
font-weight
to override it when use in wordpressline-height
to override it when use in wordpress.form-group
onSlideShow(HTMLElement slide)
, onSlideHide(HTMLElement slide)
start-screen
for scroll on mobile devicesPublished by olton almost 6 years ago
required
, invalid
, valid
classes now works only for inputs.data-use-required-class
to disable or enable class required
for inputs with data-validate=required
onPopoverShow
, issue #1258disabled
for inputs with role
.stop-select
, .stop-pointer
deleteItem
, deleteItemByName
deleteItem
data-horizontal-scroll
to enable horizontal scrolling for wide tabledata-cls-table-container
data-tabs-type
. This attribute sets new tab types for expanded horizontal tabs. Values: text
, group
, pills