react-select.css
View Options

	/**
	* React Select
	* ============
	* Created by Jed Watson and Joss Mackison for KeystoneJS, http://www.keystonejs.com/
	* https://twitter.com/jedwatson https://twitter.com/jossmackison https://twitter.com/keystonejs
	* MIT License: https://github.com/keystonejs/react-select
	*/
	.Select {
	position: relative;
	}
	.Select-control {
	position: relative;
	overflow: hidden;
	background-color: white;
	border: 1px solid #cccccc;
	border-color: #d9d9d9 #cccccc #b3b3b3;
	border-radius: 4px;
	box-sizing: border-box;
	color: #333333;
	cursor: default;
	outline: none;
	padding: 8px 52px 8px 10px;
	transition: all 200ms ease;
	}
	.Select-control:hover {
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
	}
	.is-searchable.is-open > .Select-control {
	cursor: text;
	}
	.is-open > .Select-control {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	background: white;
	border-color: #b3b3b3 #cccccc #d9d9d9;
	}
	.is-open > .Select-control > .Select-arrow {
	border-color: transparent transparent #999999;
	border-width: 0 5px 5px;
	}
	.is-searchable.is-focused:not(.is-open) > .Select-control {
	cursor: text;
	}
	.is-focused:not(.is-open) > .Select-control {
	border-color: #0088cc #0099e6 #0099e6;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 5px -1px rgba(0, 136, 204, 0.5);
	}
	.Select-placeholder {
	color: #aaaaaa;
	padding: 8px 52px 8px 10px;
	position: absolute;
	top: 0;
	left: 0;
	right: -15px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	}
	.has-value > .Select-control > .Select-placeholder {
	color: #333333;
	}
	.Select-input > input {
	cursor: default;
	background: none transparent;
	border: 0 none;
	font-family: inherit;
	font-size: inherit;
	margin: 0;
	padding: 0;
	outline: none;
	display: inline-block;
	-webkit-appearance: none;
	}
	.is-focused .Select-input > input {
	cursor: text;
	}
	.Select-control:not(.is-searchable) > .Select-input {
	outline: none;
	}
	.Select-loading {
	-webkit-animation: Select-animation-spin 400ms infinite linear;
	-o-animation: Select-animation-spin 400ms infinite linear;
	animation: Select-animation-spin 400ms infinite linear;
	width: 16px;
	height: 16px;
	box-sizing: border-box;
	border-radius: 50%;
	border: 2px solid #cccccc;
	border-right-color: #333333;
	display: inline-block;
	position: relative;
	margin-top: -8px;
	position: absolute;
	right: 30px;
	top: 50%;
	}
	.has-value > .Select-control > .Select-loading {
	right: 46px;
	}
	.Select-clear {
	color: #999999;
	cursor: pointer;
	display: inline-block;
	font-size: 16px;
	padding: 6px 10px;
	position: absolute;
	right: 17px;
	top: 0;
	}
	.Select-clear:hover {
	color: #c0392b;
	}
	.Select-clear > span {
	font-size: 1.1em;
	}
	.Select-arrow {
	border-color: #999999 transparent transparent;
	border-style: solid;
	border-width: 5px 5px 0;
	content: " ";
	display: block;
	height: 0;
	margin-top: -ceil(2.5px);
	position: absolute;
	right: 10px;
	top: 14px;
	width: 0;
	}
	.Select-menu-outer {
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	background-color: white;
	border: 1px solid #cccccc;
	border-top-color: #e6e6e6;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
	box-sizing: border-box;
	margin-top: -1px;
	max-height: 200px;
	position: absolute;
	top: 100%;
	width: 100%;
	z-index: 1000;
	-webkit-overflow-scrolling: touch;
	}
	.Select-menu {
	max-height: 198px;
	overflow-y: auto;
	}
	.Select-option {
	box-sizing: border-box;
	color: #666666;
	cursor: pointer;
	display: block;
	padding: 8px 10px;
	}
	.Select-option:last-child {
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	}
	.Select-option.is-focused {
	background-color: #f2f9fc;
	color: #333333;
	}
	.Select-option.is-disabled {
	color: #cccccc;
	cursor: not-allowed;
	}
	.Select-noresults {
	box-sizing: border-box;
	color: #999999;
	cursor: default;
	display: block;
	padding: 8px 10px;
	}
	.Select.is-multi .Select-control {
	padding: 2px 52px 2px 3px;
	}
	.Select.is-multi .Select-input {
	vertical-align: middle;
	border: 1px solid transparent;
	margin: 2px;
	padding: 3px 0;
	}
	.Select-item {
	background-color: #f2f9fc;
	border-radius: 2px;
	border: 1px solid #c9e6f2;
	color: #0088cc;
	display: inline-block;
	font-size: 1em;
	margin: 2px;
	}
	.Select-item-icon,
	.Select-item-label {
	display: inline-block;
	vertical-align: middle;
	}
	.Select-item-label {
	cursor: default;
	border-bottom-right-radius: 2px;
	border-top-right-radius: 2px;
	padding: 3px 5px;
	}
	.Select-item-label .Select-item-label__a {
	color: #0088cc;
	cursor: pointer;
	}
	.Select-item-icon {
	cursor: pointer;
	border-bottom-left-radius: 2px;
	border-top-left-radius: 2px;
	border-right: 1px solid #c9e6f2;
	padding: 2px 5px 4px;
	}
	.Select-item-icon:hover,
	.Select-item-icon:focus {
	background-color: #ddeff7;
	color: #0077b3;
	}
	.Select-item-icon:active {
	background-color: #c9e6f2;
	}
	@keyframes Select-animation-spin {
	to {
	transform: rotate(1turn);
	}
	}
	@-webkit-keyframes Select-animation-spin {
	to {
	-webkit-transform: rotate(1turn);
	}
	}

File Metadata

Mime Type: text/plain
Expires: Wed, Apr 2, 18:06 (12 h, 33 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 2530079
Default Alt Text: react-select.css (4 KB)

react-select.css
No OneTemporary
Actions

react-select.css
View Options

File Metadata

Event Timeline

react-select.cssNo OneTemporaryActions

react-select.cssView Options

File Metadata

Event Timeline

react-select.css
No OneTemporary
Actions

react-select.css
View Options