Question

I have a controller, which will allow for the configuration of multiple items to go into a sidebar. The sidebar CSS looks like this:

.sidebar {
  position: fixed;
  bottom: 0;
  right: 0;
  height: 100%;
  z-index: $bigZIndex;
}

Because there is a config to make each individual sidebar component, there is an arbitrary order and number of them. Regardless, I would want them to be placed in the same manner each and every time. Eg, start at top: 25% and position everything below that in order with a small margin between each. For reference, a config would look something like this:

{
  id: thing1Id,
  controller: thing1Controller
}, {
  id: thing2Id,
  controller: thing2Controller
}

However, it could also look like this:

{
  id: thing2Id,
  controller: thing2Controller
}, {
  id: aRandomThing,
  controller: madnessController
}

Ideally, it should be generic enough to handle any of these situations. How would something like this be done?

No correct solution

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top