Fossil SCM

An alternate impl for centering pikchrs which does not rely on margin:auto.

stephan 2020-09-18 10:32 trunk
Commit 2963f440e8fb01e21af8c4a4d672dd54ddd7d6ee1aae042661d3a9683f64e7d1
Parent 052d37480927b60…
2 files changed +13 -2 +6 -2
~ src/default.css ~ src/pikchrshow.c
M src/default.css
+13 -2
--- src/default.css
+++ src/default.css
@@ -1386,9 +1386,20 @@
13861386
 noscript > .error {
13871387
 /* Part of the style_emit_noscript_for_js_page() interface. */
13881388
 padding: 1em;
13891389
 font-size: 150%;
13901390
 }
1391
-.pikchr-src { /* source code view for a pikchr (see fossil.pikchr.js) */
1392
- box-sizing: border-box/*reduces UI shift*/;
1391
+div.pikchr-wrapper {/*outer wrapper elem for a pikchr construct*/}
1392
+div.pikchr {/*wrapper for SVG.pikchr element*/}
1393
+svg.pikchr {/*pikchr SVG*/}
1394
+pre.pikchr-src {/*source code view for a pikchr (see fossil.pikchr.js)*/
1395
+ box-sizing: border-box;
13931396
 overflow: auto;
1397
+ text-align: left;
1398
+}
1399
+div.pikchr-wrapper.center {
1400
+ text-align: center;
1401
+}
1402
+div.pikchr-wrapper.center > pre.pikchr-src,
1403
+div.pikchr-wrapper.center > div.pikchr-svg{
1404
+ display:inline-block;
13941405
 }
13951406
--- src/default.css
+++ src/default.css
@@ -1386,9 +1386,20 @@
1386 noscript > .error {
1387 /* Part of the style_emit_noscript_for_js_page() interface. */
1388 padding: 1em;
1389 font-size: 150%;
1390 }
1391 .pikchr-src { /* source code view for a pikchr (see fossil.pikchr.js) */
1392 box-sizing: border-box/*reduces UI shift*/;
 
 
 
1393 overflow: auto;
 
 
 
 
 
 
 
 
1394 }
1395
--- src/default.css
+++ src/default.css
@@ -1386,9 +1386,20 @@
1386 noscript > .error {
1387 /* Part of the style_emit_noscript_for_js_page() interface. */
1388 padding: 1em;
1389 font-size: 150%;
1390 }
1391 div.pikchr-wrapper {/*outer wrapper elem for a pikchr construct*/}
1392 div.pikchr {/*wrapper for SVG.pikchr element*/}
1393 svg.pikchr {/*pikchr SVG*/}
1394 pre.pikchr-src {/*source code view for a pikchr (see fossil.pikchr.js)*/
1395 box-sizing: border-box;
1396 overflow: auto;
1397 text-align: left;
1398 }
1399 div.pikchr-wrapper.center {
1400 text-align: center;
1401 }
1402 div.pikchr-wrapper.center > pre.pikchr-src,
1403 div.pikchr-wrapper.center > div.pikchr-svg{
1404 display:inline-block;
1405 }
1406
M src/pikchrshow.c
+6 -2
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -155,20 +155,22 @@
155155
156156
 zOut = pikchr(zContent, "pikchr", 0, &w, &h);
157157
 if( w>0 && h>0 ){
158158
 const char * zClassToggle = "";
159159
 const char * zClassSource = "";
160
+ const char * zWrapperClass = "";
160161
 const char *zNonce = (PIKCHR_PROCESS_NONCE & pikFlags)
161162
 ? safe_html_nonce(1) : 0;
162163
 if(zNonce){
163164
 blob_appendf(pOut, "%s\n", zNonce);
164165
 }
165166
 if(PIKCHR_PROCESS_DIV & pikFlags){
166167
 Blob css = empty_blob;
167168
 blob_appendf(&css, "max-width:%dpx;", w);
168169
 if(PIKCHR_PROCESS_DIV_CENTER & pikFlags){
169
- blob_append(&css, "display:block;margin-auto;", -1);
170
+ /*blob_append(&css, "display:block;margin:auto;", -1);*/
171
+ zWrapperClass = " center";
170172
 }else if(PIKCHR_PROCESS_DIV_INDENT & pikFlags){
171173
 blob_append(&css, "margin-left:4em", -1);
172174
 }else if(PIKCHR_PROCESS_DIV_FLOAT_LEFT & pikFlags){
173175
 blob_append(&css, "float:left;padding=4em;", -1);
174176
 }else if(PIKCHR_PROCESS_DIV_FLOAT_RIGHT & pikFlags){
@@ -178,12 +180,14 @@
178180
 zClassToggle = " toggle";
179181
 }
180182
 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
181183
 zClassSource = " source";
182184
 }
183
- blob_appendf(pOut,"<div><div class=\"pikchr-svg%s%s\" "
185
+ blob_appendf(pOut,"<div class='pikchr-wrapper%s'>"
186
+ "<div class=\"pikchr-svg%s%s\" "
184187
 "style=\"%b\">\n",
188
+ zWrapperClass/*safe-for-%s*/,
185189
 zClassToggle/*safe-for-%s*/,
186190
 zClassSource/*safe-for-%s*/, &css);
187191
 blob_reset(&css);
188192
 }
189193
 blob_append(pOut, zOut, -1);
190194
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -155,20 +155,22 @@
155
156 zOut = pikchr(zContent, "pikchr", 0, &w, &h);
157 if( w>0 && h>0 ){
158 const char * zClassToggle = "";
159 const char * zClassSource = "";
 
160 const char *zNonce = (PIKCHR_PROCESS_NONCE & pikFlags)
161 ? safe_html_nonce(1) : 0;
162 if(zNonce){
163 blob_appendf(pOut, "%s\n", zNonce);
164 }
165 if(PIKCHR_PROCESS_DIV & pikFlags){
166 Blob css = empty_blob;
167 blob_appendf(&css, "max-width:%dpx;", w);
168 if(PIKCHR_PROCESS_DIV_CENTER & pikFlags){
169 blob_append(&css, "display:block;margin-auto;", -1);
 
170 }else if(PIKCHR_PROCESS_DIV_INDENT & pikFlags){
171 blob_append(&css, "margin-left:4em", -1);
172 }else if(PIKCHR_PROCESS_DIV_FLOAT_LEFT & pikFlags){
173 blob_append(&css, "float:left;padding=4em;", -1);
174 }else if(PIKCHR_PROCESS_DIV_FLOAT_RIGHT & pikFlags){
@@ -178,12 +180,14 @@
178 zClassToggle = " toggle";
179 }
180 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
181 zClassSource = " source";
182 }
183 blob_appendf(pOut,"<div><div class=\"pikchr-svg%s%s\" "
 
184 "style=\"%b\">\n",
 
185 zClassToggle/*safe-for-%s*/,
186 zClassSource/*safe-for-%s*/, &css);
187 blob_reset(&css);
188 }
189 blob_append(pOut, zOut, -1);
190
--- src/pikchrshow.c
+++ src/pikchrshow.c
@@ -155,20 +155,22 @@
155
156 zOut = pikchr(zContent, "pikchr", 0, &w, &h);
157 if( w>0 && h>0 ){
158 const char * zClassToggle = "";
159 const char * zClassSource = "";
160 const char * zWrapperClass = "";
161 const char *zNonce = (PIKCHR_PROCESS_NONCE & pikFlags)
162 ? safe_html_nonce(1) : 0;
163 if(zNonce){
164 blob_appendf(pOut, "%s\n", zNonce);
165 }
166 if(PIKCHR_PROCESS_DIV & pikFlags){
167 Blob css = empty_blob;
168 blob_appendf(&css, "max-width:%dpx;", w);
169 if(PIKCHR_PROCESS_DIV_CENTER & pikFlags){
170 /*blob_append(&css, "display:block;margin:auto;", -1);*/
171 zWrapperClass = " center";
172 }else if(PIKCHR_PROCESS_DIV_INDENT & pikFlags){
173 blob_append(&css, "margin-left:4em", -1);
174 }else if(PIKCHR_PROCESS_DIV_FLOAT_LEFT & pikFlags){
175 blob_append(&css, "float:left;padding=4em;", -1);
176 }else if(PIKCHR_PROCESS_DIV_FLOAT_RIGHT & pikFlags){
@@ -178,12 +180,14 @@
180 zClassToggle = " toggle";
181 }
182 if(PIKCHR_PROCESS_DIV_SOURCE & pikFlags){
183 zClassSource = " source";
184 }
185 blob_appendf(pOut,"<div class='pikchr-wrapper%s'>"
186 "<div class=\"pikchr-svg%s%s\" "
187 "style=\"%b\">\n",
188 zWrapperClass/*safe-for-%s*/,
189 zClassToggle/*safe-for-%s*/,
190 zClassSource/*safe-for-%s*/, &css);
191 blob_reset(&css);
192 }
193 blob_append(pOut, zOut, -1);
194

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button