ProtoFluid

Description

ProtoFluid delivers an in-document responsive design testing app that manages flexible <iframe> viewports, pop-up windows and more.

Installation

  1. Add the /ProtoFluid folder and contents to your project.
  2. Import the ProtoFluidButton.js script.
  3. Add a <protofluid-button> element.

Like this one 👈

  1. Load up your project.
  2. Click the button to initialise ProtoFluid.

Usage

Add viewports and/or pop-up windows via the UI.

Manipulate them as you see fit.

For further details, visit the website documentation.

Theme color

ProtoFluid can be themed via a CSS custom property.

:root {
	--protofluid-theme-color: tomato;
}

If not present, the theme color will use the background-color of the <button> inside <protofluid-button>

License

ProtoFluid's license is based on the MIT license wrapped in the Commons Clause condition.

In addition, ethics and ‘AI’ clauses apply.