Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UIkit 3 Ideas and Suggestions #560

Closed
saschadube opened this issue Aug 8, 2014 · 360 comments
Closed

UIkit 3 Ideas and Suggestions #560

saschadube opened this issue Aug 8, 2014 · 360 comments

Comments

@saschadube
Copy link
Member

saschadube commented Aug 8, 2014

UPDATE: Get ready... UIkit 3 beta is coming on Monday 9th, January 🎉💥


We would love to get your feedback and ideas for UIkit 3. Just post them here.

The following lists are a short roundup of all feature requests below (hope I did not miss one) and what our thoughts are about them. I will update the list if new ideas are posted.

On our todo list

Following feature requests are planned or already in development.

  • Custom dist builder (Only the components you need) - Coming with Website Relaunch
  • Switch to SVG instead of Icon fonts - Not started yet
  • New navbar style - Default Theme will be completely overhauled with UIkit 3.0
  • Bigger default font-size - Default Theme will be completely overhauled with UIkit 3.0
  • Standarize script event - Modal use uk.modal.show while Nestable use sortable-start
  • Unit-less line-heights Unit-less line-heights #461
  • Better JS documentation
  • More examples in documentation

In consideration

Following feature requests are taken into consideration.

  • Tags component for forms (Like select2)
  • Background classes like uk-background-primary
  • Sticky footers
  • A .psd file for quicker mockups

Not very likely

Following feature requests will most likely not be added to UIkit. But no final decision made. So it is open for discussion.

  • IE9 animation keyframe fallback
  • Inline calendar
  • All js in one file
  • Grid push classes for different screen sizes
  • Different tooltips (like danger, success)
  • Tree-view component
  • Form Validation
  • Navbar modifier for dark version
  • Stack multiple modals
  • Multi level drop down menu
  • Remember active tabs after reloading the page
  • Button custom active
  • Nestable with copy function

Already available

Following feature requests are already available in UIkit.

  • Sass Support - Docs
  • New dist repository for Bower - Bower Repo
  • Slideshow component - Docs, Test
  • Animations for Switcher - Docs
  • Responsive tables - Docs
  • Full screen images - Docs, Test
  • Flexbox component - Docs, Test
  • Markdown Support - Docs, Test
  • Nicer form checkbox/radio elements - Docs, Test
  • Elegant sticky headers (Scroll out and return later) - Docs, Test
  • Toggle with custom classes (like uk-hidden-small) - Docs, Test
  • Parallax component - Docs, Test
  • Accordion component - Docs, Test
  • Grid without gutter - Docs
  • Overlay with zoom effect - Docs
  • Popover component - Docs, Test

Reported bugs

Please don't use this thread to report bugs. Instead open a new issue.

@saschadube saschadube added this to the 3.0.0 milestone Aug 8, 2014
@saschadube saschadube changed the title UIkit 3 Community Requests and Ideas UIkit 3 Feedback and Ideas Aug 8, 2014
@luetn
Copy link

luetn commented Aug 8, 2014

  • Js documentation for dummies :-) (Clarifying how uikit js events work)
  • Slideshow
  • More examples
  • Fallback keyframe animation for IE (IE9 doesn't show anything in scrollspy example)
  • FlyIn, flyout and more transisitions for content ex. in switcher js
  • nestable and sortable with long lists (drag element should trigger document.scroll)
  • inline calendar
  • nicer form elements (ex checkbox with fontawesome elements)
  • selecting tags form element (selecting tags as in select2 oder chosen)
  • download minified, custom built add-on.js plus uikit.js in one file

Thank you for the great framework

@aheinze
nestable and sortable scroll with long lists works perfect in 2.11

@tbba
Copy link

tbba commented Aug 8, 2014

1+ for documentation and effects for switcher.

  • alternative menubar styles (the apple style menubar is worn).
  • alternatives for the uk-overlay. Darken and Loupe... change position of loupe, zoom effects, other icon instead of loupe, caption....
  • alternative more friendly colors and bigger type for tooltip...
  • ,more frequent updates with bug fixes for everyone not compiling but using bower.
  • integration of (commercial) widgetkit would be great, so we can use widgetkit with other CMS than Wordpress (we use Processwire).

Also 1+ for thanking you for a really great framework!

@C-Lodder
Copy link

C-Lodder commented Aug 8, 2014

The one thing I would love to see is the ability to choose which add-ons one wishes to use on the Customizer page, which then compiles a zip file with all required files, rather than just a CSS file.

Other than that, maybe a more responsive table for mobile devices. It's all very well the table adjusting to the size of the device, however if one has (for example) a 7 column table, it won't play nice on small devices and will become extremely cramped.

@mariolgr
Copy link

mariolgr commented Aug 8, 2014

I believe that the community eagerly awaits the WooCommerce integration with Yootheme Design and Layout of CSS for each of the themes released.

Currently do not have any e-commerce plugin compatible with the themes of YOO.
We have to build the CSS and design for adaptation, but never gets to the quality of design and layout that YOO team can do.

I wait all the first day of each month by this news... but today i was very happy with the blog post done by increasing my hope for this integration.

Thank YOO Team

sorry, but my english .... by google translate. =)

@zslabs
Copy link

zslabs commented Aug 8, 2014

@luetn
Copy link

luetn commented Aug 8, 2014

1+ for background classes
It would be nice to have front pages with backstretch background images

@luetn
Copy link

luetn commented Aug 8, 2014

and yes, different themes would be valuable

@DotCoyote
Copy link

Maybe a simple Slider like jQuery Glide, or something other lightweight.

@realrandal
Copy link

  1. Flexbox of course!
  2. Ability to multiple JS Addons to be fired on one element and have possibility to Bing custom jQuery too.
    Simple example: Like anchor/button with uk Smoothscroll + uk Toggler + Bind another jQuery function/event.
  3. Tweak/expand/addon to default Markdown to add custom class/ids to elements without need to write HTML every time when we want to add some more styling. Like for example Maruku have: https://github.com/bhollis/maruku
    To create custom styled lists, headers, inline elements and so on.

@zslabs
Copy link

zslabs commented Aug 8, 2014

It looks like each JS init is statically done in each component; it'd be nice to have a $.UIkit.modal.init() function to be fired for each, and then possibly add each init to a global $.UIkit.utility.allInit() to refire the selectors on one-page applications that use PJAX, SPF, Turbolinks, etc.

@aheinze
Copy link
Member

aheinze commented Aug 8, 2014

@zslabs UIkit uses MutationObservers (https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver), so on any dom change it will initiate newly added elements automatically. no need to re-fire anything.

edit:

in the current w.i.p. version you need to add data-uk-observe to the element you want to observe, e.g. body to track every dom-change

@zslabs
Copy link

zslabs commented Aug 8, 2014

@aheinze Awesome, thanks!

@tbba
Copy link

tbba commented Aug 8, 2014

Elegant sticky headers (like bootstrap): they go narrow on scroll. Or they scroll out and return as stickies on scrolling...
and pushed down footers (footer always at bottom of window, even for short pages)...

Yes with a bit of programming one can do this already but it would come handy to have it in a framework,

@luetn
Copy link

luetn commented Aug 8, 2014

  • Better integration for mobile devices for hover functions like showing caption in overlay component
    Maybe this could be made with toggle touchstart?
  • Different tooltip css (like danger, success ...)

@luetn
Copy link

luetn commented Aug 8, 2014

Page Layout

  • fixed header
  • fixed footer

@luetn
Copy link

luetn commented Aug 8, 2014

is it possible to style lists with a fontawesome icon instead of using list-style-image

@luetn
Copy link

luetn commented Aug 8, 2014

Replacing tables with divs like div class"uk-table uk-table-striped uk-table-hover"
Styling like uk-table-striped and also implementing uk-with-[medium|small...] for table-cells (=divs)

@realrandal
Copy link

@luetn Table is table and will stay table forever. If tables aren't responsive enough it should be changed by HTML/CSS/Browsers developers. Markup is simple enough.

To Sticky addon it would be nice to have ability to stick elements only inside of space it's parent (or other in set params).

@zslabs
Copy link

zslabs commented Aug 8, 2014

@realrandal @luetn Bootstrap has responsive tables which I think would be a great addition; may actually make a pull request for that.

Update

Added #563

@luetn
Copy link

luetn commented Aug 8, 2014

@realrandal you are right
in this case maybe a nomargin and nopadding grid

@luetn
Copy link

luetn commented Aug 8, 2014

sortable is not working on mobile devices (tested on an iPad)
nestable works perfect

@luetn
Copy link

luetn commented Aug 8, 2014

Maybe this is overdose
Just to mention

@luetn
Copy link

luetn commented Aug 8, 2014

As a "Wunschkonzert" (= request show) and much more overdose
A tree component like http://www.jstree.com/

@luetn
Copy link

luetn commented Aug 8, 2014

@saschadube and @allothers
Let sleeping dogs lie.
Why not paying for the uikit framework == sustainability
This is just a question. Maybe just a small amount.
In my opinion this would be fair

@C-Lodder
Copy link

C-Lodder commented Aug 8, 2014

@luetn:

  • The file Uploaded feature request you mention uses PHP, remember that UIKit is a frontend framework and already provides the interface and JS for an upload section.
  • FileTree: I don't think there is much point for this. Again, we're talking about a frontend framework, and this too would still require PHP.
  • UIKit already has a HTML editor
  • To style lists, simply remove the default styling for lists and add an icon before the text within the list.
  • Fixed header already exists, but can basic fixed footers and headers are simply enough to do yourself using CSS
  • And as per you last request for making it commercial, not everything devs do has to be charged for. YT already have commercial extensions and templates. The majority of UI frameworks out there are free so if made commercial, not me personally but lots of people would seek a different, free one.

@luetn
Copy link

luetn commented Aug 8, 2014

@C-Lodder: thank you for the answers

  • fineuploader uses many backend possibilities. Not just PHP. How do you upload with uikit?
  • jstree is javascript only. There is a PHP backend with mySQL. But on the frontend you can use a list as a tree source (pure JS)
  • WYSIWYG: sure. But redactor ist much more advanced. I am not shure wheter it is valuable to use so much time to develop an own editor
  • fixed header and footer. That is not the point for me. I am able to do it with css. But it would be a simple extension for the framework
  • commercial: this was just a question :-)

@tbba
Copy link

tbba commented Aug 8, 2014

Everything can be done without a framework. :-)
A framework just makes things (often) easier and quicker. 1+ for fixed footers

@C-Lodder
Copy link

C-Lodder commented Aug 8, 2014

@luetn

  • You cannot upload an actual file using the UIKit, as uploading is done using a server-side language, but it provides the Ajax and drag-n-drop features for you already, so all you have to do it write your upload script.
  • The editor you provided may be more advanced, but if you want to use a full blown editor, then use it and integrate UIKit. I think integrating all these big features kind of defies the definition of a UI Framework. One of the things I love about UIKit is how lightweight it is. People are already moaning about how big and heavy the likes of Bootstrap are, which I think (and hope) YT are trying to prevent from happening for UIKit ;)

@robertotremonti
Copy link

Congratulation for this update!

I was confident that you would add a more coherent primary/secondary/success/warning/danger style for all colorable elements in this new release, but you even got rid of success button.

Why this choice?
Badge element is blue only while label element has all colors.
Button element is missing warning and success colors.

@baster33
Copy link

+1 form validation.

@funky123
Copy link

+1 Tooltip (advanced) Tooltips need image/svg support!

@bassmanpaul
Copy link

+1 To @robertotremonti's coherent colour schemes.

The alert, label, notification & text components have the full range of primary, success, warning & danger.

Whereas the button doesn't have success or warning. The badge & background are missing success, warning & danger colours.

The first thing I do after adding UIkit is to add the warning colour back into the button component.

What's the reasoning behind this? Can these be added in?

@saschadube saschadube removed this from the 3.0 milestone Feb 21, 2017
@cholasimmons
Copy link

So slideshow is working now? the link points to v2.0 of the docs though...
just saying,
Slideshow is all I've been waiting for for 2 months now :D

@felixheidecke
Copy link

@global-font-weight

@randyyaj
Copy link

Sticky table header with scrollable body.

@eladnova
Copy link

In V3 are general Modals a replacement for the previous V2 Lightboxes which supported videos and images?

@zzseba78
Copy link

@eladnova Lightbox component it's under development.

@patie
Copy link

patie commented May 5, 2017

@zzseba78 will be in lightbox support for iframe/inline content? (not possible use modal, because we need in our ecommerce site group of product images and 360° rotation images)

@najafi-saeed
Copy link

najafi-saeed commented May 17, 2017

  • control on finger swipe for mobile designs
  • lazy load
  • uikit for angularjs (It is big project)
  • uk-padding & uk-padding-remove & uk-padding-small & ...

@kalvincn
Copy link

kalvincn commented May 17, 2017

add responsive with embed

@ruchernchong
Copy link

ruchernchong commented May 17, 2017

  • A standalone sidebar rather than to combine some of the uk-flex-column, uk-width to make a pseudo one.
  • More icons (I know it's now WIP. Just leaving here as tracking).

@stefanpkc
Copy link

how do you get slideshow v2 to work with uikit v3?

@ruchernchong
Copy link

@stefanpkc AFAIK UIkit v3 has no slideshow yet. Not sure if it will be implemented at a later part. For now you got to use Dotnav + Slidenav + Switcher.

@stanleyxu2005
Copy link

stanleyxu2005 commented Jul 5, 2017

  • Dark theme (uk-dark)
  • Label/Badge outline
  • Shorten class names (prefer the Bootstrap v4 name convention, e.g. small->sm;)

@eladnova
Copy link

eladnova commented Jul 5, 2017

There was a demo somewhere of a slider using Dotnav + Slidenav + Switcher

@zelds
Copy link

zelds commented Jul 14, 2017

May ask why navbar is not reponsive ?

@arysom
Copy link

arysom commented Jul 19, 2017

Multi argument for background color in parallax component?

<div uk-parallax="background-color: black, white, red, yellow" style="height:400vh;"></div>

@lesaff
Copy link

lesaff commented Aug 1, 2017

Is CSS grid layout being considered for future UIKit 3.x features?

@saschadube, why are you closing this?

@jlove73071
Copy link

What happened to responsive tabs? the documentation removed references to the responsive features previously handled with uk-data-tab

@jlahijani
Copy link

Any possibility for floated form labels?
Several approaches: https://codepen.io/collection/IjFib/

@frumbert
Copy link

frumbert commented Nov 27, 2017

Any possibility you can prevent overriding default styles (h1, p, body, etc) in favor of only uikit styles so that it doesn't interfere with other libraries so much? Or at least targetted them inside an attribute selector (e.g. [class*='uk-'] h1) - otherwise it is assumed that uikit is the only possible styling library you might use (which imho is a bad assumption)

@zzseba78
Copy link

zzseba78 commented Nov 27, 2017

@frumbert If you are working with less ( or sass ) you can not import Base component styles, wich have basic tags styling and browser consistency ( Normalize ).

//@import "base.less";

https://getuikit.com/docs/base

@saschadube saschadube changed the title UIkit 3 wish list UIkit 3 Ideas and Suggestions Sep 9, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests