Skip to content

Commit 01e2e02

Browse files
b23
1 parent 3a03d16 commit 01e2e02

File tree

2 files changed

+50
-11
lines changed

2 files changed

+50
-11
lines changed

assets/build/css/punica.min.css

Lines changed: 9 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

components/alert/index.html

Lines changed: 41 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -171,28 +171,42 @@ <h2 class="display-flex mb-10">
171171
</main> <div class="container">
172172
<div class="pure reset panel">
173173
<div class="content">
174-
<span class="alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</span>
174+
<span class="alert">This is my <a href="javascript:">default</a> alert.</span>
175+
<span class="closable alert">This is my closable <a href="javascript:">default</a> alert.</span>
175176
</div>
176177
<div class="content">
177178
<script type="text/plain" class="language-markup">
178-
<span class="alert"></span>
179179
<div class="alert"></div>
180+
<div class="closable alert"></div>
180181
</script>
181182
</div>
182183
<div class="content">
183-
<div class="primary alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</div>
184-
<div class="success alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</div>
185-
<div class="warning alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</div>
186-
<div class="error alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</div>
187-
<div class="dark alert">Lorem ipsum <a href="javascript:">dolor sit</a> amet.</div>
184+
<div class="primary alert">This is my <a href="javascript:">primary</a> alert.</div>
185+
<div class="closable primary alert">This is my primary <a href="javascript:">closable</a> alert.</div>
186+
<div class="success alert">This is my <a href="javascript:">success</a> alert.</div>
187+
<div class="warning alert">This is my <a href="javascript:">warning</a> alert.</div>
188+
<div class="error alert">This is my <a href="javascript:">error</a> alert.</div>
189+
<div class="dark alert">This is my <a href="javascript:">dark</a> alert.</div>
188190
</div>
189191
<div class="content">
190192
<script type="text/plain" class="language-markup">
191193
<div class="primary alert"></div>
192-
<div class="success alert"></div>
193-
<div class="warning alert"></div>
194-
<div class="error alert"></div>
195-
<div class="dark alert"></div>
194+
<div class="closable primary alert"></div>
195+
</script>
196+
</div>
197+
<div class="header">
198+
<div class="title">Outlined Style</div>
199+
</div>
200+
<div class="content">
201+
<div class="outlined primary alert">This is my outlined <a href="javascript:">primary</a> alert.</div>
202+
<div class="outlined closable primary alert">This is my outlined <a href="javascript:">closable</a> primary alert.</div>
203+
<div class="outlined error alert border-2">Utility : border-2</div>
204+
</div>
205+
<div class="content">
206+
<script type="text/plain" class="language-markup">
207+
<div class="outlined primary alert"></div>
208+
<div class="outlined closable primary alert"></div>
209+
<div class="outlined closable error alert border-2"></div>
196210
</script>
197211
</div>
198212
<div class="header">
@@ -239,6 +253,22 @@ <h2 class="display-flex mb-10">
239253
<td><code>dark</code></td>
240254
<td><code>.dark.alert</code></td>
241255
</tr>
256+
<tr>
257+
<td><code>outlined</code></td>
258+
<td><code>.outlined.alert</code></td>
259+
</tr>
260+
</tbody>
261+
<thead>
262+
<tr>
263+
<th>States</th>
264+
<th>Combinators</th>
265+
</tr>
266+
</thead>
267+
<tbody>
268+
<tr>
269+
<td><code>closable</code></td>
270+
<td><code>.closable.alert</code></td>
271+
</tr>
242272
</tbody>
243273
<thead>
244274
<tr>

0 commit comments

Comments
 (0)