Skip to content

Commit 699bf08

Browse files
010
1 parent 185f93f commit 699bf08

82 files changed

Lines changed: 8612 additions & 8649 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

components/alert/index.html

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1">
66
<link rel="canonical" href="https://codeforms.github.io/Punica-CSS-Framework/components/alert">
77
<title> Alert - Punica CSS Framework v3 </title>
8-
<meta name="description" content="The Alert component is designed to display important messages or notifications to users. It offers a straightforward and effective way to capture attention, emphasize key information, or convey the status of an action. With six available themesdefault, &lt;code&gt;.primary&lt;/code&gt;, &lt;code&gt;.success&lt;/code&gt;, &lt;code&gt;.warning&lt;/code&gt;, &lt;code&gt;.error&lt;/code&gt;, and &lt;code&gt;.dark&lt;/code&gt;Alerts are highly customizable to suit various designs and themes. Simply add the &lt;code&gt;.alert&lt;/code&gt; class to a &lt;code&gt;span&lt;/code&gt; or &lt;code&gt;div&lt;/code&gt; container element to create an alert.">
8+
<meta name="description" content="The Alert component is designed to display important messages or notifications to users. It offers a straightforward and effective way to capture attention, emphasize key information, or convey the status of an action. With six available themes; default, &lt;code&gt;.primary&lt;/code&gt;, &lt;code&gt;.success&lt;/code&gt;, &lt;code&gt;.warning&lt;/code&gt;, &lt;code&gt;.error&lt;/code&gt;, and &lt;code&gt;.dark&lt;/code&gt;. Alerts are highly customizable to suit various designs and themes. Simply add the &lt;code&gt;.alert&lt;/code&gt; class to a &lt;code&gt;span&lt;/code&gt; or &lt;code&gt;div&lt;/code&gt; container element to create an alert.">
99
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
1010
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/codeforms/Punica-CSS-Framework@3.x.x/dist/punica.min.css">
1111
<link rel="stylesheet" href="https://codeforms.github.io/Punica-CSS-Framework/assets/build/css/prism.css">
@@ -70,78 +70,78 @@
7070
</div>
7171
</div>
7272
<div class="pure small menu display-block overflow-y-auto pb-100 pt-20 px-30" style="height: calc(-145px + 100vh);">
73-
<li class="item" id="alert">
74-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/alert#alert" class="py-0 active border-left-4 border-dark transparent weight-bold">
73+
<li class="item" id="0">
74+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/alert#0" class="py-0 active border-left-4 border-dark transparent weight-bold">
7575
<span class="color-text-lighten-20">Alert</span>
7676
</a>
7777
</li>
78-
<li class="item" id="badge">
79-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/badge#badge" class="py-0 ">
78+
<li class="item" id="1">
79+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/badge#1" class="py-0 ">
8080
<span class="color-text-lighten-20">Badge</span>
8181
</a>
8282
</li>
83-
<li class="item" id="breadcrumb">
84-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/breadcrumb#breadcrumb" class="py-0 ">
83+
<li class="item" id="2">
84+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/breadcrumb#2" class="py-0 ">
8585
<span class="color-text-lighten-20">Breadcrumb</span>
8686
</a>
8787
</li>
88-
<li class="item" id="caption">
89-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/caption#caption" class="py-0 ">
88+
<li class="item" id="3">
89+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/caption#3" class="py-0 ">
9090
<span class="color-text-lighten-20">Caption</span>
9191
</a>
9292
</li>
93-
<li class="item" id="card">
94-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/card#card" class="py-0 ">
93+
<li class="item" id="4">
94+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/card#4" class="py-0 ">
9595
<span class="color-text-lighten-20">Card</span>
9696
</a>
9797
</li>
98-
<li class="item" id="label">
99-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/label#label" class="py-0 ">
98+
<li class="item" id="5">
99+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/label#5" class="py-0 ">
100100
<span class="color-text-lighten-20">Label</span>
101101
</a>
102102
</li>
103-
<li class="item" id="list">
104-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/list#list" class="py-0 ">
103+
<li class="item" id="6">
104+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/list#6" class="py-0 ">
105105
<span class="color-text-lighten-20">List</span>
106106
</a>
107107
</li>
108-
<li class="item" id="menu">
109-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/menu#menu" class="py-0 ">
108+
<li class="item" id="7">
109+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/menu#7" class="py-0 ">
110110
<span class="color-text-lighten-20">Menu</span>
111111
</a>
112112
</li>
113-
<li class="item" id="navbar">
114-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/navbar#navbar" class="py-0 ">
113+
<li class="item" id="8">
114+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/navbar#8" class="py-0 ">
115115
<span class="color-text-lighten-20">Navbar</span>
116116
</a>
117117
</li>
118-
<li class="item" id="panel">
119-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/panel#panel" class="py-0 ">
118+
<li class="item" id="9">
119+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/panel#9" class="py-0 ">
120120
<span class="color-text-lighten-20">Panel</span>
121121
</a>
122122
</li>
123-
<li class="item" id="process">
124-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/process#process" class="py-0 ">
123+
<li class="item" id="10">
124+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/process#10" class="py-0 ">
125125
<span class="color-text-lighten-20">Process</span>
126126
</a>
127127
</li>
128-
<li class="item" id="stats">
129-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/stats#stats" class="py-0 ">
128+
<li class="item" id="11">
129+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/stats#11" class="py-0 ">
130130
<span class="color-text-lighten-20">Stats</span>
131131
</a>
132132
</li>
133-
<li class="item" id="tabnav">
134-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tabnav#tabnav" class="py-0 ">
133+
<li class="item" id="12">
134+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tabnav#12" class="py-0 ">
135135
<span class="color-text-lighten-20">Tabnav</span>
136136
</a>
137137
</li>
138-
<li class="item" id="timeline">
139-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/timeline#timeline" class="py-0 ">
138+
<li class="item" id="13">
139+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/timeline#13" class="py-0 ">
140140
<span class="color-text-lighten-20">Timeline</span>
141141
</a>
142142
</li>
143-
<li class="item" id="tooltip">
144-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tooltip#tooltip" class="py-0 ">
143+
<li class="item" id="14">
144+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tooltip#14" class="py-0 ">
145145
<span class="color-text-lighten-20">Tooltip</span>
146146
</a>
147147
</li>
@@ -168,7 +168,7 @@ <h2 class="display-flex mb-10">
168168
</div>
169169
</div>
170170
</div>
171-
<div class="mt-20">The Alert component is designed to display important messages or notifications to users. It offers a straightforward and effective way to capture attention, emphasize key information, or convey the status of an action. With six available themesdefault, <code>.primary</code>, <code>.success</code>, <code>.warning</code>, <code>.error</code>, and <code>.dark</code>Alerts are highly customizable to suit various designs and themes. Simply add the <code>.alert</code> class to a <code>span</code> or <code>div</code> container element to create an alert.</div>
171+
<div class="mt-20">The Alert component is designed to display important messages or notifications to users. It offers a straightforward and effective way to capture attention, emphasize key information, or convey the status of an action. With six available themes; default, <code>.primary</code>, <code>.success</code>, <code>.warning</code>, <code>.error</code>, and <code>.dark</code>. Alerts are highly customizable to suit various designs and themes. Simply add the <code>.alert</code> class to a <code>span</code> or <code>div</code> container element to create an alert.</div>
172172
</div>
173173
</div>
174174
</div>

components/badge/index.html

Lines changed: 30 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -70,78 +70,78 @@
7070
</div>
7171
</div>
7272
<div class="pure small menu display-block overflow-y-auto pb-100 pt-20 px-30" style="height: calc(-145px + 100vh);">
73-
<li class="item" id="alert">
74-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/alert#alert" class="py-0 ">
73+
<li class="item" id="0">
74+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/alert#0" class="py-0 ">
7575
<span class="color-text-lighten-20">Alert</span>
7676
</a>
7777
</li>
78-
<li class="item" id="badge">
79-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/badge#badge" class="py-0 active border-left-4 border-dark transparent weight-bold">
78+
<li class="item" id="1">
79+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/badge#1" class="py-0 active border-left-4 border-dark transparent weight-bold">
8080
<span class="color-text-lighten-20">Badge</span>
8181
</a>
8282
</li>
83-
<li class="item" id="breadcrumb">
84-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/breadcrumb#breadcrumb" class="py-0 ">
83+
<li class="item" id="2">
84+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/breadcrumb#2" class="py-0 ">
8585
<span class="color-text-lighten-20">Breadcrumb</span>
8686
</a>
8787
</li>
88-
<li class="item" id="caption">
89-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/caption#caption" class="py-0 ">
88+
<li class="item" id="3">
89+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/caption#3" class="py-0 ">
9090
<span class="color-text-lighten-20">Caption</span>
9191
</a>
9292
</li>
93-
<li class="item" id="card">
94-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/card#card" class="py-0 ">
93+
<li class="item" id="4">
94+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/card#4" class="py-0 ">
9595
<span class="color-text-lighten-20">Card</span>
9696
</a>
9797
</li>
98-
<li class="item" id="label">
99-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/label#label" class="py-0 ">
98+
<li class="item" id="5">
99+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/label#5" class="py-0 ">
100100
<span class="color-text-lighten-20">Label</span>
101101
</a>
102102
</li>
103-
<li class="item" id="list">
104-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/list#list" class="py-0 ">
103+
<li class="item" id="6">
104+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/list#6" class="py-0 ">
105105
<span class="color-text-lighten-20">List</span>
106106
</a>
107107
</li>
108-
<li class="item" id="menu">
109-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/menu#menu" class="py-0 ">
108+
<li class="item" id="7">
109+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/menu#7" class="py-0 ">
110110
<span class="color-text-lighten-20">Menu</span>
111111
</a>
112112
</li>
113-
<li class="item" id="navbar">
114-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/navbar#navbar" class="py-0 ">
113+
<li class="item" id="8">
114+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/navbar#8" class="py-0 ">
115115
<span class="color-text-lighten-20">Navbar</span>
116116
</a>
117117
</li>
118-
<li class="item" id="panel">
119-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/panel#panel" class="py-0 ">
118+
<li class="item" id="9">
119+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/panel#9" class="py-0 ">
120120
<span class="color-text-lighten-20">Panel</span>
121121
</a>
122122
</li>
123-
<li class="item" id="process">
124-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/process#process" class="py-0 ">
123+
<li class="item" id="10">
124+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/process#10" class="py-0 ">
125125
<span class="color-text-lighten-20">Process</span>
126126
</a>
127127
</li>
128-
<li class="item" id="stats">
129-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/stats#stats" class="py-0 ">
128+
<li class="item" id="11">
129+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/stats#11" class="py-0 ">
130130
<span class="color-text-lighten-20">Stats</span>
131131
</a>
132132
</li>
133-
<li class="item" id="tabnav">
134-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tabnav#tabnav" class="py-0 ">
133+
<li class="item" id="12">
134+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tabnav#12" class="py-0 ">
135135
<span class="color-text-lighten-20">Tabnav</span>
136136
</a>
137137
</li>
138-
<li class="item" id="timeline">
139-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/timeline#timeline" class="py-0 ">
138+
<li class="item" id="13">
139+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/timeline#13" class="py-0 ">
140140
<span class="color-text-lighten-20">Timeline</span>
141141
</a>
142142
</li>
143-
<li class="item" id="tooltip">
144-
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tooltip#tooltip" class="py-0 ">
143+
<li class="item" id="14">
144+
<a href="https://codeforms.github.io/Punica-CSS-Framework/components/tooltip#14" class="py-0 ">
145145
<span class="color-text-lighten-20">Tooltip</span>
146146
</a>
147147
</li>

0 commit comments

Comments
 (0)