Semantic UI 2.0.0 发布,前端界面开发框架
Semantic作为一个开发框架,通过HTML语言帮助创建令人赏心悦目、响应式的布局
作者的话
这件事情终于搞定了。这个更新日志大概有10页纸那么长,所以我事先说声抱歉。我尝试将重要的变动都放在更新日志的最上面,来帮助大家更快的了解。
谢谢每一位朋友。
下载:2.0.0.zip
Semantic UI 2.0.0 发布,更新内容如下:
迁移指导
迁移不会太困难,只要注意以下这些重要改进:
-
Modal - If you are using a modal with image content, you will need to use image content on the parent element. This is because flex rules require parent styling that the previoustable-row rules did not.
-
Modal - Modal will now only close on buttons matching deny or approve selector. Any button that should hide modal on click should either match one of these selectors, or call$('.ui.modal').modal('hide') onclick.
-
Grid - page grid has been deprecated. page grids used percentage gutters which made it unnecessarily difficult to style responsive page content. Moving forward we recommend usingui container a fixed width responsive container for holding page contents.
-
Dropdown - Dropdowns will now change opening directions automatically based on available screen space. If you need to force a dropdown direction use dropdown({ direction: 'upward'})
-
Form Validation - Form validation now passes settings through a fields object. This is to make form initialization match other components. The previous syntax will continue to work but will produce deprecation notices in console
-
Checkbox - Checkbox fireOnInit now defaults to false. Checkboxes now also do not require javascript to function.
-
Dropdown - Dropdown item description now are floated in default theme and should be included before other item content
-
Form - grouped inline field no longer display horizontally. Use inline field instead for horizontal inline field groups.
-
Input - pointer-events have been removed from icon in icon input unless a link icon is used. This is to make sure the hitbox for focusing an input includes the icon.
-
Popup - Popups are no longer exclusive by default. Opening a popup will not necessarily close other visible popups. You can change this behavior by using the setting exclusive: true. Additionally the default theme now uses 1rem size for standard popups.
-
Colors - Default colors have been adjusted, which may cause slight changes in your design. New colors have also been added to fill in missing gaps in color naming.
-
Segment - Segment no longer includes a clearfix by default. You will need to specify aclearing segment to clear floated content.
-
Rail - Rail now uses border-box instead of content-box. This means manually specified rail widths will now need to account for padding. This was added to fix issues where rail height: 100% would incorrectly match content when a rail had padding.
-
Menu - tiered menu has been removed in 2.0. This may be rewritten in the future, but was not up to the standards of the rest of the library and has been removed.
-
Tab - onTabInit and onTabLoad have been renamed to onFirstLoad and onLoadrespectively. This is to conform to the naming conventions of other modules (no self reference). Previous callbacks will continue to work but will produce deprecation notices in console. Two new callbacks onVisible and onRequest have been added as well.
-
Button - wide variations using numbers 2 wide, 3 wide have been removed due to incompatibilities with some build tools. Please use two wide, or three wide instead.
-
Video - The undocumented video module has been renamed to embed. Behaviors remain the same, but users need to adjust their javascript init to $('.ui.embed').embed();
-
API - API onFailure will now be called in all failure conditions, when a request is errored (504, 404 etc), aborted (page change or CORS), or JSON does not pass successTestfunction. onError and onAbort will also fire for each specific failure condition.
新 UI 元素
-
Container - Containers are fixed width containers meant for holding page contents, and are a simpler alternative to ui page grid, view more examples in docs
-
Multiselect - New multiple dropdown types have been added. Many new dropdown improvements have been added including tagging/tokenizing features and loading data through API requests.
-
Embed - New embed component allows for responsive iframe embeds that maintain their aspect ratio. Embed can be used with 油Tube or Vimeo videos, along with placeholder content to avoid loading third party libraries until a user chooses to interact with the video.
主要改进(务必要看!)
-
Site - Added new colors olive, violet, brown and grey. These are available in all elements with color variations. Thanks @lemartialou
-
API - API can now be used with mocked responses, and custom AJAX requests.mockResponse has been added to resolve request with a prespecified JSON object, or a synchronous function callback.
-
API mockResponseAsync has been added for custom asynchronous requests. This allows you to specify a custom async callback to resolve an API request, helping with integration with libraries like Ember or Angular that may wrap AJAX requests.
-
API - API callbacks now have an onResponse callback that can adjust a servers response before it is parsed by other callbacks for success or failure conditions. Thanks@mnquintana
-
API - API now provides a local caching setting to avoid server roundtrips for identical urls by using cache: 'local'. This is not enabled by default. Local caching is useful for results that should return the same values across a single session, for example when querying an autocomplete.
-
Card - Cards now support multiple custom content blocks. Content blocks and images can now appear in any order.
-
Checkbox - Checkbox no longer require javascript to function.
-
Checkbox - Added support for indeterminate checkboxes, along with new stylings.
-
Checkbox - Now includes separate behaviors for triggering state changes without invoking callbacks set checked vs checked
-
Dropdown - Added remote API integration with dropdown, to allow search selection to query against a remote dataset.
-
Dimmer - Dimmers now have a blurring variation which apply a glass-like effect when dimmed
-
Dropdown - Dropdowns now automatically observe changes in menu and will update selector cache with new additions
-
Dropdowns - Added ability to add custom choices to all search selection dropdowns (multi/single) using allowAdditions: true setting. Search now displays error messages on no results in all cases.
-
Dropdown - Keyboard shortcuts have been added for selecting dropdown choices, for example "N" will scroll to "New York" in a state selection list, similar to native <select>behavior.
-
Dropdown - Added new dropdown variation scrolling dropdown and scrolling menu, this can be used to include a scrollable section inside a dropdown menu.
-
Dropdown - Dropdown will automatically animate upward if there is not enough space to appear below.
-
Dropdown - Using page up and page down keys will now scroll menus by a page at a time
-
Form - Forms now use flexbox for creating field groups. Inline fields now support (x) widesizing using flex
-
Grid - Grids now use flexbox, columns are now all equal height by default. New flexbox alignment types like stretch have been added for easier vertical alignment.
-
Multiple UI - Many components now use flexbox, which means previous confusing fixes likefont-size: 0; to remove white-space from inline block is no longer necessary. Removing this hack, now means any element can be a direct child of grid or menu.
-
Modal - Added new settings blurring and inverted which automatically set a modal's dimmer to either inverted or blurring.
-
Menu - Menu now uses flexbox. This allows menu items to match each others heights regardless of each items content size. right menu content should now follow other menu content instead of preceding it (no longer uses float).
-
Grid - Grids are now flexbox and equal height by default, the equal height variation can safely be removed
-
Popup - Popup has been rewritten to drastically improve performance, especially when testing multiple positions.
-
Transition - Fallback javascript animations have been removed from UI components like dropdown and popup to increase performance. This removes need for expensive pseudo selectors like :visible, :animated and :hidden and reduces filesize.
-
Form Validation - Form validation now uses a single settings object like other modules. Using (fields, settings) will continue to work but will produce a deprecation notifications inconsole
-
Form Validation - Form validation now supports many new validation rules, including some specifically for use with multiple select values.
-
Item - Items now uses flexbox for layout.
-
Message - icon message now uses flexbox for layout
-
Menu - vertical tabular menu, a vertical tab menu, has been added
-
Input - All input types use flexbox for layout
-
Segment - Segments now support complex nesting, many new rules for how segment groups should appear inside groups
-
Segment - New horizontal segment groups make laying out auto resizing text columns much easier.
-
Sidebar - iOS will now correctly report scrollTop values for document or body when using a sidebar. Chrome on iOS no longer has issues with fixed content not sticking immediately when using a sidebar.
-
Shapes - Shapes now correctly adjusts for margin on sides
-
Steps - Steps now use flexbox, fluid steps now center content inside each step
-
Steps - Steps no longer need item count and will automatically divide evenly
-
Transition - Transition code has been optimized to increase performance. 100% improvement on first animation, and 40% improvement on subsequent animations.
-
Visibility - Using .visibility({ type: 'fixed'}) will now automatically add a placeholder element which will swap places with an element when it is attached to the viewport. This should make fixed content drastically simpler.
-
Visibility - Visibility and sticky now use a more performant pub/sub pattern that will only attach a single event to context scroll.
-
Visibility - Added two new visibility callbacks onOnScreen and onOffScreen, which occur, most obviously when an element first appears in or out of a browser's viewport.
功能增强
-
Site - Added many new site variables, including the ability to control input size across all UIinputPadding, along with more border colors, accents, and colors.
-
Accordion - adds onOpening and onClosing callback (before animation) to go with onOpen,onClose (after animation) Thanks @cluppric
-
Accordion - Added on setting for specifying accordion trigger event.
-
Activity Feed - Activity feed has been rewritten to use flexbox
-
API - API now has new settings throttleFirstRequest and interruptRequests. Interrupt requests will abort a previous request on an element when making a new request.throttleFirstRequest, sets whether the first request or only subsequent requests should be throttled when a throttle duration is specified.
-
Build Tools - Build tools will now display pre-specified errors when a theme file is missing or an element specifies an unavailable theme.
-
Build Tools - Adjusting site.variables will now rebuild all UI, instead of just site.less
-
Button - Added :focus styles for all button types, all button examples in docs now are keyboard focusable using either <button> or tabindex where appropriate.
-
Card - Card now includes a centered variation
-
Checkbox - Checkbox will now gracefully correct behaviors invoked on the child input element instead of the ui checkbox.
-
Checkbox - Reduced kb size of icon font
-
Divider - vertical divider inside ui grid now accounts for column padding
-
Dropdown - Nested scrolling menus now support keyboard selection, e.g. pressing "A" for apple, and keyboard scrolling.
-
Dropdown - Dropdowns now have match setting to specify whether to match on text,value or both
-
Dropdown - Multi select dropdowns now have new settings for specifying maximum selection count
-
Dropdown - Dropdown has new placeholder setting for setting placeholder text in javascript
-
Dropdown - Added showOnFocus option that lets you specify whether dropdown menu should show on focus
-
Dropdown - fullTextSearch: true now uses fuzzy search (same as ui search)
-
Dropdown - Page down and page up now works with dropdown menus
-
Dropdown - Dropdown initialized with disabled prop on an option will now correctly appear disabled
-
Dropdown - Added disabled item state, disabled items will automatically be skipped with keyboard selection
-
Form - Added a host of new styles for form fields autocompleted by your browser, including autocompleted error, and focus states
-
Form - Added placeholder color rules for IE, ms-input-placeholder
-
Form - Fix errored field dropdown keyboard selection color
-
Form - Adds form success state
-
Form Validation - Added is valid behavior, returns true/false if form is valid
-
Form Validation - Added different[field] rule which requires a field to be different than another field
-
Form Validation - data-validate now takes precedence over other validation matching schemes like name or id
-
Form Validation - New rules for matching against custom regular expressions
-
Form Validation - Form validation now has minCount, maxCount, and exactCount for validating multiple selections
-
Grid - celled grid now removes internal cells on mobile and tablet when used withdoubling grid responsive variation.
-
Grid - Added large screen only and widescreen only responsive variations for grid.
-
Grid - equal width grids now works without row wrappers
-
Grid - rows can now be stretched as well as middle aligned, bottom aligned and top aligned!
-
Grid - Fixed margins on internally celled grid
-
Grid - celled and internally celled grid now use flexbox instead of display: table;
-
Headers - Added new header type sub header, useful for displaying small headers alongside text content. See examples in the header docs
-
Image - Images now include a spaced variation for adding whitespace around images when used inline with text.
-
Input - Added placeholder color rules for IE, ms-input-placeholder
-
Input - Action input now supports multiple buttons, and dropdown
-
Label - Labels now have active and active hover states
-
Label - Label now sets an img height even when not using an image label
-
List - Any content inside a ui list can now be vertically aligned
-
Menu - Add examples/documentation for fixed menu
-
Menu - Added stackable menu variation for simple responsive menus
-
Menu - Added many new variables to menu
-
Menu - Fixed several inheritance issues for dropdown item inside menu appearing as menu item.
-
Menu - Horizontal menus now set a default image size for images / logos
-
Menu - Menus items are now slightly more padded
-
Menu - The hover/active state of dropdown item have been adjusted to match item. Dropdown styles can be themed specifically inside menu.
-
Menu - Vertical dropdown menus are no longer 100% min-width
-
Modal - Modal now uses an adjusted scale in transition in the default theme, that should be more subtle and work better with long modal content.
-
Modal - Modal onApprove and onDeny now receive the activating element as the first parameter. Added documentation about using return false to avoid hiding element on click.
-
Modal - Modal content now uses flex, image content now requires image content class on parent to allow for flex stylings.
-
Popup - Popup now defines a transform-origin so animations will be affected by the direction the element is placed
-
Popup - onShow and onHide callback can now cancel popup from showing or hiding by returning false
-
Popup - Added more size variations for popup mini, tiny
-
Progress - indicating labels now are more legible use separate css variables fromindicating bar color
-
Reveal - Added new active state that allows you to show reveal programatically
-
Search - Cache can now be cleared using $('.search').search('clear cache')
-
Segment - Added padded and very padded segment variations
-
Search - Search now operates off a unique id generated by result position to retrieve results. For example category #1's first result is 'A1' . Previously result titles were used as their "id", which could cause issues with duplicate titles, or results that do not contain a title.
-
Search - Search will now automatically add class category when using type: category.
-
Search - Search will now generate results container if one is not present on init
-
Search - Search now uses em for resizes, making sure it will resize with the surrounding content
-
Search - Search prompt now has focus styles defined if not using ui input
-
Segment - Added clearing segment for cases that need a clearfix.
-
Sidebar - Improved animation performance through performance debugging. Sidebar now caches, width, height, rtl direction on load.
-
Site - Fixed mixed globals @defaultDuration and @transitionDuration usage to use a single variable across all UI @defaultDuration, the same for @defaultEasing and@transitionEasing
-
Site - Added in pageOverflowX variable, default theme hides horizontal scrollbars on body
-
Site - Added default focus colors for all color variations
-
Site - All floating/raised variations now inherit from a global @floatedShadow making theming easier
-
Sticky - Sticky now internally caches current scroll position when cantFit = true to avoid getting DOM property on scroll.
-
Statistic - Added new evenly divided group variation, for example three statistics shows 3 per row
-
Statistic - Statitic group now use flex. Styles have been updated.
-
Steps - Added attached steps, which can now be attached to other UI like segment
-
Tabs - Tab will now manually correct page scroll position when linking to an in-page anchor in a hidden tab
-
Tabs - Added new callbacks onTabVisible and onRequest
-
Tabs - Added parseScripts option, defaults to once parsing inline scripts only first load
-
Table - Adds selectable table variation, which shows hover effect on row when hovering
-
Table - Added vertical alignment variations to ui table
-
Table - Added single line table variation which prevents text from wrapping
-
Transition - Adjusting style or class during a transition, will no longer reset the change after transition completes.
-
Transition - Transition will no longer force visible/hidden with inline styles if onCompletecallback sets visibility.
-
Visibility/Sticky - Visibility and sticky now refresh automatically after page content loading to deal with changes in position from images loading
-
Visibility/Sticky - Visibility now uses pub/sub pattern to greatly improve scroll performance when attaching multiple events
-
Visibility - Visiblity includes a new setting checkOnRefresh which detemrines whether visibility callbacks should occur on resize or refresh
-
Visibility - Visibility image will now wait to lazy load images that are above the current screen position, not just below.
Bugs 修复
-
All Modules - Performance logging now delays 500ms instead of 100ms for console logging to ensure all logs are captured in one group
-
All Modules/Transition - Transitions no longer use rotateZ(0deg) to trigger GPU display of visible state. This causes issues with transform creating new stacking context that can disrupt z-index.
-
Accordion - Fixed bug where exclusive: true could sometimes cause other accordion element animations to get stuck when animating rapidly
-
API - API longer uses readyState = 0 as sole check for request abort, this may accidentally trigger with JSONP or CORS requests.
-
API - Fixed this context of beforeSend to use stateContext not element
-
API - Fixed loadingDuration not correctly delaying requests when invoking with.api('query')
-
Build Tools - Fixes issue with out of date minify dependency causing rules with background: inherit; to be removed.
-
Button - Fixed attached buttons 1px offset when attached to segment and menu (border vs box shadow border)
-
Card - IE11 now can correctly use flexbox cards THanks @Widcket
-
Checkbox - Fix disabled checkbox sometimes displaying hand cursor
-
Checkbox - Fixes nested dropdown inside checkbox causing issues
-
Checkbox - Fix :focus styles only applying if checkbox is unchecked
-
Divider - Hidden divider now correctly hides vertical dividers
-
Divider - Fixes single icon alignment inside vertical divider or horizontal divider
-
Divider - Fixed slight offset in vertical divider when it automatically adjusts to horizontal divider inside a stackable grid
-
Dropdown - focus after changing tabs will no longer cause menu to re-open Thanks@trevorharwell
-
Dropdown - Fix issue with search dropdown refocusing on self the first time after "tabbing" away in Chrome
-
Dropdown - Fixes issue with headers disappearing inside of ui dropdown when nested in ui menu
-
Dropdown - Fixes onChange to fire when input value changes, not just when menu UI changes
-
Dropdown - Dropdowns with transition: none now work correctly.
-
Dropdown - Fixed issue where sortSelect was relying on object key enumeration order which is browser dependent and unreliable. It now uses a sort function which functions the same in all browsers
-
Dropdown - Fixed issue with search selection not changing text when reselecting same value from list
-
Dropdown - Fixed min-width issues causing background to not appear behind unwrapped text with white-space: nowrap
-
Dropdown - Dropdown menu now use same font size as dropdown
-
Dropdown - Fixed dropdown metadata attribute caching causing issues with React integration
-
Dropdown - Fixed border radius on sub menu when aligned left
-
Dropdown - Fixed inline dropdown icon not aligning with content
-
Dropdown - Fixed behaviors called on <select> after initialization not being correctly applied to ui dropdown
-
Dropdown - Fixed issue with matching boolean values, and using set selected with trueor false
-
Dropdown - Fixed search dropdown submitting parent form when enter shortcut pressed
-
Dropdown - Fixed dropdown menu items should not center inside of a center aligned container.
-
Dropdown - Fixed some cases where onChange would not occur for values matching equality against '', for example 0
-
Form - Form will no longer set a height for textarea using the rows property
-
Form - inline fields are now 1em and do not match label's reduced size
-
Form - field inside fields no longer produce double sized margins.
-
Form - Form sizes and input sizes now inherit from site.variables
-
Form Validation - Fixed bug causing match rule not to work as expected.
-
Form Validation - Fixed clear and reset causing validation error to appear on checkbox if empty rule was set on checkbox.
-
Form Validation - Form validation now validates correctly on <select> change
-
Form - Fixed autocompleted ui selection dropdown having dropdown icon z-index issues
-
Form/Input - ui labeled input inside form will no longer escape column width. ui fluid input will now use input widths shorter than browser default.
-
Grid - Fixed responsive styling for grid types, more consistent display for divided, celled,on mobile
-
Grid - Fix doubling row not working correctly inside a different doubling grid (css spec issue)
-
Grid - Fix doubling grid incorrectly applying width to (x) column row
-
Grid - First column on stackable grid no longer receives top margin
-
Grid - x column wide inside equal width/height now cannot grow beyond column size
-
Grid - Fixes colored grid columns not appearing when not nested in rows
-
Icon - Fixes ascending and descending icon being swapped
-
Icon - Fixes phone icon only appearing as alias call
-
Image - rounded image and circular image now apply border radius to all child elements, fixing dimmers, and other content rounding
-
Input - Fixed improper left padding on transparent left icon input Thanks @zxfwinder
-
Input - Fixed placeholder color not changing correctly on focus Thanks @zxfwinder
-
Input - Fixed right padding on labeled input that were not corner labeled
-
Label - Labels inside header now vertical align better by accounting for line height offset
-
List - horizontal list are now aligned middle by default, while vertical lists are alignedtop.
-
List - Fixes numbers not appearing when using inverted ordered list Thanks @pcj
-
List - a elements inside a ui list will no longer apply styles on ui elements like buttonThanks @ahtinurme
-
List - Fixed divided bulleted list child lists getting wrong indent
-
List - Bullets and numbers are no longer selectable in bulleted list and ordered list
-
List - Fixed inverted bulleted list bullet color
-
List - Fix first element touches border on ui horizontal celled list
-
List - Added many new variables for link stylings inside list, added separate variables and defaults for child-list spacing
-
Loader - Fix position of inline centered loader to be centered correctly
-
Message - Message now uses @lineHeight from site.variables
-
Menu - Fixed menus like left fixed right fixed are all now class order dependent.
-
Menu - Fixed 1px border on last element of inline menus like pagination menu or compact menu
-
Modal - Modal no longer hides page scroll bar causing dimmed page content to jump positions.
-
Modal - Fixed bug where clicking an element detached from dom would cause modal to hide prematurely
-
Modal - Clicking on other modals will no longer close open modal when allowMultiple: true
-
Modal - Fixed scrolling class not being removed after opening a normal modal after ascrolling modal.
-
Message - Updated all message colors for legibility
-
Message - Close icon position adjusted to align with headers
-
Menu - Fixes divider appears on last element of (x) item menu
-
Menu - Fixed top attached menu not having margin-top, and bottom attached menu not having margin-bottom
-
Menu - Menu now has a min-height that matches standard item padding
-
Menu - dropdown menu in a secondary pointing menu or tabular menu now receive distinct active styling from other active item
-
Menu - Fixed arrow position in pointing menu to be more consistent, round to exact pixels and account for arrow border width
-
Menu - Fix issue with pointing arrow having too high a z-index and appearing above ui dropdown menu
-
Modal - scrollable modal now correctly adds padding below modal
-
Modal - Modal with detachable: false inside ui sidebar pusher element will now show correctly
-
Popup - Popup now correctly adjusts if data attributes change
-
Popup - Fixes issue with min-width in firefox exceeding max-width causing element to not wrap correctly
-
Popup - Popup will now produce an error message and not mistakenly appear in the top left corner of page, if called with a popup or target that does not exist.
-
Popup - Popup will no longer appear incorrectly if the targeted element is not visible on page
-
Popup - Fixed bug which could cause pre-existing inline popup to be removed from DOM after hiding
-
Popup - Fixes popup offstage position calculations with pages including horizontal scrollbars
-
Popup - Added addTouchEvents to specify whether touch events should be added to trigger popup on mobile
-
Progress - Fixed bug where percentage complete values between 0-1% would display incorrectly (0.5% would show as 50%)
-
Rail - Rail 100% height now uses border-box to ensure exact height match to container
-
Rating - Rating now correctly adjusts if data attributes change
-
Reveal - Removed masked reveal, all reveals are masked by default
-
RTL - Fixed rtl: 'both' in semantic.json not building both versions of source correctly.
-
Search - Search will no longer incorrectly produce an error when API settings are passed through metadata
-
Sidebar - Top/Bottom sidebar will now show scroll bars correctly when taller than 100% page height
-
Sidebar - Fixed bug where having a style[title] in page causing page not to be pushed correctly
-
Sidebar - Last menu item now has a border when sidebar and menu are used together
-
Segment - Segment groups can now be raised or piled or stacked
-
Search - Fixed category search not applying active styles correctly to category names
-
Search - Fixed onSelect not returning the correct value when using type: category
-
Search - Fixed onSelect returning the first term that matches the beginining of the selected value not the exact value.
-
Search - Fix loading search with an icon button causing double loaders.
-
Search - searchFields setting now correctly replaces default fields instead of adding the user fields to defaults
-
Search - Calls to set value or query now obey minCharacterLength
-
Search - Search API calls now use the same level debug settings as search
-
Steps - Fixes bug where ordered steps had smaller numbers in IE10
-
Steps - Fixed bug where stackable steps were not working correctly
-
Sticky - Fix issue with sticky content scroll css transition causing element to scroll too slowly when cannot fit on screen.
-
Sticky - Fix issues when pushing: true with sticky content having incorrect bottom spacing, when container has bottom padding
-
Sticky - Fixed issue with sticky content animating width on display in some cases.
-
Tab - multiple tab groups initialized together with context: 'parent' will now each use their own parent
-
Tab - Tabs now use the standard component design pattern internally
-
Table - Fixes sorted column are not correctly centered with center aligned due to margin on sort icon
-
Table - Fixes ascending and descending icons were reversed in table
-
Table - very basic table now works together with padded table
-
Table - Fix inheritance of text alignment and vertical alignment
-
Transition - Fixed bug where transition out would cause unwanted focus event in IE if element has focus
-
Transition - Calling an out animation during an in animation with queue: false now correctly calls the complete event of the original animation
-
Transition - Fixed bug where transition could sometimes not occur when an element was determined to always be hidden
改进
-
All Modules - All modules now default to verbose: false
-
Accordion - Accordion no longer sets a font-size to better couple with other components defaults
-
Button - Button focus color now uses hoverColor background instead of blue box shadow
-
Button - basic colored button now grow their border size to 2px in default theme on hover
-
Breadcrumb - Fixed breadcrumb em rounding, adjusted distance in default theme
-
Card - Card styles have been adjusted, link card now raise to show selection. Colored variations now have shadows.
-
Checkbox - Toggle now uses @primaryColor
-
Dropdown - Dropdown padding values now resolve to exact pixel values from em
-
Dropdown - item description is now floated by default
-
Feed - Removed extra text pointer border
-
Form - set value no longer automatically calls validate form
-
Grid - Small computer page grid gutters have been adjusted from 8% to 3% to allow for roomier layouts on small screens.
-
Grid - Vertically divided grids now double row spacing to account for dividers
-
Grid - center aligned no longer centers rows, just text. Use centered grid to center a grid column on the page.
-
Header/Table/Divider - These components now pull border color defaults fromsite.variables instead of using their own values
-
Image - avatar image size has been slightly decreased
-
Image - mini image default width has been increased to 35px
-
Item - item description now longer sets a max-width
-
Icon - disabled icon now have pointer-events again.
-
Label - Label size now varies by type. pointing label are now 1em by default.
-
Label - Padding on corner label has been increased
-
Input - Input now use em instead of rem so they will inherit the size of the elements they are nested inside
-
Progress - Update contrast on indicating, update default styles. Fixed some examples
-
Menu - Menu now uses border for borders instead of box-shadow
-
Menu - secondary pointing menu has had some slight design tweaks, thinner lines, more padding
-
Menu - Active sub-menu items are now bold
-
Menu - Menus no longer have additional borders on active item in the default theme
-
Menu - tiered menu has been removed
-
Menu - Increased contrast on inverted menu selection for legibility
-
Modal - Modals now used fixed widths and not percentage widths. Widths might be slightly different.
-
Modal - Modal no longer observes DOM changes by default, added setting to enable
-
Message - Slightly increases box-shadow
-
Popup - Popups now default to exclusive: false and will not hide other popups when opening
-
Popup - Popup no longer produces a console error when a position cannot be found on the page.
-
Rating - Rating styles have been adjusted to use subtle transitions and tweaked color values.
-
Segment - Clearfix has been removed from ui segment
-
Sidebar - Sidebar legacy animations have been removed. 3D transforms are now available in all supported browsers.
-
Search - Slightly adjusted search result theme for clarity
-
Segment - Segment now uses border for border instead of a second box-shadow, this may adjust position by 1pixel
-
Statistic - Statistic label styles have been updated
-
Site - Additional font variables have been added to site to help clarify variable purpose.
-
Site - Increase contrast on default hovered/down colors for colored variations
-
Site - Page background is now #FFFFFF by default instead of an offwhite #F7F7F7
-
Site - Adjusted global line height to the closest even pixel value
-
Table - Table header colors and padding defaults have been slightly adjusted
-
Table - Horizontal cell padding has been slightly reduced, and cell borders are slightly lighter.
-
Transition - Transition no longer checks for vendor prefixed animation-name css property. This was introduced in jQuery 1.8
-
Transition - Some transition have been modified so that the in animation is more telegraphed than the out animation, which may now recede more gently.
-
Visibility - In returned calculations object, visible and hidden are renamed to onScreenand offScreen, since this describes more accurately what the value represent
其他:
-
Chinese - 新的中文镜像官方站启用 http://www.semantic-ui.cn
Semantic UI—完全语义化的前端界面开发框架,跟 Bootstrap 和 Foundation 比起来,还是有些不同的,在功能特性上、布局设计上、用户体验上均存在很多差异。
Semantic UI 特点:
-
文档和演示非常完善
-
易于学习和使用
-
配备网格布局
-
支持 Sass 和 LESS 动态样式语言
-
有一些非常实用的附加配置,例如inverted类。
-
对于社区贡献来说是比较开放的。
-
有一个非常好的按钮实现,情态动词,和进度条。
-
在许多功能上使用图标字体。
Semantic UI 对浏览器的支持:
-
Last 2 Versions FF, Chrome, IE (aka 10+)
-
Safari 6
-
IE 9+ (Browser prefix only)
-
Android 4
-
Blackberry 10