Du möchtest helfen ?
gewusst wie !
Es handelt sich beim THWiki (u.a. zu erreichen unter http://www.thwiki.org) um keine offizielle Seite der Bundesanstalt Technisches Hilfswerk. Das THWiki wird ausschließlich von privaten Personen betrieben und erhält auch keine Unterstützung durch die BA THW.

Vorlage:Card: Unterschied zwischen den Versionen

Aus THWiki
Zur Navigation springen Zur Suche springen
(Die Seite wurde neu angelegt: „__NOEDITSECTION__ __NOTOC__<div style="clear: both;"></div> <div style="position: relative;display: flex;flex-direction: column;min-width: 0;word-wrap: break-…“)
 
(Beschreibung hinzugefügt)
 
(8 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
__NOEDITSECTION__ __NOTOC__<div style="clear: both;"></div>  
__NOEDITSECTION__ __NOTOC__
<div style="position: relative;display: flex;flex-direction: column;min-width: 0;word-wrap: break-word;background-color: #fff;background-clip: border-box;border: 1px solid rgba(0,0,0,.125);border-radius: .25rem; width: {{{width|100%}}};">
<div style="clear: both;"></div>  
<span class="plainlinks" <!-- EDIT LINK PARAMETERS
<div style="position: relative;display: flex;flex-direction: column;min-width: 0;word-wrap: break-word;background-color: {{{bgc|#fff}}};background-clip: border-box;border: 1px solid rgba(0,0,0,.125);border-radius: .25rem; width: {{{width|100%}}};">
        -->style="float:right;<!--
              -->margin-bottom:.1em;<!--
              -->font-size: 80%;<!--
              -->padding-right: 0.5em;"><!--
        --><span style="color:{{{titleforeground|#000000}}}">[{{fullurl:{{{editpage|{{FULLPAGENAME}}}}}|action=edit}} {{int:editsection}}]</span>&nbsp;<!--
  --></span >
   <div style="flex: 1 1 auto;min-height: 1px;padding: 1.25rem;">
   <div style="flex: 1 1 auto;min-height: 1px;padding: 1.25rem;">
    <!--{{#ifexpr: showedit |<p style="float:right;font-size: 80%;color:{{{titleforeground|#000000}}}">[{{fullurl:{{{editpage|{{FULLPAGENAME}}}}}|action=edit}} {{int:editsection}}]</p>|}}-->
     <h5 style="margin-bottom: .75rem;margin-top: 0;font-size: 1.25rem;font-weight: 500;line-height: 1.2;"><span style="color:{{{titleforeground|#000000}}}">{{{title}}}</span></h5>
     <h5 style="margin-bottom: .75rem;margin-top: 0;font-size: 1.25rem;font-weight: 500;line-height: 1.2;"><span style="color:{{{titleforeground|#000000}}}">{{{title}}}</span></h5>
     <h6 style="color: #6c757d;margin-bottom: .5rem;margin-top: -.375rem;font-size: 1rem;font-weight: 500;line-height: 1.2;">{{{subtitle}}}</h6>
     <h6 style="color: #6c757d;margin-bottom: .5rem;margin-top: -.375rem;font-size: 1rem;font-weight: 500;line-height: 1.2;">{{{subtitle|}}}</h6>
     <p style="margin-top: 0;margin-bottom: 1rem;">{{{1|{{{text|{{{content}}}}}}}}}</p>
     <p style="margin-top: 0;margin-bottom: 1rem;">{{{1|{{{text|{{{content}}}}}}}}}</p>
      
      
   </div>
   </div>
</div>
</div>
<noinclude>
<templatedata>
{
"params": {
"bgc": {
"label": "Hintergrundfarbe",
"type": "string",
"autovalue": "#fff",
"description": "Hintergrundfarbe der Card",
"example": "{{Vorlage:Card/primary}},{{Vorlage:Card/secondary}},{{Vorlage:Card/success}},{{Vorlage:Card/danger}},{{Vorlage:Card/warning}}"
},
"width": {
"label": "Breite",
"description": "Die abs. Breite kann festgesetzt werden",
"example": "200px",
"type": "string",
"autovalue": "100%"
},
"titleforeground": {
"label": "Farbe der Überschrift",
"type": "string",
"autovalue": "#000"
},
"editpage": {
"label": "Edit page",
"autovalue": "{{FULLPAGENAME}}"
},
"title": {
"label": "Überschrift",
"type": "string",
"required": true
},
"subtitle": {
"label": "Unterüberschrift"
},
"content": {
"label": "Inhalt der Card",
"type": "string",
"required": true
},
"showedit": {
"label": "Bearbeitungslink anzeigen",
"type": "boolean",
"autovalue": "false",
"required": true
}
},
"paramOrder": [
"title",
"subtitle",
"content",
"bgc",
"width",
"titleforeground",
"editpage",
"showedit"
],
"description": "A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options. If you’re familiar with Bootstrap 3, cards replace our old panels, wells, and thumbnails. Similar functionality to those components is available as modifier classes for cards.\nDie Vorlage enthält den Card-Titel, den Card-Subtitel und den Card-Body. Der Card-Subtitel ist hierbei optional.\nFür die farbige Gestaltung können folgende Vorlagen oder einfach die Farbe als HEX - wie von CSS gewohnt- verwendet werden"
}
</templatedata>
==== Hintergrundfarben ====
{| class="wikitable"
|-
! Farbe !! Vorlage
|-
| <span style="background-color:{{Vorlage:Card/primary}};">primary</span> || <code><nowiki>{{Vorlage:Card/primary}}</nowiki></code>
|-
| <span style="background-color:{{Vorlage:Card/secondary}};">secondary</span> || <code><nowiki>{{Vorlage:Card/secondary}}</nowiki></code>
|-
| <span style="background-color:{{Vorlage:Card/danger}};">danger</span> || <code><nowiki>{{Vorlage:Card/danger}}</nowiki></code>
|-
| <span style="background-color:{{Vorlage:Card/success}};">success</span> || <code><nowiki>{{Vorlage:Card/success}}</nowiki></code>
|-
| <span style="background-color:{{Vorlage:Card/warning}};">warning</span> || <code><nowiki>{{Vorlage:Card/warning}}</nowiki></code>
|}
[[Kategorie:Vorlage]]
</noinclude>

Aktuelle Version vom 22. Januar 2021, 11:32 Uhr

{{{title}}}

{{{content}}}

A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options. If you’re familiar with Bootstrap 3, cards replace our old panels, wells, and thumbnails. Similar functionality to those components is available as modifier classes for cards. Die Vorlage enthält den Card-Titel, den Card-Subtitel und den Card-Body. Der Card-Subtitel ist hierbei optional. Für die farbige Gestaltung können folgende Vorlagen oder einfach die Farbe als HEX - wie von CSS gewohnt- verwendet werden

Vorlagenparameter

ParameterBeschreibungTypStatus
Überschrifttitle

keine Beschreibung

Zeichenfolgeerforderlich
Unterüberschriftsubtitle

keine Beschreibung

Unbekanntoptional
Inhalt der Cardcontent

keine Beschreibung

Zeichenfolgeerforderlich
Hintergrundfarbebgc

Hintergrundfarbe der Card

Beispiel
{{Vorlage:Card/primary}},{{Vorlage:Card/secondary}},{{Vorlage:Card/success}},{{Vorlage:Card/danger}},{{Vorlage:Card/warning}}
Autowert
#fff
Zeichenfolgeoptional
Breitewidth

Die abs. Breite kann festgesetzt werden

Beispiel
200px
Autowert
100%
Zeichenfolgeoptional
Farbe der Überschrifttitleforeground

keine Beschreibung

Autowert
#000
Zeichenfolgeoptional
Edit pageeditpage

keine Beschreibung

Autowert
{{FULLPAGENAME}}
Unbekanntoptional
Bearbeitungslink anzeigenshowedit

keine Beschreibung

Autowert
false
Boolescherforderlich

Hintergrundfarben

Farbe Vorlage
primary {{Vorlage:Card/primary}}
secondary {{Vorlage:Card/secondary}}
danger {{Vorlage:Card/danger}}
success {{Vorlage:Card/success}}
warning {{Vorlage:Card/warning}}
Abgerufen von „https://thwiki.org/index.php?title=Vorlage:Card&oldid=26209“