{"id":21890757,"url":"https://github.com/chantastic/select.css","last_synced_at":"2025-03-22T03:11:34.199Z","repository":{"id":24394268,"uuid":"27794404","full_name":"chantastic/select.css","owner":"chantastic","description":null,"archived":false,"fork":false,"pushed_at":"2016-11-28T19:23:12.000Z","size":18,"stargazers_count":3,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-26T22:06:43.655Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://chantastic.org/select.css/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chantastic.png","metadata":{"files":{"readme":"README.markdown","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-12-10T00:25:40.000Z","updated_at":"2019-06-25T14:19:34.000Z","dependencies_parsed_at":"2022-07-25T10:32:12.720Z","dependency_job_id":null,"html_url":"https://github.com/chantastic/select.css","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chantastic%2Fselect.css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chantastic%2Fselect.css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chantastic%2Fselect.css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chantastic%2Fselect.css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chantastic","download_url":"https://codeload.github.com/chantastic/select.css/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244898447,"owners_count":20528341,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-28T12:16:40.664Z","updated_at":"2025-03-22T03:11:34.181Z","avatar_url":"https://github.com/chantastic.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# select.css\n\nA stupid, styleable, scalable class for selects.\n\n## Why?\n\nI wanted a cross-browser select that I could easily style and npm install.\n\nThis isn't clever.\nIt controls the shape and doesn't try to hard about override the browser's\ndefault disclosure button.\n\n![ff pre-35 and ff 35](https://cloud.githubusercontent.com/assets/658360/5458763/c354e8da-8509-11e4-8c52-4b00a469c21b.png)\n\nFF\u003c34 and FF35+\n\n![ie9 and ie10](https://cloud.githubusercontent.com/assets/658360/5458760/bf0807b2-8509-11e4-82cf-35c00ae93a60.png)\n\nIE9 and IE10 (with `ie9-select.css`)\n\n\n## Prior art\n\nI borrowed techniques from [wtfforms](http://wtfforms.com/),\n[mailchimp](https://mailchimp.com/),\nand [foundation](http://foundation.zurb.com/).\n\nIt's been 2 years now. So they could have totally moved on.\n\n## Install\n\n#### NPM\n\n`npm install select.css@0.1.0`\n\n#### Script tag\n\n`\u003clink rel=\"stylesheet\" href=\"https://unpkg.com/select.css@0.1.0\" /\u003e`\n\n## Use\n\n```html\n\u003cselect class=\"select\"\u003e\n  ...  \n\u003c/select\u003e\n```\n\n### Theming\n\nBYOTheme.\n\nThe base `.select` class sets a few colors, just in case you really don't want to think about anything.\n\nIn most cases, you'll probably color the selects to match your app.\nThemes look like this:\n\n```css\n.select {\n  background-color:#fcfcfc;\n  border-color:#d7d7d7;\n  color:#3f3f3f;\n}\n.select:hover {\n  background-color:#eee;\n  border-color:#c4c4c4;\n}\n```\n\n### IE9\n\nInclude the `ie9-select.css` file if you need IE9 support.\nIt just changes a couple styles to make the default disclosure button fall in a better spot.\n\n#### DON'T SET `background`\n\nIt's important not to set `backrgound`.\nIt'll remove the little disclosure chevron.\nIf you want to change the `background-color`, set `background-color`.\n\n## Code\n\nThis is all the code there is.\n\n```css\n/*! select.css */\n.select{\nposition:relative;\nbackground-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);\nbackground-position:right center;\nbackground-color:transparent;\nbackground-repeat:no-repeat;\nbackground-size:2em auto;\ndisplay:inline-block;\nvertical-align:middle;\ncursor:pointer;\n-webkit-appearance:none;-moz-appearance:none;appearance:none;\nborder-radius:.25em;\nborder-width:1px;\nborder-style:solid;\nheight:2em;\nfont-size:1em;\npadding:0 2em 0 .5em;\n/* default theme */\nbackground-color:#fcfcfc;\nborder-color:#d7d7d7;\ncolor:#3f3f3f;\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchantastic%2Fselect.css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchantastic%2Fselect.css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchantastic%2Fselect.css/lists"}