Semantic UI 1.0 发布,前端 UI 框架

来源: 投稿
作者: NinjaSquid
2014-11-24

Semantic UI 1.0 发布了,改进记录包括:

Breaking Changes

  • Word Order - Many multi word variations now require proper word order, for exampleleft alignedorright floatedclassnames must be adjacent. This is to prevent conflicts with other multiple word variations

  • Form - Date field has been removed, use aui icon inputwith acalendar iconinstead

  • Label - Corner labels no longer support text, only icons.

  • Dropdown - Sub menus inside dropdowns now need a wrapping div text around sub-menu descriptions

  • Checkbox - Checkbox "enable" and "disable" have been replaced with "check" and "uncheck"

  • Modal - Modalleftandrightsections are now replaced withimageanddescription

  • Accordion - Accordions are now unstyled by default allowing for simpler coupling with other UI without having to override styles. Styled accordions are now included as a variationui styled accordion

  • List - List item selectors are now more strict, list items must be immediate children ofui listorui list list

  • Item - 0.x.x's UI card has been adjusted heavily. Vertically listed content should useui itemwhile floated grouped content should continue to useui card. Some 'card' view content has been slightly adjusted. Please refer to documentation

  • Header / Icon - Inverted headers and icons no longer invert background colors, but instead use a lighter version of colors more legible on dark backgrounds. Inverted circular icons, still however invert the color of the circle.

  • Input - Labeled inputs now havecornerleftandtoplabel types. Any labeled inputs should be converted tocorner labeled inputto preserve functionality from0.x

  • Modal - allowMultiple (allowing multiple modals at once) is now set to false by default.

  • Table - Tables are no longer striped by default, instead you must specify the 'striped' variation

  • Transition - Complete, and Start callbacks are nowonCompleteandonStart

Enhancements

  • General - CSS animations now hint with will change properties to increase performance in supported browsers

  • General - Many modules now use DOM Mutations and event delegation to allow content adjustment after initialization

  • Accordion - Accordion now includes all icons in an embedded font instead of requiring icons

  • Button - Now has compact form, used for fitting into tight spaces

  • Button - Now has CSS loaders to allow loading state to maintain other styles

  • Checkbox - Now correctly handles read-only and disabled, has read-only and disabled states

  • Checkbox - All styles have been redone. Standard checkboxes are now based around PX and not EM making sure there are no unusual circles or rounding issues. Checkboxes also now use a custom font for glyphs instead of CSS tricks.

  • Checkbox - Checkbox now have afireOnInitsetting for firing callbacks on page load

  • Checkbox - Checkbox now receive acheckedclass when checked, making it easier to write css selectors on checked checkboxes, for example when using sibling selectors.ui.checked.checkbox + .content { // style }

  • Dropdown - New dropdown type, searchable selection for large lists of choices

  • Dropdown - Dropdowns can now be initialized directly on a<select>element without any html

  • Dropdown - New action combo will change text of adjacent button, select will select element but not change text

  • Dropdown - Many new content types now work inside dropdowns, headers, dividers, images, inputs, labels and more

  • Form - Form now has a success state which will automatically display success messages

  • Dimmer - Dimmer will now automatically determine whether click-to-close is enabled bysettings.on

  • Dimmer - Multiple dimmers can now be used on the same context withdimmerName

  • Dimmer - Dimmer variations can be specified when creating a dimmer from javascript usingvariationsetting.

  • Form - Grouped fields and inline fields can now have labels

  • Form - Forms in 'success' state will now show success messages inside

  • Form - Inputs now use 1em font size and correctly match selection dropdown height

  • Form - Inverted form now properly styles loader

  • Form - New field typerequiredformats labels to show filling out field is mandatory

  • Grid -ui dividercan now be used inside of row columns as well asvertically divided gridvariation

  • Grid - Grid rows and columns now support color variations

  • Grid - Grid has been rewritten to automatically create row flow without row wrappers

  • Grid - Divided and celled grids can now be inverted for dark backgrounds

  • Grid - Elements inside a grid that are not rows or columns will now align properly

  • Grid - Fixed page grid allows for fixed pixel size containers used with a grid instead of percentage

  • Grid - Vertically divided grid now does not include left/right gutters in divider

  • Header - Linked headers now receive link colors

  • Image - Newbordered imagevariation

  • Item - Items now have a horizontal list view for content lists

  • Label - Added tag label and empty circular label style

  • Label - Now has compact form, for fitting into tight spaces

  • Label - Now has more sizes available

  • List - Child lists can now be formatted to sit inside text content

  • List - List images can now specify vertical alignment

  • List - List spacing defaults have been adjusted to be more consistent

  • Popup - Popup can now allow itself not to be closed when hovered over

  • Popup - A popup element can now be specified on initialization.

  • Reveal - Reveals now all use css properties with GPU acceleration

  • Popup - Positioned popups will now extend in the opposite direction to fit better with floated content

  • Rating - Rating now uses an embedded icon font to maximize compatibility

  • Rating - Rating can now automatically generate icons without including them

  • Rating - Rating can use data attributes to specify individual ratings

  • Sidebar - Sidebar now has tall / very tall variations for resizing top/bottom sidebars

  • Shape - Shape now is better at calculating sizes when animating

  • Shape - You can now disable repeated animations by setting, so animation wont queue if side is currently visible

  • Steps - Steps can now have icons, descriptions and titles. Step default theme has been modified significantly to be more flexible.

  • Table - Tables now have 'basic' and 'very' basic variations

  • Transition - Transition will now keep block position of elements hidden with visibility hidden

  • Transition - Transitions now will handle multiple display types more consistently

  • Transition - Transition now has a newstartcallback, before animation starts

  • Transition - Complete callback now does not occur if animation is interrupted before completing

  • Transition - You can now specify the final displayType of a transitioning element in metadata or settings (not just automatically detected)

  • More untracked changes we're added as well

    ** Bug Fixes **

  •             See Closed GitHub Issues

完整内容请看发行注解: https://github.com/Semantic-Org/Semantic-UI/blob/master/RELEASE-NOTES.md

Semantic UI—完全语义化的前端界面开发框架,跟 Bootstrap 和 Foundation 比起来,还是有些不同的,在功能特性上、布局设计上、用户体验上均存在很多差异。

展开阅读全文
64 收藏
分享
加载中
最新评论 (22)

引用来自“管梨员”的评论

新的主题,太帅了。 所有的example跑了一遍,非常顺畅。 棒!
好吧,我发错地方了
2014-11-27 13:24
0
回复
举报
新的主题,太帅了。 所有的example跑了一遍,非常顺畅。 棒!
2014-11-27 12:54
0
回复
举报
刚才mvvm算在js层面也不全对,其实三层内的工作他都有。
2014-11-26 15:11
0
回复
举报
毕竟是国外刚成熟的一个轻量框架,要IE8的自行ZUI,bt,amazeUI去啊,要支持IE6的就自己写css吧,反正也没法加特效和响应式,就整天hack吧。我觉得国内兼容按此规则,1,js层面兼容到ie6, mvvm用knockout,avalon还保持对IE6支持,json补丁array补丁打好还是可以的。2,DOM操作层面,html5shiv补丁,然后还有jquery撑着。 3, 样式层面 ie6 7下能操作就不错了,IE8无响应式固定宽度,无圆角阴影无css3动画,可保证基本交互。
2014-11-26 15:01
0
回复
举报

引用来自“缪斯的情人”的评论

国内开发者最常用的句子:1.不支持ie8,垃圾 2.有没有中文文档?3.求破解码。。。。
这是实实在在的需求,IE版本支持不够的话根本就不敢用,还有很多客户的机器浏览器是IE6,让客户自己去升级浏览器,还是跟自己过不去
2014-11-26 10:06
0
回复
举报

引用来自“TerryZ”的评论

IE8都不支持,太不符合国情了

引用来自“卡夫”的评论

对于淘汰IE的进程有这样一句话: 明日复明日, 明日何其多. 为何国内市场如此抱残守旧, 开发者也是有责任的.
360不应该对老旧的xp系统提供补丁支持,微软停止对xp的更新服务是迫使用户放弃使用该系统。
2014-11-26 10:06
0
回复
举报
IE 9+ (Browser prefix only),果断放弃了!
2014-11-26 10:03
0
回复
举报
感觉突然就1.0啦,不错,正准备在项目中使用。
2014-11-26 08:23
0
回复
举报
国内开发者最常用的句子:1.不支持ie8,垃圾 2.有没有中文文档?3.求破解码。。。。
2014-11-25 22:33
0
回复
举报
很不错,如果支持ie8就更好,只能用pintuer拼图框架了。
2014-11-25 22:31
0
回复
举报
更多评论
22 评论
64 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部