Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
primer-box
Advanced tools
primer-box - npm Package Compare versions
Comparing version 2.6.0-alpha.2bb3a027 to 2.6.0-alpha.2ccb67f5
| { | ||
| "version": "2.6.0-alpha.2bb3a027", | ||
| "version": "2.6.0-alpha.2ccb67f5", | ||
| "name": "primer-box", | ||
@@ -30,6 +30,6 @@ "description": "A module for creating rounded-corner boxes with options for headers, lists, and footers.", | ||
| "prepublishOnly": "../../script/notify pending", | ||
| "publish": "../../script/notify success" | ||
| "postpublish": "../../script/notify success" | ||
| }, | ||
| "dependencies": { | ||
| "primer-support": "4.8.0-alpha.2bb3a027" | ||
| "primer-support": "4.8.0-alpha.2ccb67f5" | ||
| }, | ||
@@ -36,0 +36,0 @@ "keywords": [ |
@@ -263,3 +263,3 @@ # Primer box | ||
| `Box-danger` is often paired with a red heading. See the [subhead](../subhead) docs for more information. | ||
| `Box-danger` is often paired with a red heading. See the [subhead](./subhead) docs for more information. | ||
@@ -361,5 +361,5 @@ ```html | ||
| Flash alerts come in three different colors and can be used with icons and buttons, see the [alert documentation](../alerts) for more information. | ||
| Flash alerts come in three different colors and can be used with icons and buttons, see the [alert documentation](./alerts) for more information. | ||
| ```html | ||
| ```erb | ||
| <div class="Box"> | ||
@@ -391,9 +391,9 @@ <div class="Box-header"> | ||
| ```html | ||
| <div class="Box"> | ||
| <div class="Box-body"> | ||
| <span class="pr-2">Box body</span> | ||
| <button href="#" class="Box-btn-octicon btn-octicon"><%= octicon("pencil") %></button> | ||
| </div> | ||
| ```erb | ||
| <div class="Box"> | ||
| <div class="Box-body"> | ||
| <span class="pr-2">Box body</span> | ||
| <button href="#" class="Box-btn-octicon btn-octicon"><%= octicon "pencil" %></button> | ||
| </div> | ||
| </div> | ||
| ``` | ||
@@ -403,21 +403,21 @@ | ||
| ```html | ||
| <div class="Box"> | ||
| <div class="Box-header clearfix"> | ||
| <button href="#" class="Box-btn-octicon btn-octicon float-right"><%= octicon("x") %></button> | ||
| <h3 class="Box-title overflow-hidden pr-3">A very long title that wraps onto multiple lines without overlapping or wrapping underneath the icon to it's right</h3> | ||
| </div> | ||
| <div class="Box-body"> | ||
| Box body | ||
| </div> | ||
| ```erb | ||
| <div class="Box"> | ||
| <div class="Box-header clearfix"> | ||
| <button href="#" class="Box-btn-octicon btn-octicon float-right"><%= octicon "x" %></button> | ||
| <h3 class="Box-title overflow-hidden pr-3">A very long title that wraps onto multiple lines without overlapping or wrapping underneath the icon to it's right</h3> | ||
| </div> | ||
| <div class="Box-body"> | ||
| Box body | ||
| </div> | ||
| </div> | ||
| ``` | ||
| ```html | ||
| <div class="Box"> | ||
| <div class="Box-row clearfix"> | ||
| <button href="#" class="Box-btn-octicon btn-octicon float-left"><%= octicon "check" %></button> | ||
| <p class="overflow-hidden pl-3">A very long paragraph that wraps onto multiple lines without overlapping or wrapping underneath the icon to it's left</p> | ||
| </div> | ||
| ```erb | ||
| <div class="Box"> | ||
| <div class="Box-row clearfix"> | ||
| <button href="#" class="Box-btn-octicon btn-octicon float-left"><%= octicon "check" %></button> | ||
| <p class="overflow-hidden pl-3">A very long paragraph that wraps onto multiple lines without overlapping or wrapping underneath the icon to it's left</p> | ||
| </div> | ||
| </div> | ||
| ``` | ||
@@ -463,3 +463,3 @@ | ||
| Use [flexbox utilities](../../utilities/flexbox) to center align items, and avoid using floats by using `flex-auto` to have the text fill the remaining space so that the button rests on the far right. | ||
| Use [flexbox utilities](/css/utilities/flexbox) to center align items, and avoid using floats by using `flex-auto` to have the text fill the remaining space so that the button rests on the far right. | ||
@@ -570,3 +570,3 @@ ```html | ||
| When a box is all by itself centered on a page you can use [column widths](../../objects/grid) to control the width of the box. If needed, break the mold a little and use [typography utilities](../../utilities/typography) instead of the built in box title styles. | ||
| When a box is all by itself centered on a page you can use [column widths](/css/objects/grid) to control the width of the box. If needed, break the mold a little and use [typography utilities](/css/utilities/typography) instead of the built in box title styles. | ||
@@ -592,3 +592,3 @@ ```html | ||
| Box patterns can also be made with, and modified with [border utilities](../../utilities/borders). | ||
| Box patterns can also be made with, and modified with [border utilities](/css/utilities/borders). | ||
@@ -595,0 +595,0 @@ <!-- %enddocs --> |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Worsened metrics
- Total package byte prevSize
- decreased by-0.13%
39897
Dependency changes
+ Addedprimer-support@4.8.0-alpha.2ccb67f5(transitive)
- Removedprimer-support@4.8.0-alpha.2bb3a027(transitive)