Questions tagged [bootstrap]
questions about twitter's open source bootstrap framework
68
questions
0
votes
1
answer
49
views
Different heading sizes for different platforms in design tokens [closed]
Currently I'm doing an experiment with my first Design System(I have chosen Bootstrap) and Design Tokens(Style Dictionary npm module)
I configured and build all good,
Later I wanted to achieve as ...
2
votes
1
answer
164
views
What is the best way to add edit and delete buttons to a modal?
I have a task data visualization modal, but I need to add an option to edit or delete these tasks. Where in this modal could I insert buttons to delete or edit?
2
votes
0
answers
82
views
How can I make an essential navigational treeview sidebar work on mobile?
I'm currently working on a web application that will have significant user-created content. I
would like to organize this content hierarchically, with a side-bar on the left to navigate, some buttons ...
- 133
0
votes
0
answers
37
views
Best way to show employee performance data in 5 minute blocks for multiple employees performing various tasks throughout the day?
I am working on web development project that will let warehouse managers view their employee's performance.
There are nine different tasks that an employee does repeatedly throughout the day. The ...
- 101
3
votes
1
answer
266
views
Best way to display an editable list of list
I'm working on a web project and I have a list of list which can be edited. It's displayed within a modal, I can resize it as I want so it's not that big of a deal.
My main problem is I don't really ...
-1
votes
1
answer
45
views
What design changes will improve visual appearance of the calculator [closed]
This is the HTML code for a very basic calculator. I am at beginner level on bootstrap and definitely beginner level designer. what are some changes i can do to make the visual appearance better. i ...
- 99
2
votes
3
answers
652
views
Better layout of many checkboxes with help text
I have a page for configuring access rights in a website. There are a number of checkboxes in the form. Each of these checkbox have a help text hover tooltip that provides a more detailed explanation ...
- 123
1
vote
1
answer
102
views
Too large space for input fields
I'm struggling with a form (in Bootstrap 4) which takes the whole (fixed) container width, there is nothing else displayed on the screen. It looks okay-ish on smaller screens, but on large ones it's ...
- 113
0
votes
1
answer
75
views
Is it a problem if my form takes up twice as much space in web form than it does in the desktop application?
I am trying to migrate some forms from a desktop implementation to a web implementation, which should still primarily be used by desktop users.
Currently, we have a generic out-of-the-box theme (the ...
- 101
2
votes
2
answers
632
views
Responsive nav sidebar with company logo and information
Currently, our team's browser app looks like this:
up to this point, we built our app to target desktop. However, because we're moving to Android, it is imperative that we can also effectively ...
- 163
2
votes
2
answers
131
views
Best way to display a lot of schools information on a single webpage?
I'm a front end developer and I need a page to display information about all schools in my city (52).
I tried using Bootstrap Cards and an input where the user will type and the cards bellow will be ...
- 23
1
vote
1
answer
102
views
Configuration for a timegrid
I have a React+Bootstrap app which displays a timeline of events, to which the user can add a grid, with vertical markers at regular intervals. The default interval is 1 second, so a vertical line is ...
- 113
2
votes
2
answers
202
views
Bootstrap nav bar with variable background color - best way to handle this?
I'm working on the UX for an application with a bootstrap top navigation bar whose background color will not be consistent because resellers can change it to match their branding. At the moment, the ...
- 133
0
votes
1
answer
272
views
Best way to organize search form interface?
I have a tab in my application where users can search Accounts. The account table has two different types of accounts, User and Staff type. User type is one that has a username, password, etc. Staff ...
- 101
0
votes
2
answers
223
views
Long List and details in same panel
I'm Using bootstrap collapsable panel to display a list of items (revisions) in table format, I want to display the details of each item in the panel next to the table, this looks cluttered now, ...
1
vote
2
answers
414
views
What heading to use in a Bootstrap alert [closed]
In Bootstrap there are dedicated alerts.
https://v4-alpha.getbootstrap.com/components/alerts/
According to the code on that site, the headings in an alert shall be h4, but I'm not quite sure that's ...
- 859
2
votes
2
answers
211
views
Where to place the button to open a DataTable and fill input fields based on selection?
I have a wizard that has four steps. On the first step, there is a form with user data inputs. I need to have a button that opens up a modal with a datatable, and based on the selection on that table, ...
- 21
1
vote
1
answer
65
views
Language pair lists
I need to implement UI for language pair selection in Chrome extension. The simplest solution is 2 comboboxes with language list (variant 1).
But i think it takes too long to open a combobox, find ...
- 107
1
vote
1
answer
88
views
Need help with button layout on small device
I have the following button layout on my web app and it looks fine on larger screens..
On portrait iPad or smaller it looks like this..
I'm not sure what the best way to display, hide/show these ...
- 113
0
votes
1
answer
52
views
How to improve the usage of multiple similar data
I want to improve mock which is basically a form with similar data all around. The product I'll be discussing here is web, based on a modified bootstrap 3 look.
Where I work, we are now discussing a ...
- 103
1
vote
1
answer
823
views
What's a good way to display Important Notice headings on a blog?
I have a blog/content website that has notices on the landing page, done using Bootstrap.
A notice is a piece of time-critical information that expires (almost, but not quite, an alert). There won't ...
- 111
0
votes
1
answer
150
views
What are the benefits and drawbacks of using 2 or more CSS Framework? [closed]
I have experience in Bootstrap, Foundation, and Sematic UI.
On my next application, I am planning to use
Bootstrap for Grid
Foundation for Menu & Side nav
Semantic UI for Forms, icons, etc.
...
- 101
0
votes
3
answers
124
views
Why would users prefer to use a diluted layout when given the choice?
Some web apps from Google such as Gmail and Drive offer a "comfortable" option with lots of wasted white-space, which I'll refer to as being diluted for lack of a better term.
I'm creating a web app, ...
- 339
0
votes
1
answer
109
views
How can I design my form better? [closed]
I have a price calculation form which looks very basic. I want to make it look little better. Like the '+' and '-' button look like bootstrap button and having a shadow. I also want to have a subtle ...
- 1
3
votes
1
answer
152
views
Why are left nav bars becoming more popular in darker colours?
Over the past 18 months i have noticed that a lot of twitter bootstrap admin and other themes with left nav bars are now using a black or dark blue colour.
e.g. https://wrapbootstrap.com/themes/admin
...
- 175
1
vote
1
answer
779
views
What are the differences between icon and button badges?
iOS style badges are overlayed atop the upper right part of the icon. It's usually red with white text.
When displayed inline on a button or next to a header or link, IMHO, the badge seems to take on ...
- 11
0
votes
1
answer
253
views
Adding/cloning a section of form repeatedly in a modal popup
Here is the scenario:
There is a modal popup in which each step has a certain form fields. on the last step, I need to repeat a section (last 3 fields) on a form repeatedly.
Here is what I thought:
...
- 131
6
votes
5
answers
762
views
User choose between % or $
I'm working on an e-commerce application and have come across this scenario multiple times. The user needs to enter an amount, which can be in dollars (any currency) or percent. The crux of the ...
- 163
0
votes
2
answers
622
views
Single Input Form - Save button below or to side?
I'm playing around with Bootstrap's Input Group Addons and I'm struggling to decide which is better from a UX perspective.
versus:
This is a single input form to add priorities to a list (for ...
- 103
3
votes
3
answers
452
views
UI For Selecting Column Width
I'm creating an application that builds a form using simple UI options (a la Cognito or Wufoo).
My current issue is that I'm trying to think of a way to display an option to define the width of the ...
- 1,629
1
vote
2
answers
309
views
Separating components in a component-based UI [closed]
I've got a page for a Team Overview that currently shows everything that is possible to do with a team.
I think that the design for this is loud and hard to read at first glance. The current ...
- 13
0
votes
3
answers
588
views
How do I make extremely basic data look presentable? [closed]
I have a modal that is so boring and ugly I cannot stand to look at it. In a user table, the user can press a button to view all details about the user (the table only shows name, role, etc). This ...
- 11
3
votes
1
answer
142
views
Advice on how to re-order elements for smaller screen size
I have a web app that displays data in tables. And there's different options to display that data.
In full size the options show as follows:
The two blank boxes are input boxes and together with the ...
- 31
0
votes
2
answers
6k
views
Bootstrap:Multiple page navigation within a modal
I am working on a sprint management tool.The scrum master gets to select from a list of bugs available to him.
Once he selects and hits 'Add bugs' - he needs to provide the justification individually ...
- 105
1
vote
1
answer
960
views
Field allignment with error labels
I am looking for possible solutions that could be used to make our forms look better when displaying errors.
Our application is using Government of Canada Intranet Theme (WET 4) with bootstrap. The ...
- 11
1
vote
1
answer
135
views
Are there any practical reasons as to why one should show css outline on a focused radio button?
A while ago, I found a css stylesheet for checkboxes and radio buttons, which could use font-awesome icons as symbols. I had just used the checboxes until recently, but expanded my form to include ...
- 195
2
votes
1
answer
582
views
Display many checkboxes
The context
I am currently working on a project in ASP.NET MVC5.2 with Twitter Bootstrap.
The user will be experienced in IT as it concerns an internal tool.
The user is able to set different kinds ...
- 123
0
votes
2
answers
88
views
What to display in area where event-driven content should appear later
I asked a question here looking for design ideas for an alternative to the nested drop-down menus scheme I had come up with. User mikryz helpfully provided an alternative idea with this mockup:
I'm ...
- 45
0
votes
1
answer
77
views
How to determine if something is 1 row vs 3 rows in bootstrap? [closed]
In the following layout, how do I determine if each element should be in their own row and column or if all of them should be in 1 row and 1 column together, but separated by line breaks? Is there ...
- 103
3
votes
2
answers
3k
views
What is this Google Apps popout menu called?
What is this menu called in UX/UI parlance?
I want to implement this type of menu in my UI (ASP.NET MVC 5). My default styling is done with Bootstrap 3+.
- 133
2
votes
2
answers
124
views
What is the best use of icons in the header? (icons replacing free text)
What is the best use of icons in the header? In my application I am using a number of icons for simple features such as "find friends". "ask a question" etc. This is mainly because I need to keep the ...
- 1,278
2
votes
2
answers
3k
views
Bootstrap Glyphicons in Email
I am trying to prepare a custom email template.
I have a table and I am currently using an image to show as the "X" as below:
Since my first question was off topic, it put the question in my head as ...
- 33
0
votes
6
answers
447
views
How many mockups do you typically do for a responsive bootstrap design?
I am scoping a responsive project and thinking it will need views spanning from mobile to desktop. I am just wanting to confirm if it is necessary/helpful to do mockups for all 4 sizes (Extra small ...
- 51
1
vote
1
answer
162
views
Do Users assume that company logos link to the "home" page? [duplicate]
I have limited space on the top navigation of my bootstrap website and among other links, I have both the company logo and home (index) link,
Both logo and index scroll to the top of the page.
I want ...
- 113
1
vote
3
answers
501
views
A User-Friendly Table - What Solution?
Today, this is my table and if I select one of the row, it shows a select icon.
I want to make it more user-friend that you can see the whole row to be selected. Gmail has that functionality.
In my ...
- 123
2
votes
3
answers
2k
views
How do you choose between using a Jumbotron or Carousel?
I'm developing my first ever responsive website. This website will be a one-page website for one of my software products. I'm having a hard time trying to decide whether to use a jumbotron or a ...
0
votes
2
answers
431
views
On Hover Styling for dropdown in top header
In my application, I've a selection drop-down in the main top-header menu. Now, I'm a little confused on how I should have on hover for that element. These are the two options:
Option 1: No ...
- 185
3
votes
3
answers
19k
views
Back button look bootstrap which one to use?
I have a multi page web app where the user first selects some information and uploads a file to import, then the file will be sent to the back end for processing. After that the results will be ...
- 555
3
votes
5
answers
2k
views
Best way to display a long form with many dynamic questions
So I need to make a form with about 10 different inputs in it. Normally, I would put this on a single page and have the user scroll down. This seems like the easiest way to do it most of the time. But ...
- 131
25
votes
3
answers
49k
views
Comparison between Bootstrap and Material Design frameworks [closed]
The Bootstrap/Foundation family of design frameworks has been the main driving force behind a lot of responsive front-end web development projects. The Google Materials Design concept has also been ...
- 25.3k