@guillaumemmm/marquedefabrique 1.0.0 → 1.0.1

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.
Files changed (3) hide show
  1. package/index.html +14 -4
  2. package/kit.css +10 -2
  3. package/package.json +1 -1
package/index.html CHANGED
@@ -37,6 +37,10 @@
37
37
  <h3 class="mdf-title4">Marque de fabrique</h3>
38
38
  <p>Marque de fabrique</p>
39
39
  <p>Marque de <span class="mdf-highlighted">fabrique</span></p>
40
+ <div><em class="mdf-emphasis">Marque de fabrique</em></div>
41
+ <div><i class="mdf-italic">Marque de fabrique</i></div>
42
+ <div><em class="mdf-muted">Marque de fabrique</em></div>
43
+ <div><a class="mdf-link" href="#">Marque de fabrique</a></div>
40
44
  <p>
41
45
  Une <span class="mdf-highlighted">manufacture</span> (du latin
42
46
  <span class="mdf-italic">manufactura</span>, « fait à la main ») est
@@ -51,10 +55,6 @@
51
55
  les différencier de celles qui sous-traitent partiellement ou
52
56
  intégralement cette fabrication.
53
57
  </p>
54
- <div><em class="mdf-emphasis">Marque de fabrique</em></div>
55
- <div><i class="mdf-italic">Marque de fabrique</i></div>
56
- <div><em class="mdf-muted">Marque de fabrique</em></div>
57
- <div><a class="mdf-link" href="#">Marque de fabrique</a></div>
58
58
  <div>
59
59
  <a class="mdf-link" href="#" target="_blank"
60
60
  >Marque de fabrique
@@ -116,6 +116,16 @@
116
116
  <input type="text" class="mdf-input" id="text-input" />
117
117
  </label>
118
118
  </div>
119
+ <div>
120
+ <label for="textinput" class="mdf-textarea-control">
121
+ Marque de fabrique
122
+ <textarea
123
+ type="text"
124
+ class="mdf-textarea"
125
+ id="textinput"
126
+ ></textarea>
127
+ </label>
128
+ </div>
119
129
  <div>
120
130
  <label class="mdf-select-control" for="select">
121
131
  Marque de fabrique
package/kit.css CHANGED
@@ -124,6 +124,7 @@
124
124
 
125
125
  /* FORM */
126
126
  .mdf-input:focus-visible,
127
+ .mdf-textarea:focus-visible,
127
128
  .mdf-color:focus-visible,
128
129
  .mdf-select:focus-visible {
129
130
  outline: 2px solid var(--mdf-color-primary);
@@ -164,14 +165,16 @@
164
165
  background-color: var(--mdf-color-primary-transparent-2);
165
166
  }
166
167
 
167
- .mdf-input-control {
168
+ .mdf-input-control,
169
+ .mdf-textarea-control {
168
170
  display: inline-flex;
169
171
  flex-direction: column;
170
172
  }
171
173
 
172
174
  .mdf-input[type="text"],
173
175
  .mdf-input[type="search"],
174
- .mdf-input[type="password"] {
176
+ .mdf-input[type="password"],
177
+ .mdf-textarea {
175
178
  border: 2px solid var(--mdf-color-primary);
176
179
  border-radius: 0.25rem;
177
180
  font-size: 16px;
@@ -186,6 +189,11 @@
186
189
  }
187
190
  }
188
191
 
192
+ .mdf-textarea {
193
+ width: 320px;
194
+ height: 150px;
195
+ }
196
+
189
197
  .mdf-checkbox-control {
190
198
  font-size: 1rem;
191
199
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@guillaumemmm/marquedefabrique",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "Marque de Fabrique is a minimalistic UI kit. It includes a set of core styles and CSS variables centralizing design elements to maintain consistency across personal projects.",
5
5
  "main": "index.css",
6
6
  "scripts": {