components
2 months ago
design-settings
1 year ago
elements
1 year ago
_base-overrides.scss
1 year ago
_pico.scss
1 year ago
_variables.scss
2 years ago
base.scss
1 year ago
_pico.scss
96 lines
| 1 | // Pico Lib |
| 2 | // https://picocss.com |
| 3 | |
| 4 | // Set the root element |
| 5 | // thi |
| 6 | //$semantic-root-element: "#root-givewp-donation-form"; |
| 7 | |
| 8 | // Enable <header>, <main>, <footer> inside $semantic-root-element as containers |
| 9 | $enable-semantic-container: true; |
| 10 | |
| 11 | // Enable .classes |
| 12 | $enable-classes: true; |
| 13 | $enable-important: false; |
| 14 | |
| 15 | // Config |
| 16 | @import "@picocss/pico/scss/variables"; |
| 17 | |
| 18 | /** |
| 19 | * Theme: default - hand-pick imports from default theme. |
| 20 | * Only support light theme for now. |
| 21 | */ |
| 22 | |
| 23 | // Theming |
| 24 | //@import "@picocss/pico/scss/themes/default"; |
| 25 | |
| 26 | // Variables |
| 27 | @import "@picocss/pico/scss/themes/default/colors"; |
| 28 | |
| 29 | // Commons styles |
| 30 | @import "@picocss/pico/scss/themes/default/styles"; |
| 31 | |
| 32 | // Light theme (Default) |
| 33 | // Can be forced with data-theme="light" |
| 34 | @import "@picocss/pico/scss/themes/default/light"; |
| 35 | |
| 36 | // Layout |
| 37 | @import "@picocss/pico/scss/layout/document"; // html |
| 38 | @import "@picocss/pico/scss/layout/sectioning"; // body, header, main, footer |
| 39 | @import "@picocss/pico/scss/layout/container"; // .container, .container-fluid |
| 40 | @import "@picocss/pico/scss/layout/section"; // section |
| 41 | @import "@picocss/pico/scss/layout/grid"; // .grid |
| 42 | @import "@picocss/pico/scss/layout/scroller"; // figure |
| 43 | |
| 44 | // Content |
| 45 | @import "@picocss/pico/scss/content/typography"; // a, headings, p, ul, blockquote, ... |
| 46 | @import "@picocss/pico/scss/content/embedded"; // audio, canvas, iframe, img, svg, video |
| 47 | @import "@picocss/pico/scss/content/button"; // button, a[role=button], type=button, type=submit ... |
| 48 | @import "@picocss/pico/scss/content/form"; // input, select, textarea, label, fieldset, legend |
| 49 | @import "@picocss/pico/scss/content/form-alt-input-types"; // type=color, type=date, type=file, type=search, ... |
| 50 | @import "@picocss/pico/scss/content/table"; // table, tr, td, ... |
| 51 | @import "@picocss/pico/scss/content/code"; // pre, code, ... |
| 52 | @import "@picocss/pico/scss/content/miscs"; // hr, template, [hidden], dialog, canvas |
| 53 | |
| 54 | // Components |
| 55 | @import "@picocss/pico/scss/components/accordion"; // details, summary |
| 56 | //@import "@picocss/pico/scss/components/card"; // article |
| 57 | @import "@picocss/pico/scss/components/modal"; // dialog |
| 58 | @import "@picocss/pico/scss/components/nav"; // nav |
| 59 | @import "@picocss/pico/scss/components/progress"; // progress |
| 60 | @import "@picocss/pico/scss/components/dropdown"; // dropdown |
| 61 | |
| 62 | // Utilities |
| 63 | @import "@picocss/pico/scss/utilities/loading"; // aria-busy=true |
| 64 | @import "@picocss/pico/scss/utilities/tooltip"; // data-tooltip |
| 65 | @import "@picocss/pico/scss/utilities/accessibility"; // -ms-touch-action, aria-* |
| 66 | @import "@picocss/pico/scss/utilities/reduce-motion"; // prefers-reduced-motion |
| 67 | |
| 68 | label { |
| 69 | color: var(--color); |
| 70 | } |
| 71 | |
| 72 | // Accent-color |
| 73 | [type="checkbox"]="checkbox""], |
| 74 | [type="radio"]="radio""], |
| 75 | [type="range"]="range""] { |
| 76 | accent-color: var(--primary); |
| 77 | } |
| 78 | |
| 79 | a:focus, [role=link]=link]:focus { |
| 80 | --background-color: transparent; |
| 81 | } |
| 82 | |
| 83 | form { |
| 84 | margin: 0; |
| 85 | } |
| 86 | |
| 87 | ul li { |
| 88 | list-style: disc; |
| 89 | } |
| 90 | |
| 91 | // selection |
| 92 | ::selection { |
| 93 | background-color: #B3D4FC; /* light blue */ |
| 94 | color: black; |
| 95 | } |
| 96 |