🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
DemoInstallSign in
Socket
DemoInstallSign in

astro-tabs

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

astro-tabs - npm Package Compare versions

Comparing version

0.1.3
to
0.1.5

18

CHANGELOG.md

@@ -6,2 +6,20 @@ # Change Log

## [0.1.5](https://github.com/JulianCataldo/web-garden/compare/astro-tabs@0.1.3...astro-tabs@0.1.5) (2022-10-23)
### Bug Fixes
* simplify inline styles + correct spread props ([a0e2f2b](https://github.com/JulianCataldo/web-garden/commit/a0e2f2b1414449cadc6bad101eb7d75daa777fae))
## [0.1.4](https://github.com/JulianCataldo/web-garden/compare/astro-tabs@0.1.3...astro-tabs@0.1.4) (2022-10-23)
### Bug Fixes
* simplify inline styles + correct spread props ([a0e2f2b](https://github.com/JulianCataldo/web-garden/commit/a0e2f2b1414449cadc6bad101eb7d75daa777fae))
## [0.1.3](https://github.com/JulianCataldo/web-garden/compare/astro-tabs@0.1.2...astro-tabs@0.1.3) (2022-10-17)

@@ -8,0 +26,0 @@

4

package.json
{
"name": "astro-tabs",
"version": "0.1.3",
"version": "0.1.5",
"description": "A tabs bar + panels component which works entirely without JS.\nSupports height equalization and automatic vertical scroll bar for tabs bar.",

@@ -36,3 +36,3 @@ "main": "index.ts",

"license": "ISC",
"gitHead": "ab7fb8475c11125538f471e09a6d08e194e53cad"
"gitHead": "c90794e198d1f6afcb1b20d7d8a886fd3157744d"
}

75

README.md

@@ -126,78 +126,39 @@ # 🚀  Astro — Tabs bar + panels

```html
<div class="_tabs_1754q_15 tabs pass-your-class-list pass-your-own-class">
<div class="_tabs_1il72_16 tabs">
<style>
._tabs_1754q_15:has(._radio_1754q_29-1:checked) ._panel_1754q_7-1 {
._tabs_1il72_16:has(._radio_1il72_32-1:checked) ._panel_1il72_8-1,
._tabs_1il72_16:has(._radio_1il72_32-2:checked) ._panel_1il72_8-2,
._tabs_1il72_16:has(._radio_1il72_32-3:checked) ._panel_1il72_8-3 {
visibility: visible;
display: inline-block;
}
._tabs_1754q_15:has(._radio_1754q_29-2:checked) ._panel_1754q_7-2 {
visibility: visible;
display: inline-block;
}
._tabs_1754q_15:has(._radio_1754q_29-3:checked) ._panel_1754q_7-3 {
visibility: visible;
display: inline-block;
}
</style>
<nav class="_tab-bar_1754q_3">
<nav class="_tab-bar_1il72_3">
<div class="tab-wrapper tab-1">
<input
class="_radio_1754q_29 _radio_1754q_29-1 radio"
class="_radio_1il72_32 _radio_1il72_32-1 tab-selector"
type="radio"
name="i8ZgJykDTKrqj1xg_epJe"
name="3af997a5-693f-40db-a0c6-ba63359e27a8"
checked="true"
id="i8ZgJykDTKrqj1xg_epJe-1"
id="3af997a5-693f-40db-a0c6-ba63359e27a8-1"
/>
<label class="tab _tab_1754q_3" for="i8ZgJykDTKrqj1xg_epJe-1">
<label
class="tab _tab_1il72_3"
for="3af997a5-693f-40db-a0c6-ba63359e27a8-1"
>
<div>Tab 1</div>
</label>
</div>
<div class="tab-wrapper tab-2">
<input
class="_radio_1754q_29 _radio_1754q_29-2 radio"
type="radio"
name="i8ZgJykDTKrqj1xg_epJe"
id="i8ZgJykDTKrqj1xg_epJe-2"
/>
<label class="tab _tab_1754q_3" for="i8ZgJykDTKrqj1xg_epJe-2">
<div>Tab 2</div>
</label>
</div>
<div class="tab-wrapper tab-3">
<input
class="_radio_1754q_29 _radio_1754q_29-3 radio"
type="radio"
name="i8ZgJykDTKrqj1xg_epJe"
id="i8ZgJykDTKrqj1xg_epJe-3"
/>
<label class="tab _tab_1754q_3" for="i8ZgJykDTKrqj1xg_epJe-3">
<div>Tab 3</div>
</label>
</div>
<!-- ... x3 -->
</nav>
<div class="_panels_1754q_7">
<div class="_panel_1754q_7 _panel_1754q_7-1 panel">
<div class="_panels_1il72_8">
<div class="_panel_1il72_8 false _panel_1il72_8-1 panel">
<h2>Panel 1</h2>
<p>Hello world</p>
</div>
<div class="_panel_1754q_7 _tallest_1754q_15 _panel_1754q_7-2 panel">
<h2>Panel 2</h2>
<img
height="400"
src="https://res.cloudinary.com/dzfylx93l/image/upload/v1664340439/astro-takeoff-1_ecdfxf.gif"
/>
</div>
<div class="_panel_1754q_7 _panel_1754q_7-3 panel">
<h2>Panel 3</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque deserunt
quibusdam praesentium. Nobis consectetur, minima laboriosam doloremque.
</p>
<p>
enim perferendis fugit a porro. Corporis quis, tenetur maiores explicabo
ex nulla quo?
</p>
</div>
<!-- ... x3 -->
</div>

@@ -204,0 +165,0 @@ </div>

Tabs.astro

Sorry, the diff of this file is not supported yet