fix: Tankstände im Logbuch einheitlich ausrichten und formatieren.
Kürzere Labels, gemeinsames Input-Styling ohne cell-input und CSS-Grid-Fix für Frischwasser- und Kraftstoff-Felder. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -1891,6 +1891,41 @@ body:has(.theme-cupertino) {
|
|||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr 1fr;
|
||||||
gap: 12px;
|
gap: 12px;
|
||||||
|
align-items: end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consumption-grid .input-group {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consumption-grid .input-group label {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
min-height: 2.75em;
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
line-height: 1.35;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consumption-grid .input-group .input-text {
|
||||||
|
flex-shrink: 0;
|
||||||
|
-moz-appearance: textfield;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consumption-grid .input-text::-webkit-outer-spin-button,
|
||||||
|
.consumption-grid .input-text::-webkit-inner-spin-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consumption-grid .consumption-value {
|
||||||
|
color: #4ade80;
|
||||||
|
font-weight: 700;
|
||||||
|
text-align: center;
|
||||||
|
pointer-events: none;
|
||||||
|
cursor: default;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
|
|||||||
@@ -764,7 +764,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
<div className="consumption-grid">
|
<div className="consumption-grid">
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.freshwater')} ({t('logs.morning')})</label>
|
<label>{t('logs.morning')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -775,7 +775,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.freshwater')} ({t('logs.refilled')})</label>
|
<label>{t('logs.refilled')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -786,7 +786,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.freshwater')} ({t('logs.evening')})</label>
|
<label>{t('logs.evening')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -799,11 +799,12 @@ export default function LogEntryEditor({
|
|||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.consumption')} (L)</label>
|
<label>{t('logs.consumption')} (L)</label>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="number"
|
||||||
className="input-text cell-input text-green"
|
className="input-text consumption-value"
|
||||||
style={{ color: '#4ade80', fontWeight: 'bold' }}
|
|
||||||
value={fwConsumption}
|
value={fwConsumption}
|
||||||
disabled
|
readOnly
|
||||||
|
tabIndex={-1}
|
||||||
|
aria-readonly="true"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -817,7 +818,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
<div className="consumption-grid">
|
<div className="consumption-grid">
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.fuel')} ({t('logs.morning')})</label>
|
<label>{t('logs.morning')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -828,7 +829,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.fuel')} ({t('logs.refilled')})</label>
|
<label>{t('logs.refilled')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -839,7 +840,7 @@ export default function LogEntryEditor({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.fuel')} ({t('logs.evening')})</label>
|
<label>{t('logs.evening')}</label>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
className="input-text"
|
className="input-text"
|
||||||
@@ -852,11 +853,12 @@ export default function LogEntryEditor({
|
|||||||
<div className="input-group">
|
<div className="input-group">
|
||||||
<label>{t('logs.consumption')} (L)</label>
|
<label>{t('logs.consumption')} (L)</label>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="number"
|
||||||
className="input-text cell-input text-green"
|
className="input-text consumption-value"
|
||||||
style={{ color: '#4ade80', fontWeight: 'bold' }}
|
|
||||||
value={fuelConsumption}
|
value={fuelConsumption}
|
||||||
disabled
|
readOnly
|
||||||
|
tabIndex={-1}
|
||||||
|
aria-readonly="true"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user