mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-26 03:06:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions
picocss/scss/components/_dropdown.scss.map
Lucas Larroche 759296f211 chore: remove docs and move to yarn
2022-10-15 17:23:02 +07:00

1 line
No EOL
6.6 KiB
Text
Raw Blame History

{"version":3,"sources":["_dropdown.scss"],"names":[],"mappings":"AAAA;;EAEE;;AAEF,MAAM;AACN;;EAEE,kBAAkB;AACpB;;AAEA;;EAEE,aAAa;EACb,WAAW;EACX,kBAAkB;EAClB,SAAS;EACT,QAAQ;EACR,OAAO;EACP,sBAAsB;EACtB,SAAS;EACT,UAAU;EACV,8DAA8D;EAC9D,mCAAmC;EACnC,0BAA0B;EAC1B,yBAAyB;EACzB,kDAAkD;EAClD,kCAAkC;EAClC,4BAA4B;EAC5B,mBAAmB;;EAEnB;IACE,WAAW;IACX,gBAAgB;IAChB;4CACwC;IACxC,gBAAgB;;IAEhB;MACE,4DAA4D;IAC9D;;IAEA;MACE,+DAA+D;IACjE;;IAEA;MACE,cAAc;MACd;yDACmD;MACnD;8CACwC;MACxC,gBAAgB;MAChB,4BAA4B;MAC5B,qBAAqB;MACrB,uBAAuB;;MAEvB;QACE,wDAAwD;MAC1D;IACF;EACF;AACF;;AAEA,QAAQ;AACR;;EAEE;IACE,cAAc;IACd,WAAW;IACX,4CAA4C;IAC5C,2BAA2B;IAC3B,YAAY;IACZ,uBAAuB;IACvB,iCAAiC;IACjC,0BAA0B;IAC1B,4BAA4B;IAC5B,WAAW;EACb;AACF;;AAEA,sBAAsB;AACtB;EACE,UAAU;EACV,mBAAmB;;EAEnB,6BAA6B;EAC7B;IACE,gBAAgB;;IAEhB;MACE;;;OAGC;MACD;8CACwC;MACxC,kEAAkE;MAClE,mCAAmC;MACnC,sDAAsD;MACtD,4CAA4C;MAC5C,oBAAoB;MACpB,eAAe;;MAEf;QACE;;sCAE8B;MAChC;;MAEA;;QAEE,qDAAqD;QACrD,6DAA6D;MAC/D;;MAEA;QACE,sEAAsE;MACxE;IACF;EACF;;EAEA,gCAAgC;EAChC;IACE,6BAA6B;IAC7B,4BAA4B;;IAE5B;MACE,cAAc;MACd,UAAU;MACV,eAAe;MACf,MAAM;MACN,QAAQ;MACR,SAAS;MACT,OAAO;MACP,gBAAgB;MAChB,WAAW;MACX,eAAe;IACjB;EACF;AACF;;AAEA,4BAA4B;AAC5B;;EAEE,aAAa;EACb,cAAc;AAChB;;AAEA;;EAEE,sBAAsB;EACtB,mCAAmC;;EAEnC;IACE,gBAAgB;EAClB;AACF;;AAEA,4CAA4C;AAC5C;EACE;;IAEE,YAAY;IACZ,4EAA4E;EAC9E;;EAEA;IACE,mCAAmC;EACrC;;EAEA;IACE,gCAAgC;IAChC,sBAAsB;EACxB;;EAEA;IACE,0DAA0D;IAC1D,+BAA+B;;IAE/B;MACE,yEAAyE;MACzE,kEAAkE;IACpE;EACF;AACF;;AAEA,kDAAkD;AAClD;EACE,4BAA4B;EAC5B,8CAA8C;EAC9C;;;IAGE,aAAa;EACf;;EAEA;IACE,aAAa;IACb,yEAAyE;IACzE;;KAEC;EACH;;EAEA;IACE,qCAAqC;EACvC;AACF","file":"_dropdown.scss","sourcesContent":["/**\n * Dropdown ([role=\"list\"])\n */\n\n// Menu\ndetails[role=\"list\"],\nli[role=\"list\"] {\n position: relative;\n}\n\ndetails[role=\"list\"] summary + ul,\nli[role=\"list\"] > ul {\n display: flex;\n z-index: 99;\n position: absolute;\n top: auto;\n right: 0;\n left: 0;\n flex-direction: column;\n margin: 0;\n padding: 0;\n border: var(--border-width) solid var(--dropdown-border-color);\n border-radius: var(--border-radius);\n border-top-right-radius: 0;\n border-top-left-radius: 0;\n background-color: var(--dropdown-background-color);\n box-shadow: var(--card-box-shadow);\n color: var(--dropdown-color);\n white-space: nowrap;\n\n li {\n width: 100%;\n margin-bottom: 0;\n padding: calc(var(--form-element-spacing-vertical) * 0.5)\n var(--form-element-spacing-horizontal);\n list-style: none;\n\n &:first-of-type {\n margin-top: calc(var(--form-element-spacing-vertical) * 0.5);\n }\n\n &:last-of-type {\n margin-bottom: calc(var(--form-element-spacing-vertical) * 0.5);\n }\n\n a {\n display: block;\n margin: calc(var(--form-element-spacing-vertical) * -0.5)\n calc(var(--form-element-spacing-horizontal) * -1);\n padding: calc(var(--form-element-spacing-vertical) * 0.5)\n var(--form-element-spacing-horizontal);\n overflow: hidden;\n color: var(--dropdown-color);\n text-decoration: none;\n text-overflow: ellipsis;\n\n &:hover {\n background-color: var(--dropdown-hover-background-color);\n }\n }\n }\n}\n\n// Marker\ndetails[role=\"list\"] summary,\nli[role=\"list\"] > a {\n &::after {\n display: block;\n width: 1rem;\n height: calc(1rem * var(--line-height, 1.5));\n margin-inline-start: 0.5rem;\n float: right;\n transform: rotate(0deg);\n background-position: right center;\n background-size: 1rem auto;\n background-repeat: no-repeat;\n content: \"\";\n }\n}\n\n// Global dropdown only\ndetails[role=\"list\"] {\n padding: 0;\n border-bottom: none;\n\n // Style <summary> as <select>\n summary {\n margin-bottom: 0;\n\n &:not([role]) {\n height: calc(\n 1rem * var(--line-height) + var(--form-element-spacing-vertical) * 2 +\n var(--border-width) * 2\n );\n padding: var(--form-element-spacing-vertical)\n var(--form-element-spacing-horizontal);\n border: var(--border-width) solid var(--form-element-border-color);\n border-radius: var(--border-radius);\n background-color: var(--form-element-background-color);\n color: var(--form-element-placeholder-color);\n line-height: inherit;\n cursor: pointer;\n\n @if $enable-transitions {\n transition: background-color var(--transition),\n border-color var(--transition), color var(--transition),\n box-shadow var(--transition);\n }\n\n &:active,\n &:focus {\n border-color: var(--form-element-active-border-color);\n background-color: var(--form-element-active-background-color);\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus-color);\n }\n }\n }\n\n // Close for details[role=\"list\"]\n &[open] summary {\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n &::before {\n display: block;\n z-index: 1;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background: none;\n content: \"\";\n cursor: default;\n }\n }\n}\n\n// All Dropdowns inside <nav>\nnav details[role=\"list\"] summary,\nnav li[role=\"list\"] a {\n display: flex;\n direction: ltr;\n}\n\nnav details[role=\"list\"] summary + ul,\nnav li[role=\"list\"] > ul {\n min-width: fit-content;\n border-radius: var(--border-radius);\n\n li a {\n border-radius: 0;\n }\n}\n\n// Dropdowns inside <nav> as nested <details>\nnav details[role=\"list\"] {\n summary,\n summary:not([role]) {\n height: auto;\n padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);\n }\n\n &[open] summary {\n border-radius: var(--border-radius);\n }\n\n summary + ul {\n margin-top: var(--outline-width);\n margin-inline-start: 0;\n }\n\n summary[role=\"link\"] {\n margin-bottom: calc(var(--nav-link-spacing-vertical) * -1);\n line-height: var(--line-height);\n\n + ul {\n margin-top: calc(var(--nav-link-spacing-vertical) + var(--outline-width));\n margin-inline-start: calc(var(--nav-link-spacing-horizontal) * -1);\n }\n }\n}\n\n// Dropdowns inside a <nav> without using <details>\nli[role=\"list\"] {\n // Open on hover (for mobile)\n // or on active/focus (for keyboard navigation)\n &:hover > ul,\n a:active ~ ul,\n a:focus ~ ul {\n display: flex;\n }\n\n > ul {\n display: none;\n margin-top: calc(var(--nav-link-spacing-vertical) + var(--outline-width));\n margin-inline-start: calc(\n var(--nav-element-spacing-horizontal) - var(--nav-link-spacing-horizontal)\n );\n }\n\n > a::after {\n background-image: var(--icon-chevron);\n }\n}\n"]}
Reference in a new issue View git blame Copy permalink