Skip to content

Commit 9ae464f

Browse files
UnderlineWordsUnderlineWords
committed
b235
1 parent 5bce071 commit 9ae464f

4 files changed

Lines changed: 122 additions & 79 deletions

File tree

‎dist/punica.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/index.html‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!doctype html>
2+
<html class="no-js" lang="">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Punica CSS v3 - API-Driven Framework</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
8+
<link rel="stylesheet" href="../dist/punica.min.css">
9+
</head>
10+
<body>
11+
<div class="container vh-100">
12+
13+
<!-- content -->
14+
<div class="row full height align-items-center">
15+
<div class="col-lg-7 col-sm-16 col-xs-16 offset-lg-2">
16+
<div class="pure panel">
17+
<div class="borderless header flex-direction-column align-items-flex-start leading-1">
18+
<div class="text-big">
19+
Welcome To
20+
</div>
21+
<div class="text-huge weight-bold">
22+
Punica CSS v3
23+
</div>
24+
<span>
25+
API-Driven Framework
26+
</span>
27+
</div>
28+
<div class="content pt-5">
29+
<p>
30+
Punica CSS Framework is a clean, lightweight, responsive, modern,<br>
31+
and fully customizable <span class="text-underline">API-driven framework</span> built with SASS/SCSS,<br>
32+
offering multi-theme support.
33+
</p>
34+
<p>
35+
<span class="weight-700">View on <a href="https://github.com/codeforms/Punica-CSS-Framework" target="_blank">Github</span></a>
36+
</p>
37+
</div>
38+
</div>
39+
</div>
40+
</div>
41+
</div>
42+
</body>
43+
</html>

‎src/Modules/Components/Card/Card.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,7 @@
146146
flex: inherit;
147147
.#{class('card', 'title')},
148148
.#{class('card', 'description')} {
149-
padding: calc(#{components('card', 'padding')} / 2) #{components('card', 'padding')};
149+
padding: calc(#{components('card', 'padding')} / 2) calc(#{components('card', 'padding')} * 3);
150150
}
151151
.#{class('card', 'description')} {
152152
flex: 1;

‎src/Modules/Utilities/index.scss‎

Lines changed: 77 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -243,6 +243,42 @@ $helpers: (
243243
'args' : null, // for extra variables
244244
'variables' : (auto,cover,contain)
245245
),
246+
///
247+
/// Border
248+
///
249+
/// The border property is a shorthand property for
250+
/// border-width, border-style and border-color.
251+
///
252+
/// @example border-3
253+
/// @example border-right-2
254+
///
255+
'border':(
256+
'enabled' : true, // true or false
257+
'property' : 'border', // css property name (don't change it !)
258+
'prefix' : 'border', // prefix of class name
259+
'specificity': !important, // or null
260+
'unit' : rem, // length units (px, rem, em, %, vh, vw etc)
261+
'args' : (
262+
// suffix, value
263+
(0, 0), // 0
264+
(1, 0.063), // 1px
265+
(2, 0.125), // 2px
266+
(3, 0.188), // 3px
267+
(4, 0.25), // 4px
268+
(5, 0.313), // 5px
269+
(6, 0.375), // 6px
270+
(8, 0.5), // 8px
271+
(10, 0.625) // 10px
272+
),
273+
'variables': (
274+
// infix, property
275+
("-", border-width)
276+
("-top-", border-top-width)
277+
("-right-", border-right-width)
278+
("-bottom-", border-bottom-width)
279+
("-left-", border-left-width)
280+
)
281+
),
246282
///
247283
/// Border Color
248284
///
@@ -305,42 +341,6 @@ $helpers: (
305341
'args' : null, // for extra variables
306342
'variables' : (solid, dashed, dotted, double, groove, ridge)
307343
),
308-
///
309-
/// Border
310-
///
311-
/// The border property is a shorthand property for
312-
/// border-width, border-style and border-color.
313-
///
314-
/// @example border-3
315-
/// @example border-right-2
316-
///
317-
'border':(
318-
'enabled' : true, // true or false
319-
'property' : 'border', // css property name (don't change it !)
320-
'prefix' : 'border', // prefix of class name
321-
'specificity': !important, // or null
322-
'unit' : rem, // length units (px, rem, em, %, vh, vw etc)
323-
'args' : (
324-
// suffix, value
325-
(0, 0), // 0
326-
(1, 0.063), // 1px
327-
(2, 0.125), // 2px
328-
(3, 0.188), // 3px
329-
(4, 0.25), // 4px
330-
(5, 0.313), // 5px
331-
(6, 0.375), // 6px
332-
(8, 0.5), // 8px
333-
(10, 0.625) // 10px
334-
),
335-
'variables': (
336-
// infix, property
337-
("-", border-width)
338-
("-top-", border-top-width)
339-
("-right-", border-right-width)
340-
("-bottom-", border-bottom-width)
341-
("-left-", border-left-width)
342-
)
343-
),
344344
///
345345
/// Caret Color
346346
/// The caret-color property specifies
@@ -472,6 +472,31 @@ $helpers: (
472472
)
473473
),
474474
///
475+
/// Flex
476+
///
477+
/// The flex property sets the flexible length on flexible items.
478+
/// The flex property is a shorthand property for flex-grow, flex-shrink
479+
/// and flex-basis.
480+
///
481+
/// @example flex-1
482+
/// @example flex-initial
483+
///
484+
'flex': (
485+
'enabled' : true, // true or false
486+
'property' : 'flex', // css property name (don't change it !)
487+
'prefix' : 'flex-', // prefix of class name
488+
'specificity': !important, // or null
489+
'unit' : null, // length units (px, rem, em, %, vh, vw etc)
490+
'args' : null, // for extra variables
491+
'variables' : (
492+
// class name (suffix), value
493+
("1", 1 1 0%),
494+
("auto", 1 1 auto),
495+
("initial", 0 1 auto),
496+
("none", none)
497+
)
498+
),
499+
///
475500
/// Flex Direction
476501
///
477502
/// The flex-direction property specifies
@@ -544,31 +569,6 @@ $helpers: (
544569
'variables' : (wrap, wrap-reverse, nowrap)
545570
),
546571
///
547-
/// Flex
548-
///
549-
/// The flex property sets the flexible length on flexible items.
550-
/// The flex property is a shorthand property for flex-grow, flex-shrink
551-
/// and flex-basis.
552-
///
553-
/// @example flex-1
554-
/// @example flex-initial
555-
///
556-
'flex': (
557-
'enabled' : true, // true or false
558-
'property' : 'flex', // css property name (don't change it !)
559-
'prefix' : 'flex-', // prefix of class name
560-
'specificity': !important, // or null
561-
'unit' : null, // length units (px, rem, em, %, vh, vw etc)
562-
'args' : null, // for extra variables
563-
'variables' : (
564-
// class name (suffix), value
565-
("1", 1 1 0%),
566-
("auto", 1 1 auto),
567-
("initial", 0 1 auto),
568-
("none", none)
569-
)
570-
),
571-
///
572572
/// Float
573573
///
574574
/// The float property specifies whether an element should
@@ -1025,22 +1025,6 @@ $helpers: (
10251025
)
10261026
),
10271027
///
1028-
/// Outline Style
1029-
///
1030-
/// The outline-style property specifies the style of an outline
1031-
///
1032-
/// @example outline-dashed
1033-
///
1034-
'outline-style': (
1035-
'enabled' : true, // true or false
1036-
'property' : 'outline-style', // css property name (don't change it !)
1037-
'prefix' : 'outline-', // prefix of class name
1038-
'specificity': !important, // or null
1039-
'unit' : null, // length units (px, rem, em, %, vh, vw etc)
1040-
'args' : null, // for extra variables
1041-
'variables' : (solid,dashed,dotted,double)
1042-
),
1043-
///
10441028
/// Outline Offset
10451029
///
10461030
/// The outline-offset property adds space between
@@ -1059,6 +1043,22 @@ $helpers: (
10591043
'variables' : (0,1,2,4,8)
10601044
),
10611045
///
1046+
/// Outline Style
1047+
///
1048+
/// The outline-style property specifies the style of an outline
1049+
///
1050+
/// @example outline-dashed
1051+
///
1052+
'outline-style': (
1053+
'enabled' : true, // true or false
1054+
'property' : 'outline-style', // css property name (don't change it !)
1055+
'prefix' : 'outline-', // prefix of class name
1056+
'specificity': !important, // or null
1057+
'unit' : null, // length units (px, rem, em, %, vh, vw etc)
1058+
'args' : null, // for extra variables
1059+
'variables' : (solid,dashed,dotted,double)
1060+
),
1061+
///
10621062
/// Outline Width
10631063
///
10641064
/// The outline-width property specifies

0 commit comments

Comments
 (0)