ode-csslib 4.0.7 → 4.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/version.txt CHANGED
@@ -1 +1 @@
1
- entcore-css-lib=4.0.7 17/02/2023 10:44:14
1
+ entcore-css-lib=4.0.8 06/03/2023 11:15:59
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ode-csslib",
3
- "version": "4.0.7",
3
+ "version": "4.0.8",
4
4
  "description": "Open Digital Education Legacy CSS framework",
5
5
  "scripts": {
6
6
  "copy-fonts": "cpr node_modules/entcore-generic-icons/fonts/ assets/fonts/generic-icons/ -o",
@@ -53,6 +53,45 @@
53
53
  margin-bottom: 15px;
54
54
  }
55
55
 
56
+ .unlock-flex {
57
+ display: flex;
58
+ align-items: center;
59
+ position: absolute;
60
+ top: 10px;
61
+ right: 20px;
62
+ font-size: 16px;
63
+ font-weight: 700;
64
+
65
+ .icon-lock {
66
+ margin-top: 3px;
67
+ margin-right: 5px;
68
+ }
69
+ }
70
+
71
+ .unlock {
72
+ color: #2A9CC8;
73
+
74
+ &:hover {
75
+ color: #2A9CC8;
76
+ }
77
+
78
+ .icon-lock {
79
+ color: #2A9CC8;
80
+ }
81
+
82
+ &-disabled[disabled] {
83
+ color: #B2DAEF;
84
+
85
+ &:hover {
86
+ color: #B2DAEF;
87
+ }
88
+
89
+ .icon-lock {
90
+ color: #B2DAEF;
91
+ }
92
+ }
93
+ }
94
+
56
95
  .profil-flex {
57
96
  display: flex;
58
97
  justify-content: space-between;
@@ -35,7 +35,7 @@
35
35
  }
36
36
  }
37
37
 
38
- &.PROGRESS, &.PARTIALLYVALIDED, &.PARTIALLYREJECTED, &.RESUBMIT, &.PARTIALLYRESUBMIT {
38
+ &.IN_PROGRESS, &.PARTIALLYVALIDED, &.PARTIALLYREJECTED, &.RESUBMIT, &.PARTIALLYRESUBMIT {
39
39
  background: $yellow;
40
40
 
41
41
  > i {
@@ -46,6 +46,10 @@
46
46
  justify-content: space-between;
47
47
  margin-bottom: 2%;
48
48
  }
49
+
50
+ &-label {
51
+ max-width: 200px;
52
+ }
49
53
 
50
54
  &-range {
51
55
  display: flex;
@@ -99,9 +103,7 @@
99
103
  input[type="range"]::-webkit-slider-thumb, {
100
104
  -webkit-appearance: none; /* Override default look */
101
105
  appearance: none;
102
- margin-top: -4px; /* Centers thumb on the track with formula (track height in pixels / 2) - (thumb height in pixels /2) - border size*/
103
106
  background-color: $formulaire-grey-very-light;
104
- border: $formulaire-grey-dark 1px solid;
105
107
  border-radius: 100px;
106
108
  height: 16px;
107
109
  width: 16px;
@@ -112,7 +114,6 @@
112
114
  /* Firefox */
113
115
  input[type="range"]::-moz-range-thumb {
114
116
  background-color: $formulaire-grey-very-light;
115
- border: $formulaire-grey-dark 1px solid;
116
117
  border-radius: 100px;
117
118
  height: 16px;
118
119
  width: 16px;
@@ -141,7 +142,7 @@
141
142
  position: absolute;
142
143
  left: calc((((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%) - 10px);
143
144
  bottom: 35px;
144
- width: 20px;
145
+ width: 23px;
145
146
  height: 20px;
146
147
  background-color: $formulaire-blue;
147
148
 
@@ -157,9 +158,9 @@
157
158
  top: 20px;
158
159
  width: 0;
159
160
  height: 0;
160
- border-left: 10px solid transparent;
161
- border-right: 10px solid transparent;
162
- border-top: 10px solid $formulaire-blue;
161
+ border-left: 12px solid transparent;
162
+ border-right: 11px solid transparent;
163
+ border-top: 11px solid $formulaire-blue;
163
164
  content: '';
164
165
  }
165
166
  }
@@ -170,7 +171,7 @@
170
171
  position: absolute;
171
172
  height: 10px;
172
173
  width: calc(((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%);
173
- bottom: 9px;
174
+ bottom: 8px;
174
175
  left: 3px;
175
176
  background-color: $formulaire-blue;
176
177
  border-radius: 5px;
@@ -186,7 +187,6 @@
186
187
  left: 3px;
187
188
  background-color: #efefef;
188
189
  border-radius: 5px;
189
- border: #4a4a4a 1px solid;
190
190
  content: '';
191
191
  z-index: 1;
192
192
  }
@@ -1,6 +1,6 @@
1
1
 
2
2
  @font-face {
3
- font-family: 'material-icons';
3
+ font-family: 'lystore-material-icons';
4
4
  src: url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.eot');
5
5
  src: url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.eot') format('embedded-opentype'),
6
6
  url('/lystore/public/font/material-design/fonts/materialdesignicons-webfont.woff2') format('woff2'),
@@ -9,6 +9,7 @@
9
9
  font-weight: normal;
10
10
  font-style: normal;
11
11
  }
12
+ $lystore-light-grey: #7f8080;
12
13
 
13
14
  body.lystore {
14
15
  @import './components/index';
@@ -0,0 +1,22 @@
1
+ i {
2
+ &.lystore-download::before {
3
+ font-family: 'lystore-material-icons';
4
+ content: "\F1DA";
5
+ }
6
+ &.trash::before{
7
+ font-family: 'lystore-material-icons';
8
+ content: "\FA79";
9
+ }
10
+ &.pencil::before{
11
+ font-family: 'lystore-material-icons';
12
+ content: "\F3EB";
13
+ }
14
+ &.tune::before{
15
+ font-family: 'lystore-material-icons';
16
+ content: "\F62E";
17
+ }
18
+ &.clipboard::before{
19
+ font-family: 'lystore-material-icons';
20
+ content: "\F14E";
21
+ }
22
+ }
@@ -4,6 +4,9 @@
4
4
  @import './async-autocomplete';
5
5
  @import './upload-files';
6
6
  @import './cloud-loader';
7
- @import './parameter-table';
7
+ @import './parameter/parameter-active-structure';
8
8
  @import './search-and-select';
9
- @import "./tabs";
9
+ @import "./tabs";
10
+ @import "./parameter/parameter";
11
+ @import "./icons";
12
+ @import "./directives/order-preview";
@@ -0,0 +1,162 @@
1
+ .pdf-generation-preview .prev-next {
2
+ margin-top: 50px;
3
+ }
4
+
5
+ .order-preview {
6
+ margin-top: 50px;
7
+ font-family: "Calibri", sans-serif !important;
8
+ align-content: center !important;
9
+ color: #000000 !important;
10
+
11
+ & h1,
12
+ & h2,
13
+ & h3,
14
+ & h4,
15
+ & h5 {
16
+ color: #000000 !important;
17
+ }
18
+
19
+ & .logo-region{
20
+ height: auto;
21
+ width: 300px;
22
+ border-bottom: 1px #f6f6f6 solid ;
23
+ margin-bottom: 5px;
24
+ }
25
+
26
+ & .left {
27
+ position: relative;
28
+ width: 45%;
29
+ margin-right: 5%;
30
+ display: inline-block;
31
+ }
32
+
33
+ & .left::before {
34
+ content: none !important;
35
+ }
36
+ & .right {
37
+ position: relative;
38
+ margin-left: 5%;
39
+ width: 44%;
40
+ display: inline-block;
41
+ }
42
+
43
+ & .order-info {
44
+ margin-top: 25px;
45
+ margin-bottom: 25px;
46
+ }
47
+
48
+ & .right > input {
49
+ width: 90%;
50
+ }
51
+ & .right > h1{
52
+ font-size: 20px ;
53
+ }
54
+ & .header {
55
+ width: 100%;
56
+ }
57
+ & .foot {
58
+ width: 100%;
59
+ margin-top: 35px;
60
+ }
61
+
62
+ & .fright {
63
+ float: right;
64
+ }
65
+
66
+ & .signature {
67
+ height: 60px;
68
+ }
69
+ & .equipments-table {
70
+ width: 100%;
71
+ margin-top: 15px;
72
+ border-collapse: collapse;
73
+ }
74
+ & .equipments-table tfoot tr td:first-child {
75
+ font-weight: bold;
76
+ }
77
+ & .equipments-table tr td {
78
+ padding-top:10px;
79
+ padding-left: 10px ;
80
+ padding-bottom:10px;
81
+ border: 1px solid #ddd;
82
+ }
83
+
84
+ & table.equipments-table > tbody tr:nth-child(odd) td {
85
+ background-color: #efefef;
86
+ }
87
+ & table.equipments-table > tbody tr:nth-child(even) td {
88
+ background-color: #f2f4f6;
89
+ }
90
+
91
+ & table > thead {
92
+ font-size: 14px ;
93
+ font-weight: bold;
94
+ text-align: center;
95
+ }
96
+ & input {
97
+ min-width: 150px ;
98
+ width: 150px;
99
+ max-width: 100%;
100
+ margin-left: 5px;
101
+ padding-left: 5px ;
102
+ }
103
+
104
+ & table > tfoot > tr {
105
+ margin-top: 20px;
106
+ }
107
+ & div.service-fait > table.header {
108
+ margin-bottom: 10px ;
109
+ }
110
+ & div.service-fait > table.equipments-table {
111
+ margin-top: 5px;
112
+ margin-bottom: 10px;
113
+ }
114
+ & div.service-fait > div.signature {
115
+ width: 100%;
116
+ height: 400px;
117
+ }
118
+ & div.block {
119
+ border: 0.5px #aaaaaa solid;
120
+ margin-bottom: 5px ;
121
+ margin-top: 5px ;
122
+ padding: 5px;
123
+ page-break-after: avoid;
124
+ }
125
+ & .center-text {
126
+ text-align: center;
127
+ }
128
+
129
+ & .right-text {
130
+ text-align: right;
131
+ padding-right: 5px;
132
+ }
133
+
134
+ & .bigger {
135
+ width: 70%;
136
+ }
137
+
138
+ & .smaller {
139
+ width: 25%;
140
+ }
141
+
142
+ & .uppercase {
143
+ text-transform: uppercase;
144
+ }
145
+
146
+ & .orders {
147
+ margin-bottom: 50px;
148
+ }
149
+
150
+ & .header h4, & .header h5 {
151
+ margin: 5px;
152
+ }
153
+
154
+ & .signature:not(:empty) {
155
+ border-top: 0 !important;
156
+ }
157
+
158
+ & table thead td {
159
+ background-color: #fff;
160
+ color: #000;
161
+ }
162
+ }
@@ -1,6 +1,5 @@
1
- parameter-table
2
- {
3
- .parameter-table{
1
+ .parameter{
2
+ &-table{
4
3
  position: fixed;
5
4
  display: block;
6
5
  right: -250px;
@@ -14,6 +13,14 @@ parameter-table
14
13
  right: -250px;
15
14
  transition: right 250ms ease;
16
15
  }
16
+ &-body{
17
+ &-th{
18
+ &-left{
19
+ text-align: left;
20
+ padding-left: 2em;
21
+ }
22
+ }
23
+ }
17
24
  }
18
25
 
19
26
  .button-puce{
@@ -33,11 +40,11 @@ parameter-table
33
40
  }
34
41
  }
35
42
 
36
- .parameter-table::-webkit-scrollbar{
43
+ &-table::-webkit-scrollbar{
37
44
  width: 9px;
38
45
  background-color: #F5F5F5;
39
46
  }
40
- .parameter-table::-webkit-scrollbar-thumb
47
+ &-table::-webkit-scrollbar-thumb
41
48
  {
42
49
  border-radius: 10px;
43
50
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
@@ -49,5 +56,5 @@ parameter-table
49
56
  overflow-y: auto;
50
57
  height: 60vh;
51
58
  }
59
+ }
52
60
 
53
- }
@@ -0,0 +1,113 @@
1
+ .parameter{
2
+ &-subtitle{
3
+ text-transform: uppercase;
4
+ font-weight: bold;
5
+ color: $lystore-light-grey;
6
+ margin-top: 2em;
7
+ & > *{
8
+ vertical-align: middle;
9
+ }
10
+ & > i {
11
+ font-size: 1.5em;
12
+ }
13
+ }
14
+ &-valid-command{
15
+ color: $lystore-light-grey;
16
+ margin-bottom: 1em;
17
+ &-title{
18
+ margin-bottom: 1em;
19
+ }
20
+ &-label{
21
+ margin-left: 2em;
22
+ padding-left: 5px;
23
+ margin-bottom: 1em;
24
+ font-style: italic;
25
+ &-switch{
26
+ margin-left: 2em;
27
+ }
28
+ }
29
+ }
30
+ &-bc-setting{
31
+ &-title{
32
+ font-weight: bold;
33
+ color: $lystore-light-grey;
34
+ margin-bottom: 1em;
35
+ margin-top: 1em;
36
+ }
37
+ &-form-input{
38
+ &-line{
39
+ display: flex;
40
+ align-items: center;
41
+ justify-content: space-between;
42
+ margin-right: 2em;
43
+ margin-bottom: 1em;
44
+ & > input{
45
+ width: 75%;
46
+ margin-bottom: 0;
47
+ background-color: white;
48
+ }
49
+ }
50
+ }
51
+ &-img-render{
52
+ &-img{
53
+ position: relative;
54
+ clear: both;
55
+ box-sizing: border-box;
56
+ margin-left: 15%;
57
+ width: 50%;
58
+ }
59
+ }
60
+ &-buttons{
61
+ padding-left: 1em;
62
+ display: flex;
63
+ column-gap: 1em;
64
+ }
65
+ }
66
+ &-bc-preview{
67
+ &-address {
68
+ border: 1px black solid;
69
+ height: 250px;
70
+
71
+ &-text {
72
+ text-align: center;
73
+ padding-bottom: 1em;
74
+ padding-top: 1em;
75
+ }
76
+ }
77
+ &-signature{
78
+ border: 1px black solid;
79
+ height: 100px;
80
+ &-text {
81
+ text-align: center;
82
+ padding-bottom: 1em;
83
+ padding-top: 1em;
84
+ }
85
+ }
86
+ &-elem {
87
+ padding-left: 1em;
88
+ padding-right: 1em;
89
+ }
90
+ }
91
+ &-export-options{
92
+ &-instruction{
93
+ &-switches{
94
+ display: flex;
95
+ flex-flow: row wrap;
96
+ row-gap : 5px;
97
+ & > * {
98
+ flex: 0 0 50%;
99
+ }
100
+ }
101
+ }
102
+ &-bc{
103
+ &-switches{
104
+ display: flex;
105
+ flex-flow: row wrap;
106
+ row-gap : 5px;
107
+ & > * {
108
+ flex: 0 0 50%;
109
+ }
110
+ }
111
+ }
112
+ }
113
+ }
@@ -107,4 +107,14 @@ i {
107
107
  font-family: 'minibadge-icons';
108
108
  content: "\F0987";
109
109
  }
110
+
111
+ &.icon-eye::before {
112
+ font-family: 'minibadge-icons';
113
+ content: "\F06D0";
114
+ }
115
+
116
+ &.eye-off::before {
117
+ font-family: 'minibadge-icons';
118
+ content: "\F06D1";
119
+ }
110
120
  }
@@ -87,6 +87,16 @@
87
87
  &-top-most-refused {
88
88
  flex: 4;
89
89
 
90
+ .minibadge-card {
91
+ width: 100%;
92
+ background: $minibadge-white;
93
+ border: none;
94
+
95
+ container-body {
96
+ font-weight: bold;
97
+ }
98
+ }
99
+
90
100
  .close-circle {
91
101
  color: $minibadge-red;
92
102
  }
@@ -30,6 +30,7 @@
30
30
  font-size: 18px;
31
31
  font-weight: bold;
32
32
  background-color: $white;
33
+ z-index: 1;
33
34
 
34
35
  .student-count {
35
36
  flex: 2;