Cheatsheet

Popovers for map items



Content inside popover
Anfragen
Exklusiv 123
Gesamt 240
Geteilt 117
Fläche & Kosten
Ø Fläche 4630 m²
Ø Nettokaltmiete 6,84€/m²

Video Ratios

Responsive 16x9, 4x3, 1x1

Ajax Loader

Scroll Timeline
scroll, click and focus
some alt text...

2023

Heavy Investments, Big Innovations

Everything new: We invest very heavily in our development, production and testing technology.
some alt text...

2002

The Power of Partnership

The company Weidmüller from Detmold acquires 51 percent of the shares.
some alt text...

2001

Bigger and Better

We are acquiring a shell building in the Eisleben industrial area and expanding it with state-of-the-art infrastructure for administration, development and electronics production.
some alt text...

2000

Outgrowing Limits, Seeking New Horizons

The expansion lasts almost three years, then nothing works here either: The rooms are too small again, further investments and thus also an expansion of the company at this location is no longer possible. Something new is needed.
Scroll Timeline
scroll, click and focus
some alt text...

2023

Heavy Investments, Big Innovations

Everything new: We invest very heavily in our development, production and testing technology.
some alt text...

2002

The Power of Partnership

The company Weidmüller from Detmold acquires 51 percent of the shares.
some alt text...

2001

Bigger and Better

We are acquiring a shell building in the Eisleben industrial area and expanding it with state-of-the-art infrastructure for administration, development and electronics production.
some alt text...

2000

Outgrowing Limits, Seeking New Horizons

The expansion lasts almost three years, then nothing works here either: The rooms are too small again, further investments and thus also an expansion of the company at this location is no longer possible. Something new is needed.
Scroll Timeline ohne Bilder
scroll, click and focus

2023

Heavy Investments, Big Innovations

Everything new: We invest very heavily in our development, production and testing technology.

2002

The Power of Partnership

The company Weidmüller from Detmold acquires 51 percent of the shares.

2001

Bigger and Better

We are acquiring a shell building in the Eisleben industrial area and expanding it with state-of-the-art infrastructure for administration, development and electronics production.

2000

Outgrowing Limits, Seeking New Horizons

The expansion lasts almost three years, then nothing works here either: The rooms are too small again, further investments and thus also an expansion of the company at this location is no longer possible. Something new is needed.

Icons

Die fs-Klasse definiert die Schriftgröße. Ist keine fs--Klasse gesetzt, übernimmt das Element automatisch die Schriftgröße des umgebenden Textkontexts.

Icons ohne fs- Klasse
Heatmap
Admin
Gewerbegebiete
Pfeil
Alt. Pfeil
E-Mail
Telefon

Logisplorer

Suchen, um wertvolle Einblicke in Deutschlands Industriegebiete zu gewinnen!

Suchen, um wertvolle Einblicke in Deutschlands Industriegebiete zu gewinnen!

Suchen, um wertvolle Einblicke in Deutschlands Industriegebiete zu gewinnen!

Logistic Adviser Germany

Suchen, um wertvolle Einblicke in Deutschlands Industriegebiete zu gewinnen!

Akkordeon immer offen

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Akkordeon schließt automatisch

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Typography

Display 1

Display 2

Display 3

Display 4

Display 5

Display 6

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size. This is a responsive paragraph. It changes size based on screen size.

A well-known quote, contained in a blockquote element.

Someone famous in Source Title

Forms

Overview

We'll never share your email with anyone else.
Radios buttons

Disabled forms

Disabled radios buttons

Sizing

Input group

@
@example.com
https://example.com/users/
$ .00
With textarea

Floating labels

Validation

Looks good!
Looks good!
@
Please choose a username.
Please provide a valid city.
Please select a valid state.
Please provide a valid zip.
You must agree before submitting.

Components

Accordion

This is the first item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.

This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.

This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.

Theme Alerts

Alerts

Badge

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Primary Secondary Success Danger Warning Info Light Dark


Icon Buttons

Theme Button group



Buttons

Button group

Card

Placeholder Image cap
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
Featured
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

  • An item
  • A second item
  • A third item
Placeholder Image
Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

Collapse Custom

Autobahn
A7 1,9 km
A23 3,8 km
A255 13,3 km
A24 13,3 km
A252 13,9 km
A253 16,4 km
A1 16,7 km
A23 3,8 km
A25 17,6 km
A261 21,2 km
Bundesstraße
B4 1,8 km
B431 3,5 km
B5 4,0 km
internationaler Flughafen
Hamburg 10,2
Bremen 114,7 km
Hannover 140,6 km
Regionalflughafen
Lübeck 66,6 km
Cuxhafen 109,0 km
Parchim-Schwerin 137,3 km
Verkehrslandeplatz
Uetersen/Heist 22,9 km
Hartenholm 43,0 km
Hungriger Wolf 57,4 km
Neumünster 58,3 km
Rotenburg (Wümme) 75,6 km
Schienengüterverkehr
15,3 km
Lübeck 67,7 km
Lübeck 69,1 km
Schienenpersonenverkehr
Eidelstedt 0,5 km
Stellingen 1,2 km
Elbgaustraße 1,9 km
Eidelstedt Zentrum 2,5 km
Hagenbecks Tierpark 2,8 km
Hafen
Hamburg 10,7 km
Geesthacht 38,6 km
Glückstadt 46,4 km
Itzehoe 48,3 km
Stade-Bützfleth 50,2 km
Haltestellen
Hamburg Schnackenburgallee 0,2 km
Hamburg-Eidelstedt 0,5 km
Hamburg Hellgrundweg (Arenen) 0,5 km
Hamburg Lederstraße 0,7 km
Hamburg Langbargheide (Süd) 1,0 km
Kombinierter Verkehr
Hansaport Terminal (FHH, trimodal) 10,8 km
Süd-West Terminal (FHH, trimodal) 11,5 km
Containerterminal Burchardkai (FHH, trimodal) 12,0 km

Energy Scale

0
0 25 50 75 100 125 150 175 200 225 250

Popovers

Progress

0%
25%
50%
75%
100%

Scrollspy

First heading

This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.

Second heading

This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.

Third heading

This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.

Fourth heading

This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.

Fifth heading

This is some placeholder content for the scrollspy page. Note that as you scroll down the page, the appropriate navigation link is highlighted. It's repeated throughout the component example. We keep adding some more example copy here to emphasize the scrolling and highlighting.

Spinners

Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...

Toasts

Tooltips