Von Version 3.1
bearbeitet von sas
am 25.11.2021, 12:29
Änderungskommentar: Es gibt keinen Kommentar für diese Version
Auf Version 9.1
bearbeitet von sas
am 02.09.2022, 14:59
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

Seiteneigenschaften
Inhalt
... ... @@ -11,6 +11,7 @@
11 11  ** [[Verwenden einer Mandant- oder Formularressource>>path:#HVerwendeneinerMandant-oderFormularressource]]
12 12  ** [[Einfügen als Base64-String>>path:#HEinfFCgenalsBase64-String]]
13 13  * [[Anpassungen des Schriftbildes>>path:#HAnpassungendesSchriftbildes]]
14 +* [[Hinzufügen einer eigenen Schriftart>>path:#HHinzufFCgeneinereigenenSchriftart]]
14 14  * [[Anpassen des Favicons>>path:#HAnpassendesFavicons]]
15 15  * [[Anpassung Abstand Fieldset nach oben>>path:#HAnpassungAbstandFieldsetnachoben]]
16 16  * [[Anpassung Hintergrundfarbe Fieldset>>path:#HAnpassungHintergrundfarbeFieldset]]
... ... @@ -30,14 +30,14 @@
30 30  (((
31 31  (% class="code" %)
32 32  (((
33 -.(% style="font-weight: bold; color: #0000FF;" %)XHeader(%%) {
34 - (% style="font-weight: bold; color: #008000;" %)background-image(%%): (% style="color: #008000;" %)url(%%)((% style="color: #BA2121;" %)'https:~/~/beispiel.de/pfad/zum/bild/logo.png'(%%)); (% style="font-style: italic; color: #408080;" %)/* Auswählen des Bildes per URL */(%%)
35 - (% style="font-style: italic; color: #408080;" %)/* Positionierung des Bildes: */(%%)
36 - (% style="font-weight: bold; color: #008000;" %)background-size(%%): (% style="font-weight: bold; color: #008000;" %)auto(%%) (% style="color: #666666;" %)25(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Das Bild hat 25 Pixel Höhe und die Breite wird automatisch passend zum Seitenverhältnis des Bildes ermittelt */(%%)
37 - (% style="font-weight: bold; color: #008000;" %)height(%%): (% style="color: #666666;" %)60(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Die Höhe des Headers wird auf 60 Pixel festgelegt */(%%)
38 - (% style="font-weight: bold; color: #008000;" %)background-repeat(%%): (% style="font-weight: bold; color: #008000;" %)no-repeat(%%); (% style="font-style: italic; color: #408080;" %)/* Das Bild wird nur einmal angezeigt */(%%)
39 - background-position-x: (% style="color: #008000;" %)calc(%%)((% style="color: #666666;" %)100(% style="color: #B00040;" %)%(%%) (% style="color: #666666;" %)-(%%) (% style="color: #666666;" %)30(% style="color: #B00040;" %)px(%%)); (% style="font-style: italic; color: #408080;" %)/* Das Bild wird 30 Pixel vom rechten Rand positioniert */(%%)
40 - background-position-y: (% style="color: #666666;" %)20(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Das Bild wird 20 Pixel vom oberen Rand positioniert */(%%)
34 +.(% style="color:#0000ff; font-weight:bold" %)**XHeader**(%%) {
35 +(% style="color:#008000; font-weight:bold" %)**background-image**(%%): (% style="color:#008000" %)url(%%)((% style="color:#ba2121" %)'https:~/~/beispiel.de/pfad/zum/bild/logo.png'(%%)); (% style="color:#408080; font-style:italic" %)///* Auswählen des Bildes per URL *///(%%)
36 +(% style="color:#408080; font-style:italic" %)///* Positionierung des Bildes: *///(%%)
37 +(% style="color:#008000; font-weight:bold" %)**background-size**(%%): (% style="color:#008000; font-weight:bold" %)**auto**(%%) (% style="color:#666666" %)25(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Das Bild hat 25 Pixel Höhe und die Breite wird automatisch passend zum Seitenverhältnis des Bildes ermittelt *///(%%)
38 +(% style="color:#008000; font-weight:bold" %)**height**(%%): (% style="color:#666666" %)60(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Die Höhe des Headers wird auf 60 Pixel festgelegt *///(%%)
39 +(% style="color:#008000; font-weight:bold" %)**background-repeat**(%%): (% style="color:#008000; font-weight:bold" %)**no-repeat**(%%); (% style="color:#408080; font-style:italic" %)///* Das Bild wird nur einmal angezeigt *///(%%)
40 + background-position-x: (% style="color:#008000" %)calc(%%)((% style="color:#666666" %)100(% style="color:#b00040" %)%(%%) (% style="color:#666666" %)-(%%) (% style="color:#666666" %)30(% style="color:#b00040" %)px(%%)); (% style="color:#408080; font-style:italic" %)///* Das Bild wird 30 Pixel vom rechten Rand positioniert *///(%%)
41 + background-position-y: (% style="color:#666666" %)20(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Das Bild wird 20 Pixel vom oberen Rand positioniert *///(%%)
41 41  }
42 42  )))
43 43  )))
... ... @@ -50,10 +50,10 @@
50 50  (((
51 51  (% class="code" %)
52 52  (((
53 -.(% style="font-weight: bold; color: #0000FF;" %)XHeader(%%) {
54 - (% style="font-weight: bold; color: #008000;" %)background-image(%%): (% style="color: #008000;" %)url(%%)((% style="color: #BA2121;" %)'../includes/ressource?pid=1234&name=headerbild.png'(%%)); (% style="font-style: italic; color: #408080;" %)/* Auswählen des Bildes per relativer URL zur Formularressource */(%%)
55 - (% style="font-style: italic; color: #408080;" %)/* Positionierung des Bildes: */(%%)
56 - (% style="font-weight: bold; color: #008000;" %)background-size(%%): (% style="color: #666666;" %)100(% style="color: #B00040;" %)%(%%) (% style="color: #666666;" %)100(% style="color: #B00040;" %)%(%%); (% style="font-style: italic; color: #408080;" %)/* Bild über die gesamte Headergröße zeichnen */(%%)
54 +.(% style="color:#0000ff; font-weight:bold" %)**XHeader**(%%) {
55 +(% style="color:#008000; font-weight:bold" %)**background-image**(%%): (% style="color:#008000" %)url(%%)((% style="color:#ba2121" %)'../includes/ressource?pid=1234&name=headerbild.png'(%%)); (% style="color:#408080; font-style:italic" %)///* Auswählen des Bildes per relativer URL zur Formularressource *///(%%)
56 +(% style="color:#408080; font-style:italic" %)///* Positionierung des Bildes: *///(%%)
57 +(% style="color:#008000; font-weight:bold" %)**background-size**(%%): (% style="color:#666666" %)100(% style="color:#b00040" %)%(%%) (% style="color:#666666" %)100(% style="color:#b00040" %)%(%%); (% style="color:#408080; font-style:italic" %)///* Bild über die gesamte Headergröße zeichnen *///(%%)
57 57  }
58 58  )))
59 59  )))
... ... @@ -66,14 +66,14 @@
66 66  (((
67 67  (% class="code" %)
68 68  (((
69 -.(% style="font-weight: bold; color: #0000FF;" %)XHeader(%%) {
70 - (% style="font-weight: bold; color: #008000;" %)background-image(%%): (% style="color: #008000;" %)url(%%)((% style="color: #008000;" %)data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAIAAABv85FHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAAA5SURBVBhXdY1LFgAgCAK5/6UNQ6mFzkLj4wuxkxlQDT5MSrue5onbXjKimJTUIr8rurL9Z2u+G4g4ozy8RKSwCIwAAAAASUVORK5CYII=(%%)); (% style="font-style: italic; color: #408080;" %)/* Auswahl eines Bildes per Base64-String*/(%%)
71 - (% style="font-style: italic; color: #408080;" %)/* Positionierung des Bildes: */(%%)
72 - (% style="font-weight: bold; color: #008000;" %)background-repeat(%%): (% style="font-weight: bold; color: #008000;" %)no-repeat(%%); (% style="font-style: italic; color: #408080;" %)/* Das Bild wird nur einmal angezeigt */(%%)
73 - background-position-x: (% style="color: #666666;" %)10(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Positionierung in horizontaler Richtung */(%%)
74 - background-position-y: (% style="color: #666666;" %)10(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Positionierung in vertikaler Richtung */(%%)
75 - (% style="font-weight: bold; color: #008000;" %)background-size(%%): (% style="font-weight: bold; color: #008000;" %)auto(%%) (% style="color: #666666;" %)40(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Größe des Bildes: 40px hoch und so breit, wie es das Seitenverhältnis des Bildes vorgibt */(%%)
76 - (% style="font-weight: bold; color: #008000;" %)height(%%): (% style="color: #666666;" %)60(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Gesamthöhe des Formularheaders */(%%)
70 +.(% style="color:#0000ff; font-weight:bold" %)**XHeader**(%%) {
71 +(% style="color:#008000; font-weight:bold" %)**background-image**(%%): (% style="color:#008000" %)url(%%)((% style="color:#008000" %)data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAIAAABv85FHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAAA5SURBVBhXdY1LFgAgCAK5/6UNQ6mFzkLj4wuxkxlQDT5MSrue5onbXjKimJTUIr8rurL9Z2u+G4g4ozy8RKSwCIwAAAAASUVORK5CYII=(%%)); (% style="color:#408080; font-style:italic" %)///* Auswahl eines Bildes per Base64-String*///(%%)
72 +(% style="color:#408080; font-style:italic" %)///* Positionierung des Bildes: *///(%%)
73 +(% style="color:#008000; font-weight:bold" %)**background-repeat**(%%): (% style="color:#008000; font-weight:bold" %)**no-repeat**(%%); (% style="color:#408080; font-style:italic" %)///* Das Bild wird nur einmal angezeigt *///(%%)
74 + background-position-x: (% style="color:#666666" %)10(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Positionierung in horizontaler Richtung *///(%%)
75 + background-position-y: (% style="color:#666666" %)10(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Positionierung in vertikaler Richtung *///(%%)
76 +(% style="color:#008000; font-weight:bold" %)**background-size**(%%): (% style="color:#008000; font-weight:bold" %)**auto**(%%) (% style="color:#666666" %)40(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Größe des Bildes: 40px hoch und so breit, wie es das Seitenverhältnis des Bildes vorgibt *///(%%)
77 +(% style="color:#008000; font-weight:bold" %)**height**(%%): (% style="color:#666666" %)60(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Gesamthöhe des Formularheaders *///(%%)
77 77  }
78 78  )))
79 79  )))
... ... @@ -90,8 +90,8 @@
90 90  (((
91 91  (% class="code" %)
92 92  (((
93 -.(% style="font-weight: bold; color: #0000FF;" %)xm-form(%%).(% style="font-weight: bold; color: #0000FF;" %)modern(%%) (% style="color: #666666;" %)*,(%%) .(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)XPage(%%) (% style="color: #666666;" %)*(%%) { (% style="font-style: italic; color: #408080;" %)/* Selektiert das gesamte Formular und alle Formularseiten*/(%%)
94 - (% style="font-weight: bold; color: #008000;" %)font-family(%%): Verdana; (% style="font-style: italic; color: #408080;" %)/* Setzt die Default-Schriftart. */(%%)
94 +.(% style="color:#0000ff; font-weight:bold" %)**xm-form**(%%).(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) (% style="color:#666666" %)*,(%%) .(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XPage**(%%) (% style="color:#666666" %)*(%%) { (% style="color:#408080; font-style:italic" %)///* Selektiert das gesamte Formular und alle Formularseiten*///(%%)
95 +(% style="color:#008000; font-weight:bold" %)**font-family**(%%): Verdana; (% style="color:#408080; font-style:italic" %)///* Setzt die Default-Schriftart. *///(%%)
95 95  }
96 96  )))
97 97  )))
... ... @@ -102,16 +102,42 @@
102 102  (((
103 103  (% class="code" %)
104 104  (((
105 -.(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)xm-item-div(%%) (% style="font-weight: bold; color: #008000;" %)LABEL(%%) {
106 - (% style="font-weight: bold; color: #008000;" %)font-size(%%): (% style="color: #666666;" %)14(% style="color: #B00040;" %)px(%%); (% style="font-style: italic; color: #408080;" %)/* Setzt die Schriftgröße. */(%%)
107 - (% style="font-weight: bold; color: #008000;" %)color(%%): (% style="color: #666666;" %)#111(%%); (% style="font-style: italic; color: #408080;" %)/* Setzt die Schriftfarbe. */(%%)
106 +.(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**xm-item-div**(%%) (% style="color:#008000; font-weight:bold" %)**LABEL**(%%) {
107 +(% style="color:#008000; font-weight:bold" %)**font-size**(%%): (% style="color:#666666" %)14(% style="color:#b00040" %)px(%%); (% style="color:#408080; font-style:italic" %)///* Setzt die Schriftgröße. *///(%%)
108 +(% style="color:#008000; font-weight:bold" %)**color**(%%): (% style="color:#666666" %)#111(%%); (% style="color:#408080; font-style:italic" %)///* Setzt die Schriftfarbe. *///(%%)
108 108  }
109 109  )))
110 110  )))
111 111  
112 -== Anpassen des Favicons ==
113 +== Hinzufügen einer eigenen Schriftart ==
113 113  
115 +Um eine neue Schriftart hinzuzufügen, muss diese entweder im Formular unter //Mehr// > [[//Dateien// >>doc:Formcycle.UserInterface.MyForms.Files||target="_blank"]]im Format woff, woff2 und ttf hochgeladen werden. Wenn die Schriftart allgemein zum Einsatz kommt, dann sollte diese stattdessen unter //Dateien & Templates > //[[//Dateien// >>doc:Formcycle.UserInterface.FilesAndTemplates.Files||target="_blank"]]abgelegt werden. Dadurch werden die Schriftarten erstmal generell bereitgestellt.
114 114  
117 +Anschließend kann die Schriftart im CSS-Code eines Formulars eingebunden und verwendet werden. in dem folgenden Beispiel sind die Schriftarten im Formular hinterlegt, zu erkennen an dem Parameter //pid//. Sollten die Schriftarten unter Dateien & Templates abgelegt sein, beachten Sie hierbei dass der Parameter //mid// verwendet wird. Bitte beachten Sie, ddass die URL's zu den Schriftarten angepasst werden müssen. Die absolute URL finden Sie rechts im Eigenschaftsbereich.
118 +
119 +(% class="box" %)
120 +(((
121 +(% class="code" %)
122 +(((
123 +@(% style="color:#0000ff; font-weight:bold" %)**font-face**(%%) {
124 +(% style="color:#008000; font-weight:bold" %)**font-family**(%%): (% style="color:#666666" %)'myfont'(%%);
125 +(% style="color:#008000; font-weight:bold" %)**src**(%%): (% style="color:#666666" %)url('?pid=8104&name=Roboto-Regular.woff2') format('woff2'),(%%)
126 + (% style="color:#666666" %) url('?pid=8104&name=Roboto-Regular.woff') format('woff')(%%),
127 + (% style="color:#666666" %) url('?pid=8104&name=Roboto-Regular.ttf') format('ttf')(%%);
128 +(% style="color:#008000; font-weight:bold" %)**font-weight**(%%): (% style="color:#008000; font-weight:bold" %)**normal**(%%);
129 +(% style="color:#008000; font-weight:bold" %)**font-style**(%%): (% style="color:#008000; font-weight:bold" %)**normal**(%%);
130 +}
131 +
132 +.(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XHeader**(%%) * {
133 +(% style="color:#008000; font-weight:bold" %)**font-family**(%%): (% style="color:#666666" %)'myfont'(%%);
134 +}
135 +)))
136 +)))
137 +
138 +Es reicht nicht aus nur ein font-face zu definieren. Die neue Schriftart muss dann noch als font für den entsprechenden Abschnitt hinterlegt werden. In diesem Beispiel wird nun im Kopfbereich die neue Schriftart angewendet. Prüfen Sie dies ggf. noch über den Browser Inspector (F12).
139 +
140 +== Anpassen des Favicons ==
141 +
115 115  (% class="xm-figure xm-float-right xm-clear-h2" data-alt="Im im Metabereich kann der Link auf ein anderes Favicon definiert werden." %)
116 116  (((
117 117  (% class="xm-figure-inner" style="width:310px" %)
... ... @@ -131,7 +131,7 @@
131 131  (((
132 132  (% class="code" %)
133 133  (((
134 -<(% style="font-weight: bold; color: #008000;" %)link(%%) (% style="color: #7D9029;" %)rel(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"shortcut icon"(%%) (% style="color: #7D9029;" %)type(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"image/png"(%%) (% style="color: #7D9029;" %)href(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"https:~/~/beispiel.de/pfad/zum/bild/favicon.png"(%%) />
161 +<(% style="color:#008000; font-weight:bold" %)**link**(%%) (% style="color:#7d9029" %)rel(% style="color:#666666" %)=(% style="color:#ba2121" %)"shortcut icon"(%%) (% style="color:#7d9029" %)type(% style="color:#666666" %)=(% style="color:#ba2121" %)"image/png"(%%) (% style="color:#7d9029" %)href(% style="color:#666666" %)=(% style="color:#ba2121" %)"https:~/~/beispiel.de/pfad/zum/bild/favicon.png"(%%) />
135 135  )))
136 136  )))
137 137  
... ... @@ -141,7 +141,7 @@
141 141  (((
142 142  (% class="code" %)
143 143  (((
144 -<(% style="font-weight: bold; color: #008000;" %)link(%%) (% style="color: #7D9029;" %)rel(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"shortcut icon"(%%) (% style="color: #7D9029;" %)type(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"image/png"(%%) (% style="color: #7D9029;" %)href(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAIAAABv85FHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAAA5SURBVBhXdY1LFgAgCAK5/6UNQ6mFzkLj4wuxkxlQDT5MSrue5onbXjKimJTUIr8rurL9Z2u+G4g4ozy8RKSwCIwAAAAASUVORK5CYII="(%%) />
171 +<(% style="color:#008000; font-weight:bold" %)**link**(%%) (% style="color:#7d9029" %)rel(% style="color:#666666" %)=(% style="color:#ba2121" %)"shortcut icon"(%%) (% style="color:#7d9029" %)type(% style="color:#666666" %)=(% style="color:#ba2121" %)"image/png"(%%) (% style="color:#7d9029" %)href(% style="color:#666666" %)=(% style="color:#ba2121" %)"data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAIAAABv85FHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAAA5SURBVBhXdY1LFgAgCAK5/6UNQ6mFzkLj4wuxkxlQDT5MSrue5onbXjKimJTUIr8rurL9Z2u+G4g4ozy8RKSwCIwAAAAASUVORK5CYII="(%%) />
145 145  )))
146 146  )))
147 147  
... ... @@ -151,8 +151,8 @@
151 151  (((
152 152  (% class="code" %)
153 153  (((
154 -<(% style="font-weight: bold; color: #008000;" %)link(%%) (% style="color: #7D9029;" %)rel(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"shortcut icon"(%%) (% style="color: #7D9029;" %)type(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"image/png"(%%) (% style="color: #7D9029;" %)sizes(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"16x16"(%%) (% style="color: #7D9029;" %)href(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"../includes/ressource?pid=1234&name=favicon16.png"(%%) />
155 -<(% style="font-weight: bold; color: #008000;" %)link(%%) (% style="color: #7D9029;" %)rel(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"shortcut icon"(%%) (% style="color: #7D9029;" %)type(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"image/png"(%%) (% style="color: #7D9029;" %)sizes(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"32x32"(%%) (% style="color: #7D9029;" %)href(% style="color: #666666;" %)=(% style="color: #BA2121;" %)"../includes/ressource?pid=1234&name=favicon32.png"(%%) />
181 +<(% style="color:#008000; font-weight:bold" %)**link**(%%) (% style="color:#7d9029" %)rel(% style="color:#666666" %)=(% style="color:#ba2121" %)"shortcut icon"(%%) (% style="color:#7d9029" %)type(% style="color:#666666" %)=(% style="color:#ba2121" %)"image/png"(%%) (% style="color:#7d9029" %)sizes(% style="color:#666666" %)=(% style="color:#ba2121" %)"16x16"(%%) (% style="color:#7d9029" %)href(% style="color:#666666" %)=(% style="color:#ba2121" %)"../includes/ressource?pid=1234&name=favicon16.png"(%%) />
182 +<(% style="color:#008000; font-weight:bold" %)**link**(%%) (% style="color:#7d9029" %)rel(% style="color:#666666" %)=(% style="color:#ba2121" %)"shortcut icon"(%%) (% style="color:#7d9029" %)type(% style="color:#666666" %)=(% style="color:#ba2121" %)"image/png"(%%) (% style="color:#7d9029" %)sizes(% style="color:#666666" %)=(% style="color:#ba2121" %)"32x32"(%%) (% style="color:#7d9029" %)href(% style="color:#666666" %)=(% style="color:#ba2121" %)"../includes/ressource?pid=1234&name=favicon32.png"(%%) />
156 156  )))
157 157  )))
158 158  
... ... @@ -164,8 +164,8 @@
164 164  (((
165 165  (% class="code" %)
166 166  (((
167 -.(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)CXFieldSet(%%) .(% style="font-weight: bold; color: #0000FF;" %)XFieldSetWrapper(%%) {
168 - (% style="font-weight: bold; color: #008000;" %)margin-top(%%): (% style="color: #666666;" %)5(% style="color: #B00040;" %)px(%%);
194 +.(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**CXFieldSet**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XFieldSetWrapper**(%%) {
195 +(% style="color:#008000; font-weight:bold" %)**margin-top**(%%): (% style="color:#666666" %)5(% style="color:#b00040" %)px(%%);
169 169  }
170 170  )))
171 171  )))
... ... @@ -178,9 +178,9 @@
178 178  (((
179 179  (% class="code" %)
180 180  (((
181 -.(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)CXFieldSet(%%) .(% style="font-weight: bold; color: #0000FF;" %)XFieldSetWrapper(% style="color: #666666;" %),(%%) .(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)XFieldSet(%%) (% style="font-weight: bold; color: #008000;" %)legend(%%) {
182 - (% style="font-weight: bold; color: #008000;" %)background-color(%%): (% style="font-weight: bold; color: #008000;" %)lightsteelblue(%%);
183 - (% style="font-weight: bold; color: #008000;" %)width(%%): (% style="color: #666666;" %)100(% style="color: #B00040;" %)%(%%);
208 +.(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**CXFieldSet**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XFieldSetWrapper**(% style="color:#666666" %),(%%) .(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XFieldSet**(%%) (% style="color:#008000; font-weight:bold" %)**legend**(%%) {
209 +(% style="color:#008000; font-weight:bold" %)**background-color**(%%): (% style="color:#008000; font-weight:bold" %)**lightsteelblue**(%%);
210 +(% style="color:#008000; font-weight:bold" %)**width**(%%): (% style="color:#666666" %)100(% style="color:#b00040" %)%(%%);
184 184  }
185 185  )))
186 186  )))
... ... @@ -193,9 +193,11 @@
193 193  (((
194 194  (% class="code" %)
195 195  (((
196 -.(% style="font-weight: bold; color: #0000FF;" %)modern(%%) .(% style="font-weight: bold; color: #0000FF;" %)XPage(%%) {
197 - (% style="font-weight: bold; color: #008000;" %)padding(%%): (% style="color: #666666;" %)25(% style="color: #B00040;" %)px(%%) (% style="color: #666666;" %)25(% style="color: #B00040;" %)px(%%);
223 +.(% style="color:#0000ff; font-weight:bold" %)**modern**(%%) .(% style="color:#0000ff; font-weight:bold" %)**XPage**(%%) {
224 +(% style="color:#008000; font-weight:bold" %)**padding**(%%): (% style="color:#666666" %)25(% style="color:#b00040" %)px(%%) (% style="color:#666666" %)25(% style="color:#b00040" %)px(%%);
198 198  }
199 199  )))
200 200  )))
201 201  
229 +
230 +