diff --git a/components/Dropdown.js b/components/Dropdown.js index a019845..d31668f 100644 --- a/components/Dropdown.js +++ b/components/Dropdown.js @@ -411,7 +411,7 @@ function (_React$Component) { _this = _possibleConstructorReturn(this, _getPrototypeOf(Dropdown).call(this, props)); _this.state = { isClicked: false, - isTouchDevice: typeof window !== 'undefined' && 'ontouchstart' in window + isTouchDevice: false }; _this.onClick = _this.onClick.bind(_assertThisInitialized(_assertThisInitialized(_this))); _this.onToggleClicked = _this.onToggleClicked.bind(_assertThisInitialized(_assertThisInitialized(_this))); @@ -420,6 +420,13 @@ function (_React$Component) { } _createClass(Dropdown, [{ + key: "componentDidMount", + value: function componentDidMount() { + this.setState({ + isTouchDevice: typeof window !== 'undefined' && 'ontouchstart' in window + }); + } + }, { key: "onClick", value: function onClick() { this.handleClick(false); diff --git a/components/Select.css b/components/Select.css index af76baf..1474e5f 100644 --- a/components/Select.css +++ b/components/Select.css @@ -38,21 +38,6 @@ border-top-right-radius: 0; margin-top: 0; z-index: 10000; -}.wds-icon { - fill: currentColor; - height: 24px; - min-width: 24px; - width: 24px; -} -.wds-icon-small { - height: 18px; - min-width: 18px; - width: 18px; -} -.wds-icon-tiny { - height: 12px; - min-width: 12px; - width: 12px; }@keyframes fandom-spinner-rotator { from { transform: rotate(0); @@ -92,4 +77,19 @@ position: static; top: 0; width: auto; +}.wds-icon { + fill: currentColor; + height: 24px; + min-width: 24px; + width: 24px; +} +.wds-icon-small { + height: 18px; + min-width: 18px; + width: 18px; +} +.wds-icon-tiny { + height: 12px; + min-width: 12px; + width: 12px; } \ No newline at end of file diff --git a/docs/build/bundle.390f2580.js b/docs/build/bundle.c75b3ae7.js similarity index 73% rename from docs/build/bundle.390f2580.js rename to docs/build/bundle.c75b3ae7.js index a65e3bf..57bafef 100644 --- a/docs/build/bundle.390f2580.js +++ b/docs/build/bundle.c75b3ae7.js @@ -60,4 +60,4 @@ var r=n(239),i=n(240),o=n(241);function kMaxLength(){return Buffer.TYPED_ARRAY_S * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. - */Object.defineProperty(n,"__esModule",{value:!0});var i=null,o=!1,a=3,s=-1,l=-1,c=!1,d=!1;function p(){if(!c){var e=i.expirationTime;d?g():d=!0,m(t,e)}}function u(){var e=i,t=i.next;if(i===t)i=null;else{var n=i.previous;i=n.next=t,t.previous=n}e.next=e.previous=null,n=e.callback,t=e.expirationTime,e=e.priorityLevel;var r=a,o=l;a=e,l=t;try{var s=n()}finally{a=r,l=o}if("function"==typeof s)if(s={callback:s,priorityLevel:e,expirationTime:t,next:null,previous:null},null===i)i=s.next=s.previous=s;else{n=null,e=i;do{if(e.expirationTime>=t){n=e;break}e=e.next}while(e!==i);null===n?n=i:n===i&&(i=s,p()),(t=n.previous).next=n.previous=s,s.next=n,s.previous=t}}function v(){if(-1===s&&null!==i&&1===i.priorityLevel){c=!0;try{do{u()}while(null!==i&&1===i.priorityLevel)}finally{c=!1,null!==i?p():d=!1}}}function t(e){c=!0;var t=o;o=e;try{if(e)for(;null!==i;){var r=n.unstable_now();if(!(i.expirationTime<=r))break;do{u()}while(null!==i&&i.expirationTime<=r)}else if(null!==i)do{u()}while(null!==i&&!y())}finally{c=!1,o=t,null!==i?p():d=!1,v()}}var f,h,m,g,y,b=Date,w="function"==typeof setTimeout?setTimeout:void 0,x="function"==typeof clearTimeout?clearTimeout:void 0,_="function"==typeof requestAnimationFrame?requestAnimationFrame:void 0,k="function"==typeof cancelAnimationFrame?cancelAnimationFrame:void 0;function E(e){f=_(function(t){x(h),e(t)}),h=w(function(){k(f),e(n.unstable_now())},100)}if("object"==typeof performance&&"function"==typeof performance.now){var C=performance;n.unstable_now=function(){return C.now()}}else n.unstable_now=function(){return b.now()};if("undefined"!=typeof window&&window._schedMock){var S=window._schedMock;m=S[0],g=S[1],y=S[2]}else if("undefined"==typeof window||"function"!=typeof window.addEventListener){var O=null,P=-1,T=function(e,t){if(null!==O){var n=O;O=null;try{P=t,n(e)}finally{P=-1}}};m=function(e,t){-1!==P?setTimeout(m,0,e,t):(O=e,setTimeout(T,t,!0,t),setTimeout(T,1073741823,!1,1073741823))},g=function(){O=null},y=function(){return!1},n.unstable_now=function(){return-1===P?0:P}}else{"undefined"!=typeof console&&("function"!=typeof _&&console.error("This browser doesn't support requestAnimationFrame. Make sure that you load a polyfill in older browsers. https://fb.me/react-polyfills"),"function"!=typeof k&&console.error("This browser doesn't support cancelAnimationFrame. Make sure that you load a polyfill in older browsers. https://fb.me/react-polyfills"));var R=null,A=!1,M=-1,I=!1,j=!1,L=0,D=33,N=33;y=function(){return L<=n.unstable_now()};var B="__reactIdleCallback$"+Math.random().toString(36).slice(2);window.addEventListener("message",function(e){if(e.source===window&&e.data===B){A=!1,e=R;var t=M;R=null,M=-1;var r=n.unstable_now(),i=!1;if(0>=L-r){if(!(-1!==t&&t<=r))return I||(I=!0,E(F)),R=e,void(M=t);i=!0}if(null!==e){j=!0;try{e(i)}finally{j=!1}}}},!1);var F=function(e){if(null!==R){E(F);var t=e-L+N;tt&&(t=8),N=tt?window.postMessage(B,"*"):I||(I=!0,E(F))},g=function(){R=null,A=!1,M=-1}}n.unstable_ImmediatePriority=1,n.unstable_UserBlockingPriority=2,n.unstable_NormalPriority=3,n.unstable_IdlePriority=5,n.unstable_LowPriority=4,n.unstable_runWithPriority=function(e,t){switch(e){case 1:case 2:case 3:case 4:case 5:break;default:e=3}var r=a,i=s;a=e,s=n.unstable_now();try{return t()}finally{a=r,s=i,v()}},n.unstable_scheduleCallback=function(e,t){var r=-1!==s?s:n.unstable_now();if("object"==typeof t&&null!==t&&"number"==typeof t.timeout)t=r+t.timeout;else switch(a){case 1:t=r+-1;break;case 2:t=r+250;break;case 5:t=r+1073741823;break;case 4:t=r+1e4;break;default:t=r+5e3}if(e={callback:e,priorityLevel:a,expirationTime:t,next:null,previous:null},null===i)i=e.next=e.previous=e,p();else{r=null;var o=i;do{if(o.expirationTime>t){r=o;break}o=o.next}while(o!==i);null===r?r=i:r===i&&(i=e,p()),(t=r.previous).next=r.previous=e,e.next=r,e.previous=t}return e},n.unstable_cancelCallback=function(e){var t=e.next;if(null!==t){if(t===e)i=null;else{e===i&&(i=t);var n=e.previous;n.next=t,t.previous=n}e.next=e.previous=null}},n.unstable_wrapCallback=function(e){var t=a;return function(){var r=a,i=s;a=t,s=n.unstable_now();try{return e.apply(this,arguments)}finally{a=r,s=i,v()}}},n.unstable_getCurrentPriorityLevel=function(){return a},n.unstable_shouldYield=function(){return!o&&(null!==i&&i.expirationTime-1}},function(e,t,n){var r=n(39);e.exports=function listCacheSet(e,t){var n=this.__data__,i=r(n,e);return i<0?(++this.size,n.push([e,t])):n[i][1]=t,this}},function(e,t,n){var r=n(38);e.exports=function stackClear(){this.__data__=new r,this.size=0}},function(e,t){e.exports=function stackDelete(e){var t=this.__data__,n=t.delete(e);return this.size=t.size,n}},function(e,t){e.exports=function stackGet(e){return this.__data__.get(e)}},function(e,t){e.exports=function stackHas(e){return this.__data__.has(e)}},function(e,t,n){var r=n(38),i=n(63),o=n(65),a=200;e.exports=function stackSet(e,t){var n=this.__data__;if(n instanceof r){var s=n.__data__;if(!i||s.length1?n[o-1]:void 0,s=o>2?n[2]:void 0;for(a=e.length>3&&"function"==typeof a?(o--,a):void 0,s&&i(n[0],n[1],s)&&(a=o<3?void 0:a,o=1),t=Object(t);++r0){if(++t>=n)return arguments[0]}else t=0;return e.apply(void 0,arguments)}}},function(e,t,n){var r=n(33),i=n(21),o=n(69),a=n(14);e.exports=function isIterateeCall(e,t,n){if(!a(n))return!1;var s=typeof t;return!!("number"==s?i(n)&&o(t,n.length):"string"==s&&t in n)&&r(n[t],e)}},function(e,t,n){"use strict";t.byteLength=function byteLength(e){var t=getLens(e),n=t[0],r=t[1];return 3*(n+r)/4-r},t.toByteArray=function toByteArray(e){for(var t,n=getLens(e),r=n[0],a=n[1],s=new o(_byteLength(e,r,a)),l=0,c=a>0?r-4:r,u=0;u>16&255,s[l++]=t>>8&255,s[l++]=255&t;2===a&&(t=i[e.charCodeAt(u)]<<2|i[e.charCodeAt(u+1)]>>4,s[l++]=255&t);1===a&&(t=i[e.charCodeAt(u)]<<10|i[e.charCodeAt(u+1)]<<4|i[e.charCodeAt(u+2)]>>2,s[l++]=t>>8&255,s[l++]=255&t);return s},t.fromByteArray=function fromByteArray(e){for(var t,n=e.length,i=n%3,o=[],a=0,s=n-i;as?s:a+16383));1===i?(t=e[n-1],o.push(r[t>>2]+r[t<<4&63]+"==")):2===i&&(t=(e[n-2]<<8)+e[n-1],o.push(r[t>>10]+r[t>>4&63]+r[t<<2&63]+"="));return o.join("")};for(var r=[],i=[],o="undefined"!=typeof Uint8Array?Uint8Array:Array,a="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",s=0,l=a.length;s0)throw new Error("Invalid string. Length must be a multiple of 4");var n=e.indexOf("=");return-1===n&&(n=t),[n,n===t?0:4-n%4]}function _byteLength(e,t,n){return 3*(t+n)/4-n}function encodeChunk(e,t,n){for(var i,o,a=[],s=t;s>18&63]+r[o>>12&63]+r[o>>6&63]+r[63&o]);return a.join("")}i["-".charCodeAt(0)]=62,i["_".charCodeAt(0)]=63},function(e,t){t.read=function(e,t,n,r,i){var o,a,s=8*i-r-1,l=(1<>1,u=-7,p=n?i-1:0,d=n?-1:1,f=e[t+p];for(p+=d,o=f&(1<<-u)-1,f>>=-u,u+=s;u>0;o=256*o+e[t+p],p+=d,u-=8);for(a=o&(1<<-u)-1,o>>=-u,u+=r;u>0;a=256*a+e[t+p],p+=d,u-=8);if(0===o)o=1-c;else{if(o===l)return a?NaN:1/0*(f?-1:1);a+=Math.pow(2,r),o-=c}return(f?-1:1)*a*Math.pow(2,o-r)},t.write=function(e,t,n,r,i,o){var a,s,l,c=8*o-i-1,u=(1<>1,d=23===i?Math.pow(2,-24)-Math.pow(2,-77):0,f=r?0:o-1,h=r?1:-1,m=t<0||0===t&&1/t<0?1:0;for(t=Math.abs(t),isNaN(t)||t===1/0?(s=isNaN(t)?1:0,a=u):(a=Math.floor(Math.log(t)/Math.LN2),t*(l=Math.pow(2,-a))<1&&(a--,l*=2),(t+=a+p>=1?d/l:d*Math.pow(2,1-p))*l>=2&&(a++,l/=2),a+p>=u?(s=0,a=u):a+p>=1?(s=(t*l-1)*Math.pow(2,i),a+=p):(s=t*Math.pow(2,p-1)*Math.pow(2,i),a=0));i>=8;e[n+f]=255&s,f+=h,s/=256,i-=8);for(a=a<0;e[n+f]=255&a,f+=h,a/=256,c-=8);e[n+f-h]|=128*m}},function(e,t){var n={}.toString;e.exports=Array.isArray||function(e){return"[object Array]"==n.call(e)}},function(e,t,n){var r=n(243);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,"/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */\n\n/* Tomorrow Comment */\n.hljs-comment,\n.hljs-quote {\n color: #8e908c;\n}\n\n/* Tomorrow Red */\n.hljs-variable,\n.hljs-template-variable,\n.hljs-tag,\n.hljs-name,\n.hljs-selector-id,\n.hljs-selector-class,\n.hljs-regexp,\n.hljs-deletion {\n color: #c82829;\n}\n\n/* Tomorrow Orange */\n.hljs-number,\n.hljs-built_in,\n.hljs-builtin-name,\n.hljs-literal,\n.hljs-type,\n.hljs-params,\n.hljs-meta,\n.hljs-link {\n color: #f5871f;\n}\n\n/* Tomorrow Yellow */\n.hljs-attribute {\n color: #eab700;\n}\n\n/* Tomorrow Green */\n.hljs-string,\n.hljs-symbol,\n.hljs-bullet,\n.hljs-addition {\n color: #718c00;\n}\n\n/* Tomorrow Blue */\n.hljs-title,\n.hljs-section {\n color: #4271ae;\n}\n\n/* Tomorrow Purple */\n.hljs-keyword,\n.hljs-selector-tag {\n color: #8959a8;\n}\n\n.hljs {\n display: block;\n overflow-x: auto;\n background: white;\n color: #4d4d4c;\n padding: 0.5em;\n}\n\n.hljs-emphasis {\n font-style: italic;\n}\n\n.hljs-strong {\n font-weight: bold;\n}\n",""])},function(e,t){e.exports=function(e){var t="undefined"!=typeof window&&window.location;if(!t)throw new Error("fixUrls requires window.location");if(!e||"string"!=typeof e)return e;var n=t.protocol+"//"+t.host,r=n+t.pathname.replace(/\/[^\/]*$/,"/");return e.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(e,t){var i,o=t.trim().replace(/^"(.*)"$/,function(e,t){return t}).replace(/^'(.*)'$/,function(e,t){return t});return/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(o)?e:(i=0===o.indexOf("//")?o:0===o.indexOf("/")?n+o:r+o.replace(/^\.\//,""),"url("+JSON.stringify(i)+")")})}},function(e,t,n){var r=n(246),i=n(268),o=n(106);e.exports=function baseMatches(e){var t=i(e);return 1==t.length&&t[0][2]?o(t[0][0],t[0][1]):function(n){return n===e||r(n,e,t)}}},function(e,t,n){var r=n(62),i=n(101),o=1,a=2;e.exports=function baseIsMatch(e,t,n,s){var l=n.length,c=l,u=!s;if(null==e)return!c;for(e=Object(e);l--;){var p=n[l];if(u&&p[2]?p[1]!==e[p[0]]:!(p[0]in e))return!1}for(;++l-1?s[l?t[c]:c]:void 0}}},function(e,t,n){var r=n(286),i=n(71),o=n(287),a=Math.max;e.exports=function findIndex(e,t,n){var s=null==e?0:e.length;if(!s)return-1;var l=null==n?0:o(n);return l<0&&(l=a(s+l,0)),r(e,i(t,3),l)}},function(e,t){e.exports=function baseFindIndex(e,t,n,r){for(var i=e.length,o=n+(r?1:-1);r?o--:++oimport Button from \'@wikia/react-design-system/components/Button\';\nimport Icon from \'@wikia/react-design-system/components/Button\';\n\n\n...\n\n\n<div>\n <Button>\n <Icon name="camera" />\n Camera\n </Button>\n</div>\n```\n\n## 3. Add the CSS to your build\n\nMake sure you include the CSS in your styles.\n\n```scss\n@import "~@wikia/react-design-system/components/Icon.css";\n@import "~@wikia/react-design-system/components/Button.css";\n```'}]},function(e,t,n){var r={react:n(0)},i=n(5).bind(null,r);n(6).bind(null,"var React = require('react');",i);e.exports=[{type:"markdown",content:"# Contribution\n\n## General guidelines\n\n- ES6 React components with [`prop-types`](https://github.com/facebook/prop-types) saved in `.js` file.\n- Use function syntax if possible, use nesting and flat files.\n- 100% lint and coverage and no regressions\n- use [Jest](https://facebook.github.io/jest/) as a general testing framework and for testing component's rendering\n- use [Enzyme](https://github.com/airbnb/enzyme) for testing interactions\n- use [Sinon](http://sinonjs.org/) for testing callbacks\n\n## Step-by-step guide for components\n\n1. Assuming the new component's name is `ComponentA` all it's files will be in `/source/components/ComponentA/` directory.\n2. Create component in `ComponentA/index.js`.\n3. Add component to `/src/index.js`.\n4. Add component to `/config/styleguide.config.json`.\n5. (optionally) create styles in `ComponentA/styles.s?css` and import them in `ComponentA/index.js`.\n6. Document the usage and props in JSDocs in `ComponentA/index.js`.\n7. Add example or examples in `ComponentA/README.md`.\n8. Add unit test in `ComponentA/index.spec.js`, aim for 100% coverage and all the test cases.\n9. Create new Pull Request.\n10. Code will be merged to `master` only if there are no regressions and after a successful CR.\n11. When the code is merged to `master`, release new version of the styleguide with one of the release commands.\n\n### HOCS\n\n1. Higher order components (hoc) can be added by following the guide\n\n**Note**: The one difference will be to use `js static` in the readme to prevent rendering as styleguidist doesn't have access to the hoc\n\n## Development server\n\n```js\n> yarn dev\n```\n\n## Tests\n\nThe easiest way is to run the full suite:\n\n```js\n> yarn ci\n```\n\nIt will run linting (ESLint, Stylelint), Jest and will output coverage report.\n\n### Watch\n\nThere's a command for watching Jest tests:\n\n```js\n> yarn test:watch\n```\n\n## Build\n\nRunning the build is as simple as:\n\n```js\n> yarn build\n```\n\nThis will run few build commands in sequence:\n\n1. Remove every generated file and directory from the root directory (equivalent of `yarn clean`).\n2. Build the library outputting built ES5 files to the root (`yarn lib:build`).\n3. Build the `docs/` in the root directory; it contains the build styleguide that will appear on the GitHub pages (`yarn styleguide:build`).\n4. Build the `package.json` in the root directory (`yarn package:build`).\n5. Build the `README.md` in the root directory and in all auto generated directories (`yarn readme:build`).\n\n## Release\n\nAfter PR is merged into `master` branch create new release. You should use [SemVer](http://semver.org/) using one of the following commands.\n\nThe script will automatically pull newest `master` branch, build the documentation, create new release version in the `package.json`, create GitHub tag and push this tag to GitHub.\n\n### Usual release; bugfixes, no new features and no breaking changes\n\n```js\n> yarn release\n```\n\n### New features, but no breaking changes\n\n```js\n> yarn release:minor\n```\n\n### Breaking changes, regardless how small\n\n```js\n> yarn release:major\n```"}]},function(e,t,n){"use strict";n.r(t);var r=n(0),i=n.n(r),o=n(1),a=n.n(o);n(295);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function _objectWithoutPropertiesLoose(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r=0||(i[n]=e[n]);return i}var s=function Button(e){var t=e.className,n=e.href,r=e.text,o=e.secondary,a=e.square,s=e.fullwidth,l=e.children,c=_objectWithoutProperties(e,["className","href","text","secondary","square","fullwidth","children"]),u=["wds-button",t,o?"wds-is-secondary":"",a?"wds-is-square":"",r?"wds-is-text":"",s?"wds-is-fullwidth":""].filter(function(e){return e}).join(" ");return n?i.a.createElement("a",_extends({href:n,className:u},c),l):i.a.createElement("button",_extends({className:u},c),l)};s.propTypes={children:a.a.node,className:a.a.string,disabled:a.a.bool,fullwidth:a.a.bool,href:a.a.string,onClick:a.a.func,secondary:a.a.bool,square:a.a.bool,text:a.a.bool},s.defaultProps={children:null,className:"",disabled:!1,fullwidth:!1,href:null,secondary:!1,square:!1,text:!1,onClick:function onClick(){}},t.default=s},function(e,t,n){var r=n(296);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,".wds-button {\n color: #fff;\n background: none;\n align-items: center;\n border-style: solid;\n border-width: 1px;\n border-radius: 3px;\n box-sizing: content-box;\n cursor: default;\n display: inline-flex;\n font-size: 12px;\n font-weight: 600;\n justify-content: center;\n letter-spacing: .15px;\n line-height: 16px;\n margin: 0;\n min-height: 18px;\n outline: none;\n padding: 7px 18px;\n text-decoration: none;\n text-transform: uppercase;\n transition-duration: 300ms;\n transition-property: background-color, border-color, color;\n vertical-align: top;\n -webkit-appearance: none; }\n .wds-button:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #00b7e0; }\n .wds-button:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #47ddff;\n border-color: #47ddff; }\n .wds-button:not(.wds-is-text) {\n border-color: #00b7e0; }\n .wds-button.wds-is-secondary {\n border-color: #00b7e0;\n color: #00b7e0; }\n .wds-button.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-secondary:active, .wds-button.wds-is-secondary.wds-is-active {\n border-color: #47ddff;\n color: #47ddff; }\n .wds-button.wds-is-text {\n color: #00b7e0; }\n .wds-button.wds-is-text:focus:not(:disabled), .wds-button.wds-is-text:hover:not(:disabled), .wds-button.wds-is-text:active, .wds-button.wds-is-text.wds-is-active {\n color: #47ddff; }\n button.wds-button, a.wds-button {\n cursor: pointer; }\n .wds-button:disabled {\n cursor: default;\n opacity: .5;\n pointer-events: none; }\n .wds-button:focus:not(:disabled), .wds-button:hover:not(:disabled), .wds-button:active, .wds-button.wds-is-active {\n text-decoration: none; }\n .wds-button.wds-is-full-width {\n display: flex; }\n .wds-button.wds-is-square {\n height: 36px;\n min-width: 36px;\n width: 36px;\n align-items: center;\n display: inline-flex;\n justify-content: center;\n padding: 0; }\n .wds-button.wds-is-text {\n border: 0; }\n .wds-button .wds-icon:first-child {\n align-self: center;\n pointer-events: none; }\n .wds-button .wds-icon:first-child:not(:only-child) {\n margin-right: 6px; }\n .wds-button .wds-list {\n color: #1a1a1a;\n font-weight: normal;\n letter-spacing: normal;\n text-transform: none;\n text-align: left; }\n .wds-button .wds-dropdown__content {\n top: calc(100% + 1px); }\n\n.wds-button.wds-is-facebook-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-facebook-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #3b5998; }\n .wds-button.wds-is-facebook-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-facebook-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-facebook-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-facebook-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #718dc8;\n border-color: #718dc8; }\n .wds-button.wds-is-facebook-color:not(.wds-is-text) {\n border-color: #3b5998; }\n .wds-button.wds-is-facebook-color.wds-is-secondary {\n border-color: #3b5998;\n color: #3b5998; }\n .wds-button.wds-is-facebook-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-facebook-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-facebook-color.wds-is-secondary:active, .wds-button.wds-is-facebook-color.wds-is-secondary.wds-is-active {\n border-color: #718dc8;\n color: #718dc8; }\n .wds-button.wds-is-facebook-color.wds-is-text {\n color: #3b5998; }\n .wds-button.wds-is-facebook-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-facebook-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-facebook-color.wds-is-text:active, .wds-button.wds-is-facebook-color.wds-is-text.wds-is-active {\n color: #718dc8; }\n\n.wds-button.wds-is-googleplus-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-googleplus-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #dd4b39; }\n .wds-button.wds-is-googleplus-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-googleplus-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-googleplus-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-googleplus-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #96271a;\n border-color: #96271a; }\n .wds-button.wds-is-googleplus-color:not(.wds-is-text) {\n border-color: #dd4b39; }\n .wds-button.wds-is-googleplus-color.wds-is-secondary {\n border-color: #dd4b39;\n color: #dd4b39; }\n .wds-button.wds-is-googleplus-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-googleplus-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-googleplus-color.wds-is-secondary:active, .wds-button.wds-is-googleplus-color.wds-is-secondary.wds-is-active {\n border-color: #96271a;\n color: #96271a; }\n .wds-button.wds-is-googleplus-color.wds-is-text {\n color: #dd4b39; }\n .wds-button.wds-is-googleplus-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-googleplus-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-googleplus-color.wds-is-text:active, .wds-button.wds-is-googleplus-color.wds-is-text.wds-is-active {\n color: #96271a; }\n\n.wds-button.wds-is-line-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-line-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #00c300; }\n .wds-button.wds-is-line-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-line-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-line-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-line-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #2aff2a;\n border-color: #2aff2a; }\n .wds-button.wds-is-line-color:not(.wds-is-text) {\n border-color: #00c300; }\n .wds-button.wds-is-line-color.wds-is-secondary {\n border-color: #00c300;\n color: #00c300; }\n .wds-button.wds-is-line-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-line-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-line-color.wds-is-secondary:active, .wds-button.wds-is-line-color.wds-is-secondary.wds-is-active {\n border-color: #2aff2a;\n color: #2aff2a; }\n .wds-button.wds-is-line-color.wds-is-text {\n color: #00c300; }\n .wds-button.wds-is-line-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-line-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-line-color.wds-is-text:active, .wds-button.wds-is-line-color.wds-is-text.wds-is-active {\n color: #2aff2a; }\n\n.wds-button.wds-is-linkedin-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-linkedin-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #0077b5; }\n .wds-button.wds-is-linkedin-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-linkedin-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-linkedin-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-linkedin-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #1cb1ff;\n border-color: #1cb1ff; }\n .wds-button.wds-is-linkedin-color:not(.wds-is-text) {\n border-color: #0077b5; }\n .wds-button.wds-is-linkedin-color.wds-is-secondary {\n border-color: #0077b5;\n color: #0077b5; }\n .wds-button.wds-is-linkedin-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-linkedin-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-linkedin-color.wds-is-secondary:active, .wds-button.wds-is-linkedin-color.wds-is-secondary.wds-is-active {\n border-color: #1cb1ff;\n color: #1cb1ff; }\n .wds-button.wds-is-linkedin-color.wds-is-text {\n color: #0077b5; }\n .wds-button.wds-is-linkedin-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-linkedin-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-linkedin-color.wds-is-text:active, .wds-button.wds-is-linkedin-color.wds-is-text.wds-is-active {\n color: #1cb1ff; }\n\n.wds-button.wds-is-instagram-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-instagram-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #e02d69; }\n .wds-button.wds-is-instagram-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-instagram-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-instagram-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-instagram-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #92153f;\n border-color: #92153f; }\n .wds-button.wds-is-instagram-color:not(.wds-is-text) {\n border-color: #e02d69; }\n .wds-button.wds-is-instagram-color.wds-is-secondary {\n border-color: #e02d69;\n color: #e02d69; }\n .wds-button.wds-is-instagram-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-instagram-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-instagram-color.wds-is-secondary:active, .wds-button.wds-is-instagram-color.wds-is-secondary.wds-is-active {\n border-color: #92153f;\n color: #92153f; }\n .wds-button.wds-is-instagram-color.wds-is-text {\n color: #e02d69; }\n .wds-button.wds-is-instagram-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-instagram-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-instagram-color.wds-is-text:active, .wds-button.wds-is-instagram-color.wds-is-text.wds-is-active {\n color: #92153f; }\n\n.wds-button.wds-is-meneame-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-meneame-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #ff6400; }\n .wds-button.wds-is-meneame-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-meneame-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-meneame-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-meneame-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #993c00;\n border-color: #993c00; }\n .wds-button.wds-is-meneame-color:not(.wds-is-text) {\n border-color: #ff6400; }\n .wds-button.wds-is-meneame-color.wds-is-secondary {\n border-color: #ff6400;\n color: #ff6400; }\n .wds-button.wds-is-meneame-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-meneame-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-meneame-color.wds-is-secondary:active, .wds-button.wds-is-meneame-color.wds-is-secondary.wds-is-active {\n border-color: #993c00;\n color: #993c00; }\n .wds-button.wds-is-meneame-color.wds-is-text {\n color: #ff6400; }\n .wds-button.wds-is-meneame-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-meneame-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-meneame-color.wds-is-text:active, .wds-button.wds-is-meneame-color.wds-is-text.wds-is-active {\n color: #993c00; }\n\n.wds-button.wds-is-nk-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-nk-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #4077a7; }\n .wds-button.wds-is-nk-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-nk-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-nk-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-nk-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #7fa9ce;\n border-color: #7fa9ce; }\n .wds-button.wds-is-nk-color:not(.wds-is-text) {\n border-color: #4077a7; }\n .wds-button.wds-is-nk-color.wds-is-secondary {\n border-color: #4077a7;\n color: #4077a7; }\n .wds-button.wds-is-nk-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-nk-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-nk-color.wds-is-secondary:active, .wds-button.wds-is-nk-color.wds-is-secondary.wds-is-active {\n border-color: #7fa9ce;\n color: #7fa9ce; }\n .wds-button.wds-is-nk-color.wds-is-text {\n color: #4077a7; }\n .wds-button.wds-is-nk-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-nk-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-nk-color.wds-is-text:active, .wds-button.wds-is-nk-color.wds-is-text.wds-is-active {\n color: #7fa9ce; }\n\n.wds-button.wds-is-odnoklassniki-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #f96900; }\n .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #ffa360;\n border-color: #ffa360; }\n .wds-button.wds-is-odnoklassniki-color:not(.wds-is-text) {\n border-color: #f96900; }\n .wds-button.wds-is-odnoklassniki-color.wds-is-secondary {\n border-color: #f96900;\n color: #f96900; }\n .wds-button.wds-is-odnoklassniki-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-odnoklassniki-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-odnoklassniki-color.wds-is-secondary:active, .wds-button.wds-is-odnoklassniki-color.wds-is-secondary.wds-is-active {\n border-color: #ffa360;\n color: #ffa360; }\n .wds-button.wds-is-odnoklassniki-color.wds-is-text {\n color: #f96900; }\n .wds-button.wds-is-odnoklassniki-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-odnoklassniki-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-odnoklassniki-color.wds-is-text:active, .wds-button.wds-is-odnoklassniki-color.wds-is-text.wds-is-active {\n color: #ffa360; }\n\n.wds-button.wds-is-reddit-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-reddit-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #ff4500; }\n .wds-button.wds-is-reddit-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-reddit-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-reddit-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-reddit-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #992900;\n border-color: #992900; }\n .wds-button.wds-is-reddit-color:not(.wds-is-text) {\n border-color: #ff4500; }\n .wds-button.wds-is-reddit-color.wds-is-secondary {\n border-color: #ff4500;\n color: #ff4500; }\n .wds-button.wds-is-reddit-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-reddit-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-reddit-color.wds-is-secondary:active, .wds-button.wds-is-reddit-color.wds-is-secondary.wds-is-active {\n border-color: #992900;\n color: #992900; }\n .wds-button.wds-is-reddit-color.wds-is-text {\n color: #ff4500; }\n .wds-button.wds-is-reddit-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-reddit-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-reddit-color.wds-is-text:active, .wds-button.wds-is-reddit-color.wds-is-text.wds-is-active {\n color: #992900; }\n\n.wds-button.wds-is-tumblr-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-tumblr-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #34465d; }\n .wds-button.wds-is-tumblr-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-tumblr-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-tumblr-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-tumblr-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #59779e;\n border-color: #59779e; }\n .wds-button.wds-is-tumblr-color:not(.wds-is-text) {\n border-color: #34465d; }\n .wds-button.wds-is-tumblr-color.wds-is-secondary {\n border-color: #34465d;\n color: #34465d; }\n .wds-button.wds-is-tumblr-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-tumblr-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-tumblr-color.wds-is-secondary:active, .wds-button.wds-is-tumblr-color.wds-is-secondary.wds-is-active {\n border-color: #59779e;\n color: #59779e; }\n .wds-button.wds-is-tumblr-color.wds-is-text {\n color: #34465d; }\n .wds-button.wds-is-tumblr-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-tumblr-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-tumblr-color.wds-is-text:active, .wds-button.wds-is-tumblr-color.wds-is-text.wds-is-active {\n color: #59779e; }\n\n.wds-button.wds-is-twitter-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-twitter-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #1da1f2; }\n .wds-button.wds-is-twitter-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-twitter-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-twitter-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-twitter-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #0967a0;\n border-color: #0967a0; }\n .wds-button.wds-is-twitter-color:not(.wds-is-text) {\n border-color: #1da1f2; }\n .wds-button.wds-is-twitter-color.wds-is-secondary {\n border-color: #1da1f2;\n color: #1da1f2; }\n .wds-button.wds-is-twitter-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-twitter-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-twitter-color.wds-is-secondary:active, .wds-button.wds-is-twitter-color.wds-is-secondary.wds-is-active {\n border-color: #0967a0;\n color: #0967a0; }\n .wds-button.wds-is-twitter-color.wds-is-text {\n color: #1da1f2; }\n .wds-button.wds-is-twitter-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-twitter-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-twitter-color.wds-is-text:active, .wds-button.wds-is-twitter-color.wds-is-text.wds-is-active {\n color: #0967a0; }\n\n.wds-button.wds-is-vkontakte-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-vkontakte-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #587ca3; }\n .wds-button.wds-is-vkontakte-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-vkontakte-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-vkontakte-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-vkontakte-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #344a61;\n border-color: #344a61; }\n .wds-button.wds-is-vkontakte-color:not(.wds-is-text) {\n border-color: #587ca3; }\n .wds-button.wds-is-vkontakte-color.wds-is-secondary {\n border-color: #587ca3;\n color: #587ca3; }\n .wds-button.wds-is-vkontakte-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-vkontakte-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-vkontakte-color.wds-is-secondary:active, .wds-button.wds-is-vkontakte-color.wds-is-secondary.wds-is-active {\n border-color: #344a61;\n color: #344a61; }\n .wds-button.wds-is-vkontakte-color.wds-is-text {\n color: #587ca3; }\n .wds-button.wds-is-vkontakte-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-vkontakte-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-vkontakte-color.wds-is-text:active, .wds-button.wds-is-vkontakte-color.wds-is-text.wds-is-active {\n color: #344a61; }\n\n.wds-button.wds-is-wykop-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-wykop-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #fb803f; }\n .wds-button.wds-is-wykop-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-wykop-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-wykop-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-wykop-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #d04b04;\n border-color: #d04b04; }\n .wds-button.wds-is-wykop-color:not(.wds-is-text) {\n border-color: #fb803f; }\n .wds-button.wds-is-wykop-color.wds-is-secondary {\n border-color: #fb803f;\n color: #fb803f; }\n .wds-button.wds-is-wykop-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-wykop-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-wykop-color.wds-is-secondary:active, .wds-button.wds-is-wykop-color.wds-is-secondary.wds-is-active {\n border-color: #d04b04;\n color: #d04b04; }\n .wds-button.wds-is-wykop-color.wds-is-text {\n color: #fb803f; }\n .wds-button.wds-is-wykop-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-wykop-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-wykop-color.wds-is-text:active, .wds-button.wds-is-wykop-color.wds-is-text.wds-is-active {\n color: #d04b04; }\n\n.wds-button.wds-is-weibo-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-weibo-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #ff8140; }\n .wds-button.wds-is-weibo-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-weibo-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-weibo-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-weibo-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #d94a00;\n border-color: #d94a00; }\n .wds-button.wds-is-weibo-color:not(.wds-is-text) {\n border-color: #ff8140; }\n .wds-button.wds-is-weibo-color.wds-is-secondary {\n border-color: #ff8140;\n color: #ff8140; }\n .wds-button.wds-is-weibo-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-weibo-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-weibo-color.wds-is-secondary:active, .wds-button.wds-is-weibo-color.wds-is-secondary.wds-is-active {\n border-color: #d94a00;\n color: #d94a00; }\n .wds-button.wds-is-weibo-color.wds-is-text {\n color: #ff8140; }\n .wds-button.wds-is-weibo-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-weibo-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-weibo-color.wds-is-text:active, .wds-button.wds-is-weibo-color.wds-is-text.wds-is-active {\n color: #d94a00; }\n\n.wds-button.wds-is-youtube-color {\n color: #fff;\n background: none; }\n .wds-button.wds-is-youtube-color:not(.wds-is-text):not(.wds-is-secondary) {\n background-color: #cd201f; }\n .wds-button.wds-is-youtube-color:not(.wds-is-text):not(.wds-is-secondary):focus:not(:disabled), .wds-button.wds-is-youtube-color:not(.wds-is-text):not(.wds-is-secondary):hover:not(:disabled), .wds-button.wds-is-youtube-color:not(.wds-is-text):not(.wds-is-secondary):active, .wds-button.wds-is-youtube-color:not(.wds-is-text):not(.wds-is-secondary).wds-is-active {\n background-color: #e86a6a;\n border-color: #e86a6a; }\n .wds-button.wds-is-youtube-color:not(.wds-is-text) {\n border-color: #cd201f; }\n .wds-button.wds-is-youtube-color.wds-is-secondary {\n border-color: #cd201f;\n color: #cd201f; }\n .wds-button.wds-is-youtube-color.wds-is-secondary:focus:not(:disabled), .wds-button.wds-is-youtube-color.wds-is-secondary:hover:not(:disabled), .wds-button.wds-is-youtube-color.wds-is-secondary:active, .wds-button.wds-is-youtube-color.wds-is-secondary.wds-is-active {\n border-color: #e86a6a;\n color: #e86a6a; }\n .wds-button.wds-is-youtube-color.wds-is-text {\n color: #cd201f; }\n .wds-button.wds-is-youtube-color.wds-is-text:focus:not(:disabled), .wds-button.wds-is-youtube-color.wds-is-text:hover:not(:disabled), .wds-button.wds-is-youtube-color.wds-is-text:active, .wds-button.wds-is-youtube-color.wds-is-text.wds-is-active {\n color: #e86a6a; }\n\n.wds-button.wds-is-fullwidth {\n box-sizing: border-box;\n width: 100%; }\n",""])},function(e,t,n){e.exports={description:"Basic button component\n",displayName:"Button",methods:[],props:[{type:{name:"string"},required:!1,description:"Additional class name",defaultValue:{value:"''",computed:!1},tags:{},name:"className"},{type:{name:"bool"},required:!1,description:"Disabled attribute for the `",settings:{},evalInContext:o},{type:"markdown",content:"Different styles:"},{type:"code",content:"
\n\t\n\t\n\t\n\t\n
",settings:{},evalInContext:o},{type:"markdown",content:"Full width:"},{type:"code",content:"",settings:{},evalInContext:o}]},function(e,t,n){"use strict";n.r(t);var r=n(0),i=n.n(r),o=n(1),a=n.n(o);n(300);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function _objectWithoutPropertiesLoose(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r=0||(i[n]=e[n]);return i}var s=function ButtonGroup(e){var t=e.className,n=e.children,r=_objectWithoutProperties(e,["className","children"]),o=["wds-button-group",t].filter(function(e){return e}).join(" ");return i.a.createElement("div",_extends({className:o},r),n)};s.propTypes={children:a.a.node,className:a.a.string},s.defaultProps={children:null,className:""},t.default=s},function(e,t,n){var r=n(301);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,".wds-button-group {\n align-items: stretch;\n display: inline-flex;\n justify-content: flex-start; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:last-child) {\n border-right-color: #fff; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:first-child) {\n border-left-color: #fff; }\n .wds-button-group > .wds-dropdown:not(:last-child) .wds-button {\n border-right-color: #fff; }\n .wds-button-group > .wds-dropdown:not(:first-child) .wds-button {\n border-left-color: #fff; }\n .wds-button-group > .wds-button {\n border-radius: 0;\n height: auto;\n margin-left: auto;\n margin-right: -1px;\n padding: 7px 12px; }\n .wds-button-group > .wds-button:first-child {\n border-top-left-radius: 3px;\n border-bottom-left-radius: 3px; }\n .wds-button-group > .wds-button:last-child {\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px; }\n .wds-button-group > .wds-button:hover {\n z-index: 1; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:last-child) {\n border-right-width: 1px;\n border-right-style: solid; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:first-child) {\n border-left-width: 1px;\n border-left-style: solid; }\n .wds-button-group > .wds-dropdown:first-child .wds-button {\n border-radius: 0;\n border-top-left-radius: 3px;\n border-bottom-left-radius: 3px; }\n .wds-button-group > .wds-dropdown:last-child .wds-button {\n border-radius: 0;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px; }\n .wds-button-group > .wds-dropdown:not(:last-child) .wds-button {\n border-right-width: 1px;\n border-right-style: solid; }\n .wds-button-group > .wds-dropdown:not(:first-child) .wds-button {\n border-left-width: 1px;\n border-left-style: solid; }\n",""])},function(e,t,n){e.exports={description:"Button group component\n",displayName:"ButtonGroup",methods:[],props:[{type:{name:"string"},required:!1,description:"Additional class name",defaultValue:{value:"''",computed:!1},tags:{},name:"className"}],doclets:{},tags:{},examples:n(303)}},function(e,t,n){var r={react:n(0)},i=n(5).bind(null,r),o=n(6).bind(null,"var React = require('react');",i);e.exports=[{type:"markdown",content:"Regular buttons:"},{type:"code",content:"\n\t\n\t\n\t\n\t\n",settings:{},evalInContext:o},{type:"markdown",content:"Secondary buttons:"},{type:"code",content:"\n\t\n\t\n\t\n\t\n",settings:{},evalInContext:o}]},function(e,t,n){"use strict";n.r(t);var r=n(0),i=n.n(r),o=n(1),a=n.n(o);n(305);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function _objectWithoutPropertiesLoose(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r=0||(i[n]=e[n]);return i}var s=function FloatingButton(e){var t=e.className,n=e.href,r=e.children,o=_objectWithoutProperties(e,["className","href","children"]),a=["wds-floating-button",t].filter(function(e){return e}).join(" ");return n?i.a.createElement("a",_extends({href:n,className:a},o),r):i.a.createElement("button",_extends({className:a},o),r)};s.propTypes={children:a.a.node,className:a.a.string,disabled:a.a.bool,href:a.a.string,onClick:a.a.func},s.defaultProps={children:null,className:"",disabled:!1,href:null,onClick:function onClick(){}},t.default=s},function(e,t,n){var r=n(306);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,".wds-floating-button {\n align-items: center;\n background: #fff;\n border-radius: 50%;\n border: 0;\n box-shadow: 0 0 10px 0 rgba(26, 26, 26, 0.2);\n display: flex;\n height: 36px;\n justify-content: center;\n margin: 0;\n outline: none;\n padding: 0;\n transition-duration: 300ms;\n transition-property: box-shadow;\n width: 36px; }\n .wds-floating-button:not([disabled]), .wds-floating-button:not(.wds-is-disabled) {\n cursor: pointer; }\n .wds-floating-button:not([disabled]):hover, .wds-floating-button:not(.wds-is-disabled):hover {\n box-shadow: 0 0 10px 0 rgba(26, 26, 26, 0.4); }\n\n.wds-floating-button-group {\n display: inline-flex; }\n .wds-floating-button-group.wds-is-vertical {\n flex-flow: column; }\n .wds-floating-button-group:not(.wds-is-vertical) > .wds-floating-button:not(:first-child) {\n margin-left: 8px; }\n .wds-floating-button-group.wds-is-vertical > .wds-floating-button:not(:first-child) {\n margin-top: 8px; }\n",""])},function(e,t,n){e.exports={description:"Floating button (icons-only)\n",displayName:"FloatingButton",methods:[],props:[{type:{name:"string"},required:!1,description:"Additional class name",defaultValue:{value:"''",computed:!1},tags:{},name:"className"},{type:{name:"bool"},required:!1,description:"Disabled attribute for the `
",settings:{},evalInContext:o},{type:"markdown",content:"Different styles:"},{type:"code",content:"
\n\t\n\t\n\t\n\t\n
",settings:{},evalInContext:o},{type:"markdown",content:"Full width:"},{type:"code",content:"",settings:{},evalInContext:o}]},function(e,t,n){"use strict";n.r(t);var r=n(0),i=n.n(r),o=n(1),a=n.n(o);n(300);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function _objectWithoutPropertiesLoose(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r=0||(i[n]=e[n]);return i}var s=function ButtonGroup(e){var t=e.className,n=e.children,r=_objectWithoutProperties(e,["className","children"]),o=["wds-button-group",t].filter(function(e){return e}).join(" ");return i.a.createElement("div",_extends({className:o},r),n)};s.propTypes={children:a.a.node,className:a.a.string},s.defaultProps={children:null,className:""},t.default=s},function(e,t,n){var r=n(301);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,".wds-button-group {\n align-items: stretch;\n display: inline-flex;\n justify-content: flex-start; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:last-child) {\n border-right-color: #fff; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:first-child) {\n border-left-color: #fff; }\n .wds-button-group > .wds-dropdown:not(:last-child) .wds-button {\n border-right-color: #fff; }\n .wds-button-group > .wds-dropdown:not(:first-child) .wds-button {\n border-left-color: #fff; }\n .wds-button-group > .wds-button {\n border-radius: 0;\n height: auto;\n margin-left: auto;\n margin-right: -1px;\n padding: 7px 12px; }\n .wds-button-group > .wds-button:first-child {\n border-top-left-radius: 3px;\n border-bottom-left-radius: 3px; }\n .wds-button-group > .wds-button:last-child {\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px; }\n .wds-button-group > .wds-button:hover {\n z-index: 1; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:last-child) {\n border-right-width: 1px;\n border-right-style: solid; }\n .wds-button-group > .wds-button:not(.wds-is-secondary):not(:first-child) {\n border-left-width: 1px;\n border-left-style: solid; }\n .wds-button-group > .wds-dropdown:first-child .wds-button {\n border-radius: 0;\n border-top-left-radius: 3px;\n border-bottom-left-radius: 3px; }\n .wds-button-group > .wds-dropdown:last-child .wds-button {\n border-radius: 0;\n border-top-right-radius: 3px;\n border-bottom-right-radius: 3px; }\n .wds-button-group > .wds-dropdown:not(:last-child) .wds-button {\n border-right-width: 1px;\n border-right-style: solid; }\n .wds-button-group > .wds-dropdown:not(:first-child) .wds-button {\n border-left-width: 1px;\n border-left-style: solid; }\n",""])},function(e,t,n){e.exports={description:"Button group component\n",displayName:"ButtonGroup",methods:[],props:[{type:{name:"string"},required:!1,description:"Additional class name",defaultValue:{value:"''",computed:!1},tags:{},name:"className"}],doclets:{},tags:{},examples:n(303)}},function(e,t,n){var r={react:n(0)},i=n(5).bind(null,r),o=n(6).bind(null,"var React = require('react');",i);e.exports=[{type:"markdown",content:"Regular buttons:"},{type:"code",content:"\n\t\n\t\n\t\n\t\n",settings:{},evalInContext:o},{type:"markdown",content:"Secondary buttons:"},{type:"code",content:"\n\t\n\t\n\t\n\t\n",settings:{},evalInContext:o}]},function(e,t,n){"use strict";n.r(t);var r=n(0),i=n.n(r),o=n(1),a=n.n(o);n(305);function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}function _objectWithoutPropertiesLoose(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r=0||(i[n]=e[n]);return i}var s=function FloatingButton(e){var t=e.className,n=e.href,r=e.children,o=_objectWithoutProperties(e,["className","href","children"]),a=["wds-floating-button",t].filter(function(e){return e}).join(" ");return n?i.a.createElement("a",_extends({href:n,className:a},o),r):i.a.createElement("button",_extends({className:a},o),r)};s.propTypes={children:a.a.node,className:a.a.string,disabled:a.a.bool,href:a.a.string,onClick:a.a.func},s.defaultProps={children:null,className:"",disabled:!1,href:null,onClick:function onClick(){}},t.default=s},function(e,t,n){var r=n(306);"string"==typeof r&&(r=[[e.i,r,""]]);var i={hmr:!0,transform:void 0,insertInto:void 0};n(9)(r,i);r.locals&&(e.exports=r.locals)},function(e,t,n){(e.exports=n(8)(!1)).push([e.i,".wds-floating-button {\n align-items: center;\n background: #fff;\n border-radius: 50%;\n border: 0;\n box-shadow: 0 0 10px 0 rgba(26, 26, 26, 0.2);\n display: flex;\n height: 36px;\n justify-content: center;\n margin: 0;\n outline: none;\n padding: 0;\n transition-duration: 300ms;\n transition-property: box-shadow;\n width: 36px; }\n .wds-floating-button:not([disabled]), .wds-floating-button:not(.wds-is-disabled) {\n cursor: pointer; }\n .wds-floating-button:not([disabled]):hover, .wds-floating-button:not(.wds-is-disabled):hover {\n box-shadow: 0 0 10px 0 rgba(26, 26, 26, 0.4); }\n\n.wds-floating-button-group {\n display: inline-flex; }\n .wds-floating-button-group.wds-is-vertical {\n flex-flow: column; }\n .wds-floating-button-group:not(.wds-is-vertical) > .wds-floating-button:not(:first-child) {\n margin-left: 8px; }\n .wds-floating-button-group.wds-is-vertical > .wds-floating-button:not(:first-child) {\n margin-top: 8px; }\n",""])},function(e,t,n){e.exports={description:"Floating button (icons-only)\n",displayName:"FloatingButton",methods:[],props:[{type:{name:"string"},required:!1,description:"Additional class name",defaultValue:{value:"''",computed:!1},tags:{},name:"className"},{type:{name:"bool"},required:!1,description:"Disabled attribute for the `