Vorlage:Ic: Unterschied zwischen den Versionen

Aktuelle Version vom 11. Dezember 2023, 10:21 Uhr

Syntax: {{ ic | Input-Cloud | Optionale Parameter }}

2. Parameter	Default	Darstellung
\| dr als 2. Parameter	w=161px dropdown	Input-Cloud
\| dr \| Anw=UMA als 2. Parameter	w=161px dropdown	Input-Cloud
\| c als 2. Parameter	w=161px counter	Input-Cloud
\| c als 2. Parameter Bei Aufruf von einer UTM-Seite aus	w=81px	Input-UTM
\| rechts	links	stellt ein Icon auf der Rechten Seite dar
\| tr als 2. Parameter Bei Aufruf von einer UTM-Seite aus	w=161px table-row	Input-Cloud
\| tr-odd als 2. Parameter Bei Aufruf von einer UTM-Seite aus	w=161px table-row	Input-Cloud
\| tr-even als 2. Parameter Bei Aufruf von einer UTM-Seite aus	w=161px table-row	Input-Cloud
\| tr-head als 2. Parameter Bei Aufruf von einer UTM-Seite aus	w=161px table-row	Input-Cloud
\| cb \| Anw=UMA als 2. oder 3. Parameter	zusätzlich als Inhalt: {{cb\|https}} clickbox	» ✕https
2. oder weitere Parameter	Default	Darstellung
\| Anw=	ohne	Formatiert die Anzeige, wie mit Aufruf von Anw-Seite aus
\| Anw=UTM		Eingabfeld UTM
\| Anw=UMA		Eingabfeld UMA
\| Anw=MS		Eingabfeld UMA
\| w=	w=170px width:	Input-Cloud
\| fw=	fw=normal font-weight	light, lighter, normal, bold, bolder
\| icon=	Optional {{ spc \| Eingabefeld \| c \| icon=clock \| fw=bold }}	Eingabefeld
\| icon= \| Anw=MS	Optional {{ spc \| Eingabefeld \| c \| icon=clock \| fw=bold }}	Eingabefeld
\| iconw=	20px	Breite des Iconfeldes
\| iconc=	grey-l	Farbe des Icons
\| icon-class=	Übergibt den Parameter als class=xyz an {{spc\|}} fas=solid (entspr. bold), far=regular, fal=light Um ein beliebiges fontawesome-Icon zu verwenden muss als Paramater zusätzlich icon=fa verwendet werden.
\| lh=	Optional line-height	lh=40px verändert die Zeilenhöhe außerhalb* der Box*
\| pd=	pd=3px	ändert die Höhe der Box: Input-Cloud pd=10px
\| c= Color	grey-l
\| bdc= Border-Color	rgba(0, 0, 0, 0.125)
\| bc= background-color	rgba(0, 0, 0, 0.01)

Diese Dokumentation befindet sich auf einer eingebundenen Unterseite [ Bearbeiten].
Syntax-Beispiel befindet sich auf der Syntaxseite [Bearbeiten].
Anwendungsbeispiele und Funktionalitätsprüfungen befinden sich auf der Testseite [Bearbeiten].
Liste der Unterseiten.

@@ Zeile 4: / Zeile 4: @@
 	| MS
 	| SPDyn
-	| #default=<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span class="MS ic-eingabe font-color__grau-l {{#ifeq:{{{2|}}}|cb|ic-eingabe--cb}}{{#ifeq:{{{3|}}}|cb|ic-eingabe--cb}} {{#ifeq:  {{{2|}}} | rechts |ic-eingabe--icon--rechts}} {{#if:{{{icon|}}}| ic-eingabe--icon}}" style="
+	| #default={{#if:{{{b|}}}|<span class="ic-beschriftung">{{{b}}}</span><br>}}<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
+		class="
+		MS ic-eingabe font-color__grau-l {{{class|}}}
+		{{#ifeq:{{{2|}}}|cb|ic-eingabe--cb}}
+		{{#ifeq:{{{3|}}}|cb|ic-eingabe--cb}}
+		{{#ifeq:{{{2|}}} | rechts |ic-eingabe--icon--rechts}}
+		{{#if:{{{icon|}}}| ic-eingabe--icon}}
+		"
+		{{#vardefine:style|
 		{{#if: {{{bc|}}}  | background-color: {{Farbe|{{{bc|rgba(0,0,0,0.01);}}} }} }}
 		{{#if: {{{bdc|}}} | border: 1px solid {{Farbe|{{{bdc|rgba(0,0,0,0.125);}}} }} }}
@@ Zeile 11: / Zeile 19: @@
 		{{#if: {{{fw|}}} | font-weight: {{{fw|}}}; }}
 		{{#if: {{{c |}}} | color: {{Farbe|{{{c|}}} }} }}
-		"
+		}}
-	| UMA=<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
+		{{#if: {{#var:style|}}| style="{{#var:style}} clear: both;"}}
+	| UMA={{#if:{{{b|}}}|<span class="ic-beschriftung {{{b-class|}}}">{{{b}}}</span><br>}}<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
 		class="
 		UMA ic-eingabe
@@ Zeile 26: / Zeile 35: @@
 		{{#if: {{{fw|}}} | font-weight: {{{fw|}}}; }}
 		{{#if: {{{c |}}} | color: {{Farbe|{{{c|}}} }} }}
+		}}
+		{{ifeq: {{#var:style|}}|| style="{{#var:style}} clear: both;"}}
+	| AWP={{#if:{{{b|}}}|<span class="AWP ic-beschriftung {{{b-class|}}}">{{{b}}}</span><br>}}<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
+		class="
+		AWP ic-eingabe
+		font-color__{{#if:||{{{c|grau-l}}} }}
+		{{#if: {{{bdc|}}} | border-color__{{{bdc|}}} }}
+		{{{2|}}}
+		{{{3|}}} {{{class|}}}
+		"
+		{{#vardefine:style|
+		{{#if: {{{bc|}}}  | background-color: {{Farbe|{{{bc|rgba(0,0,0,0.01);}}} }} }}
+		{{#if: {{{pd|}}}  | padding: {{{pd|}}}; }}
+		{{#if: {{{lh|}}} | line-height: {{{lh|}}}; }}
+		{{#if: {{{fw|}}} | font-weight: {{{fw|}}}; }}
 		}}
 		{{ifeq: {{#var:style|}}|| style="{{#var:style}} clear: both;"}}
@@ Zeile 47: / Zeile 71: @@
 	| MAC
 	| U
-	| UTM=<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
+	| UTM={{#if:{{{b|}}}|<span class="ic-beschriftung">{{{b}}}</span><br>}}<span {{#if: {{{va|}}} | style="vertical-align: {{{va|}}};"}}><span
 		class="
 		{{{ Anw | {{{v | {{Anw}} }}} }}} ic-eingabe
 		font-color__grau-l
-		bc__white
+		{{#ifeq: {{{2|}}} | dro		| |{{{bc|bc__white}}} }}
-		{{#ifeq:  {{{2|}}} | rechts |ic-eingabe--icon--rechts| {{{2|}}}}} {{#if:{{{iconx|}}}| ic-eingabe--icon}}
+		{{#ifeq: {{{2|}}} | rechts	|ic-eingabe--icon--rechts| {{{2|}}}}} {{#if:{{{iconx|}}}| ic-eingabe--icon}}
-		{{#ifeq: {{#sub:{{{2|}}} | 0 | 2 }}| tr | {{{2|}}} }}
+		{{#ifeq: {{#sub:{{{2|}}}	| 0 | 2 }}| tr | {{{2|}}} }}
+		{{#if: {{{icon|}}} | pdl0 }}
 		{{{3|}}} {{{class|}}}
 		"
-		style="
+		{{#vardefine:style|
 		{{#if: {{{bc |}}} | background-color:	{{Farbe|{{{bc|rgba(0,0,0,0.01);}}} }} }}
 		{{#if: {{{bdc|}}} | border:		1px solid {{Farbe|{{{bdc|rgba(0,0,0,0.125);}}} }} }}
@@ Zeile 63: / Zeile 88: @@
 		{{#if: {{{fw |}}} | font-weight:	{{{fw|}}}; }}
 		{{#if: {{{c  |}}} | color:		{{Farbe|{{{c|}}} }} }}
+		}}
+		{{ifeq: {{#var:style|}}|| style="{{#var:style}} clear: both;"}}
 	}}
-	>{{#if: {{{icon|}}} |{{#ifeq: {{{2|}}} | rechts | |<span
+	><span class="inner-block {{{class-inner-block|{{#ifeq:{{{2|}}}|ip-rechts|right}} }}}><span class=inner-block__left>{{#if: {{{icon|}}} |{{#ifeq: {{{2|}}} | rechts | |<span
-		class="icon"
+		class="icon {{{icon-span-class|}}}"
 		style="
-		{{#if: {{{iconw|}}}  | width: {{{iconw|}}}; display: inline-block;}}
+		{{#if: {{{iconw|}}}  	| width: {{{iconw|}}}; display: inline-block;}}
-		{{#if: {{{iconc|}}}  | color: {{Farbe| {{{iconc|}}} }} }}
+		{{#if: {{{iconc|}}} 	| color: {{Farbe| {{{iconc|}}} }} }}
-		{{#if: {{{iconbc|}}} | background-color: {{Farbe | {{{iconbc|}}} }} }}
+		{{#if: {{{iconbc|}}}	| background-color: {{Farbe | {{{iconbc|}}} }} }}
+		{{#if:{{{iconborder|}}} | border-right: {{{iconborder|}}} }}
 		"
-	>{{spc|{{{icon|}}}|o|-| class={{{icon-class|}}} }} </span>&nbsp; |}} }}<span class="pd5" style="
+	>{{spc|{{#ifeq:{{{2|}}}|ip-rechts|/---&emsp;}}{{{icon|}}}|o|-| class={{{icon-class|}}} }} </span>|}} }}<!--folgender span hatte mal class="pd5" --><span class=inner-block__right style="
 		{{#ifeq: {{{w|"x"}}} | "x"
 			|
@@ Zeile 77: / Zeile 105: @@
 			width: calc( {{{ w | {{isutm | 90px | 170px | {{{Anw|}}} }} }}} - {{#if: {{{2|}}} |calc( 1em + 3px )|0px}} );
 		}}"
-	>{{#ifeq:{{{1| }}}| |&emsp;&emsp;&emsp;|{{{1}}} }}</span>{{#switch: {{lc: {{{2|}}} }}
+	>{{#ifeq:{{{1| }}}| |&emsp;&emsp;&emsp;|{{{1}}} }}</span></span>{{#switch: {{lc: {{{2|}}} }}
+			| icon-r
 			| dr
 			| dropdown={{#switch: {{{Anw|{{Anw}}}}}
 				| SUB
 				| UMA=<span class="dr-icon"></span>
-				| #default=<i style="margin-left: 2px;" class="fas fa-caret-down right"></i> <!--
+				| #default=<i class="{{{icon-r|fas fa-caret-down}}} middle right ml-2"></i><!--
 				  	[[Datei:Pfeil_Dropdown.png|x5px|Link=]] --> }}
 			| dr-b=<span class="dr-b"><i style="margin-left: 2px;" class="fas fa-angle-down right"></i></span>
+			| dro=<i class="far fa-angle-down middle right ml-2 pd4"></i>
 			| c
 			| counter={{#switch: {{{ Anw | {{Anw}} }}}
@@ Zeile 113: / Zeile 143: @@
 				| U
 				| UTM=<span class="counter-icon">[[Datei:UTM_v11-8-2_Counter.png|15px|Link=]]</span>
+				| AWP=<span class="counter"><i class="fas fa-caret-down"></i><i class="fas fa-caret-up"></i></span>
 				| #default=<span style="position: absolute;"><sup>▴</sup></span><sub>▾</sub> <!--
 			 		[[Datei:Counter.png|10px|Link=]] alte Version -->
 				}}
+			| ip-rechts=<span style="
+				display:			inline-block;
+				width:				x;
+				text-align: 		center;
+				color:				{{ Farbe |  {{{iconc|grey-l}}} }}
+				border-left: 		{{{iconborder|1px solid  rgba(0, 0, 0, 0.125)}}};
+				background-color:	{{Farbe | hgrau }}
+				padding: 			1px;
+				float:				right;
+			">{{spc|{{{icon|/---&emsp;}}}|o|-|{{#if:{{{icon-class}}}|class={{{icon-class}}}}}| {{#if:{{{icon|}}}|w=30px}}}}</span>
 			| rechts=<span style="
-				display:inline-block;
+				display:			inline-block;
-				width: {{{iconw|20px}}};
+				width:				{{{iconw|30px}}};
-				text-align: center;
+				text-align: 		center;
-				color: {{ Farbe | {{{iconc|grey-l}}} }}
+				color:				{{ Farbe | {{{iconc|grey-l}}} }}
-				border-left: 1px solid  rgba(0, 0, 0, 0.125);
+				border-left: 		{{{iconborder|1px solid  rgba(0, 0, 0, 0.125)}}};
-				background-color: {{Farbe | {{{iconbc|white}}} }}
+				background-color:	{{Farbe | {{{iconbc|white;}}} }}
-				padding: 1px;
+				padding: 			1px;
+				float:				right;
 			">{{spc|{{{icon|}}}|o|-|{{#if:{{{icon-class}}}|class={{{icon-class}}}}}| {{#if:{{{icon|}}}|w=30px}}}}</span>
-		}}</span></span><noinclude>
+		}}</span></span></span><noinclude>
 {{Dokumentation}}
 </noinclude>