LATEST RELEASE:  FPP 7.5 - Download from here -



Welcome, Guest.
Please login or register.
Forgot your password?

+-Site Stats

Total Members: 16426
Latest: Amishman
New This Month: 20
New This Week: 1
New Today: 1
Total Posts: 132326
Total Topics: 16404
Most Online Today: 104
Most Online Ever: 7634
(January 21, 2020, 02:14:03 AM)
Users Online
Members: 4
Guests: 96
Total: 100

Why a custom/minimized bootstrap implementation in fpp?

Started by jcross, February 07, 2024, 10:17:26 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.


I started working on modernizing one of my plugins and actually building a UI for another one (remote donation box/push to hear music system) I've been playing with for the last few years and noticed several standard bootstrap classes are not working (like d-none).

I noticed that we aren't running a full bootstrap implementation and I'm just curious what the reasons are?

I was able to add in the specific classes with media breakpoints I need but it just doesn't feel right to have to do that.

Thanks :)



This one might require some input from some of the guys who worked on the UI redesign a few major FPP versions ago.  During the redesign, one of our requests was to keep things simpler, we didn't want to have to learn multiple frameworks or a single complex framework in order to be able to go in and make simple UI changes.  That could have been part of the reason behind using a slimmed down version.  If there are things that make sense to add and they don't balloon up the code base or effort involved to maintain the UI and they don't break anything, then I don't think we are opposed to adding any missing bits to get desired functionality.


yeah that makes sense.  I did play around a bit adding in the full bootstrap library to my dev instance but yeah it broke everything, which was expected.

It would be nice to add in the media breakpoint classes, but since I believe that is the core of boostrap it may not be possible.

Specifically for my purposes I added the following into the plugins main script file and it does what I'm needing it to.
<style scoped>
  @media screen and (min-width: 0px) {
    .d-none { display: none!important; }
    .d-inline { display: inline; }
    .d-block { display: block; }
    .d-table-cell { display: table-cell!important; }

  @media screen and (min-width: 992px) {
    .d-none { display: none!important; }
    .d-inline { display: inline; }
    .d-block { display: block; }
    .d-table-cell { display: table-cell!important; }
    .d-lg-none { display: none!important;}
    .d-lg-inline { display: inline; }
    .d-lg-block { display: block; }
    .d-lg-table-cell { display: table-cell!important; }

Support FPP

+- Recent Topics

F32v5 Release Date by mcarter
Today at 01:46:44 PM

Looking for a way to "fast forward" a video playlist by Jayl
April 18, 2024, 03:20:31 PM

MQTT with Home Assistant, model control only lights up some pixels. by CaptainMurdoch
April 16, 2024, 03:06:10 PM

P9-28 and P9-29 not work by windaube
April 15, 2024, 03:40:34 PM

Resetting or Removing FPP Password (with Windows) by greenreader9
April 14, 2024, 06:21:46 PM

Enclosure for Video Projectors by Scott
April 14, 2024, 12:00:50 PM

Born in the USA by Xmas!
April 13, 2024, 03:25:16 PM

1200w HP Power Supplies by MikeKrebs
April 12, 2024, 08:53:19 PM

Colorlight card not responding to FPP by CaptainMurdoch
April 12, 2024, 09:21:54 AM

FPP and WS2812b not work, but work with python script by CaptainMurdoch
April 11, 2024, 03:34:17 PM

Powered by EzPortal
Powered by SMFPacks Menu Editor Mod