mirror of
https://github.com/itflow-org/itflow
synced 2026-09-02 04:45:15 +00:00
Fix Color Class
This commit is contained in:
@@ -48,7 +48,7 @@ $category_types_array = ['Expense', 'Income', 'Referral', 'Ticket'];
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -37,7 +37,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" value="<?= $category_color ?>" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" value="<?= $category_color ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -67,7 +67,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -50,7 +50,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" value="<?= $tag_color ?>" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" value="<?= $tag_color ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -41,7 +41,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" value="<?= $ticket_status_color ?>" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" value="<?= $ticket_status_color ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -27,7 +27,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@ ob_start();
|
||||
<label>Color <strong class="text-danger">*</strong></label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-fw fa-paint-brush"></i></span>
|
||||
<input type="color" class="form-control form-control-color w-auto flex-grow-0" name="color" value="<?= $calendar_color ?>" required>
|
||||
<input type="color" class="form-control form-control-color" name="color" value="<?= $calendar_color ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1385,6 +1385,22 @@ select.select2[multiple]:not(.tomselected) {
|
||||
--lte-primary-color-rgb: 0, 0, 0;
|
||||
}
|
||||
|
||||
/* --- Colour inputs ---------------------------------------------------------
|
||||
Bootstrap sizes `.form-control-color` at width:3rem, but every colour input
|
||||
in ITFlow sits inside an .input-group, and `.input-group > .form-control`
|
||||
(0,2,0) sets `width: 1%; flex: 1 1 auto` - which outranks .form-control-color
|
||||
(0,1,0) and collapses the swatch to a sliver. Matching that specificity is
|
||||
the only way to win it back; the selector is strictly narrower than the one
|
||||
it ties with, so nothing but a colour input is affected.
|
||||
|
||||
4rem rather than Bootstrap's 3rem: the swatch is the entire point of the
|
||||
control, and .text-sm keeps the height at the 35px of its neighbours, so
|
||||
there is only width available to read the colour by. */
|
||||
.input-group > .form-control-color {
|
||||
flex: 0 0 auto;
|
||||
width: 4rem;
|
||||
}
|
||||
|
||||
/* --- intl-tel-input --------------------------------------------------------
|
||||
The library wraps the input in a .iti container, which inside an
|
||||
.input-group becomes the flex item instead of the input. Bootstrap sizes its
|
||||
|
||||
Reference in New Issue
Block a user