dolibarr 24.0.0-beta
progress.inc.php
1<?php
2/* Copyright (C) 2025 MDW <mdeweerd@users.noreply.github.com>
3 */
4if (!defined('ISLOADEDBYSTEELSHEET')) {
5 die('Must be call by steelsheet');
6}
14'
15@phan-var-force string $badgeDanger
16@phan-var-force string $badgeSuccess
17@phan-var-force string $badgeWarning
18@phan-var-force string $colorblind_deuteranopes_badgeDanger
19@phan-var-force string $colorblind_deuteranopes_badgeSuccess
20'
21?>
22
23/* IDE Hack <style type="text/css"> */
24
25/*
26 progress style is based on bootstrap and admin lte framework
27 */
28
29
30/*
31 * Component: Progress Bar
32 * -----------------------
33 */
34
35.progress * {
36 -webkit-box-sizing: border-box;
37 -moz-box-sizing: border-box;
38 box-sizing: border-box;
39}
40
41.progress {
42 height: 20px;
43 overflow: hidden;
44 background-color: #f5f5f5;
45 background-color: rgba(128, 128, 128, 0.1);
46 border-radius: 4px;
47 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
48}
49
50.progress.spaced {
51 margin-bottom: 20px;
52}
53
54.progress-bar {
55 float: left;
56 width: 0;
57 height: 100%;
58 font-size: 12px;
59 line-height: 20px;
60 color: #fff;
61 text-align: center;
62 background-color: #337ab7;
63 box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
64 -webkit-transition: width .6s ease;
65 -o-transition: width .6s ease;
66 transition: width .6s ease;
67}
68
69
70
71.progress-group > .progress{
72 clear: both;
73}
74
75.progress,
76.progress > .progress-bar {
77 box-shadow: none;
78}
79.progress,
80.progress > .progress-bar,
81.progress .progress-bar,
82.progress > .progress-bar .progress-bar {
83 border-radius: 1px;
84}
85/* size variation */
86.progress.sm,
87.progress-sm {
88 height: 10px;
89}
90.progress.sm,
91.progress-sm,
92.progress.sm .progress-bar,
93.progress-sm .progress-bar {
94 border-radius: 1px;
95}
96.progress.xs,
97.progress-xs {
98 height: 7px;
99}
100.progress.xs,
101.progress-xs,
102.progress.xs .progress-bar,
103.progress-xs .progress-bar {
104 border-radius: 1px;
105}
106.progress.xxs,
107.progress-xxs {
108 height: 3px;
109}
110.progress.xxs,
111.progress-xxs,
112.progress.xxs .progress-bar,
113.progress-xxs .progress-bar {
114 border-radius: 1px;
115}
116
117
118/* Vertical bars */
119.progress.vertical {
120 position: relative;
121 width: 30px;
122 height: 200px;
123 display: inline-block;
124 margin-right: 10px;
125}
126.progress.vertical > .progress-bar {
127 width: 100%;
128 position: absolute;
129 bottom: 0;
130}
131.progress.vertical.sm,
132.progress.vertical.progress-sm {
133 width: 20px;
134}
135.progress.vertical.xs,
136.progress.vertical.progress-xs {
137 width: 10px;
138}
139.progress.vertical.xxs,
140.progress.vertical.progress-xxs {
141 width: 3px;
142}
143.progress-group .progress-text {
144 /* font-weight: 600; */
145}
146.progress-group .progress-number {
147 float: right;
148}
149
150
151
152/* Remove margins from progress bars when put in a table */
153.table tr > td .progress {
154 margin: 0;
155}
156.progress-bar-light-blue,
157.progress-bar-primary {
158 background-color: #3c8dbc;
159}
160.progress-striped .progress-bar-light-blue,
161.progress-striped .progress-bar-primary {
162 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
163 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
164 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
165}
166.progress-bar-green, .progress-bar-success {
167 background-color: <?php echo $badgeSuccess ?>;
168}
169.progress-striped .progress-bar-green, .progress-striped .progress-bar-success {
170 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
171 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
172 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
173}
174body[class*="colorblind-"] .progress-bar-green, body[class*="colorblind-"] .progress-bar-success {
175 background-color: <?php echo $colorblind_deuteranopes_badgeSuccess ?>;
176}
177body[class*="colorblind-"] .progress-bar-red, body[class*="colorblind-"] .progress-bar-danger {
178 background-color: <?php echo $colorblind_deuteranopes_badgeDanger ?>;
179}
180
181.progress-bar-aqua,
182.progress-bar-info {
183 background-color: #00c0ef;
184}
185.progress-striped .progress-bar-aqua,
186.progress-striped .progress-bar-info {
187 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
188 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
189 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
190}
191.progress-bar-yellow,
192.progress-bar-warning {
193 background-color: <?php echo $badgeWarning ?>;
194}
195.progress-striped .progress-bar-yellow,
196.progress-striped .progress-bar-warning {
197 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
198 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
199 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
200}
201.progress-bar-red,
202.progress-bar-danger {
203 background-color: <?php echo $badgeDanger ?>;
204}
205.progress-striped .progress-bar-red,
206.progress-striped .progress-bar-danger {
207 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
208 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
209 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
210}
211.progress-bar-consumed {
212 background-color: rgb(0, 0, 0, 0.15);
213}
214.progress-bar-consumed-late {
215 background-color: <?php echo colorAgressiveness($badgeDanger, -95, +70) ?>;
216}
print $object position
Definition edit.php:206
colorAgressiveness($hex, $ratio=-50, $brightness=0)
Change color to make it less aggressive (ratio is negative) or more aggressive (ratio is positive)