Fix position of marker on scale in PDF

gloggi · Jul 29, 2024 · eb0d3e7 · eb0d3e7
1 parent 08f6818
commit eb0d3e7
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/resources/js/components/print/evaluationGrid/EvaluationGridCheckbox.jsx b/resources/js/components/print/evaluationGrid/EvaluationGridCheckbox.jsx
@@ -4,7 +4,7 @@ import styles from './styles.js';
 
 function EvaluationGridCheckbox({circular, checked}) {
     return <View style={{ ...styles.evaluationGridRowCheckbox, ...(circular ? { borderRadius: '4mm' } : { borderRadius: '3pt'}) }}>
-        { checked ? <View style={{ width: '8pt', height: '8mm', textAlign: 'center', position: 'absolute', top: '-0.5pt', left: '4pt' }}><Text>❌</Text></View> : <View /> }
+        { checked ? <View style={{ width: '8pt', height: '8mm', textAlign: 'center', position: 'absolute', top: '-0.5pt', left: '1pt' }}><Text>❌</Text></View> : <View /> }
     </View>
 }
 

diff --git a/resources/js/components/print/evaluationGrid/EvaluationGridRowControl.jsx b/resources/js/components/print/evaluationGrid/EvaluationGridRowControl.jsx
@@ -11,7 +11,13 @@ function EvaluationGridRowControl({rowTemplate, row, t}) {
                 <View style={styles.evaluationGridRowScaleTicks}>
                     {[...Array(9)].map((e, i) => <View key={i} style={styles.evaluationGridRowScaleTick} />)}
                 </View>
-                { row && (row.value !== null) ? <View style={{ width: '8pt', height: '8mm', textAlign: 'center', position: 'absolute', top: '-2mm', left: (parseInt(row.value) + 1) + '0%' }}><Text>❌</Text></View> : <View /> }
+                { row && (row.value === null) ? <View /> :
+                    <View style={{ position: 'absolute', margin: '0 7pt 0 6pt', left: '-5pt', right: '5pt', top: '-6pt', height: '7mm' }}>
+                        <View style={{ position: 'absolute', left: (Math.round(parseInt(row.value) * 1000 / 9) / 10) + '%', width: '11pt', height: '100%', textAlign: 'center' }}>
+                            <Text>❌</Text>
+                        </View>
+                    </View>
+                }
             </View>
             <View style={styles.evaluationGridRowScaleLabels}>
                 {['--', '-', '+', '++'].map((e, i) => <Text key={i} style={styles.evaluationGridRowScaleLabel}>{e}</Text>)}

diff --git a/resources/js/components/print/evaluationGrid/styles.js b/resources/js/components/print/evaluationGrid/styles.js
@@ -66,7 +66,7 @@ const styles = {
   },
   evaluationGridRowScaleAxisSquish: {
     width: '100%',
-    padding: '0 2mm',
+    padding: '0 6pt',
     display: 'flex',
     flexDirection: 'column',
   },