зеркало из https://github.com/mozilla/hubs.git
1 строка
32 KiB
JavaScript
1 строка
32 KiB
JavaScript
"use strict";(globalThis.webpackChunkhubs=globalThis.webpackChunkhubs||[]).push([[6825],{"./src/react-components/layout/RoomLayout.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{s:()=>RoomLayout_RoomLayout});__webpack_require__("./node_modules/react/index.js");var prop_types=__webpack_require__("./node_modules/prop-types/index.js"),prop_types_default=__webpack_require__.n(prop_types),classnames=__webpack_require__("./node_modules/classnames/index.js"),classnames_default=__webpack_require__.n(classnames),injectStylesIntoStyleTag=__webpack_require__("./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),styleDomAPI=__webpack_require__("./node_modules/style-loader/dist/runtime/styleDomAPI.js"),styleDomAPI_default=__webpack_require__.n(styleDomAPI),insertBySelector=__webpack_require__("./node_modules/style-loader/dist/runtime/insertBySelector.js"),insertBySelector_default=__webpack_require__.n(insertBySelector),setAttributesWithoutAttributes=__webpack_require__("./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),setAttributesWithoutAttributes_default=__webpack_require__.n(setAttributesWithoutAttributes),insertStyleElement=__webpack_require__("./node_modules/style-loader/dist/runtime/insertStyleElement.js"),insertStyleElement_default=__webpack_require__.n(insertStyleElement),styleTagTransform=__webpack_require__("./node_modules/style-loader/dist/runtime/styleTagTransform.js"),styleTagTransform_default=__webpack_require__.n(styleTagTransform),RoomLayout=__webpack_require__("./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[13].use[1]!./node_modules/sass-loader/dist/cjs.js!./src/react-components/layout/RoomLayout.scss"),options={};options.styleTagTransform=styleTagTransform_default(),options.setAttributes=setAttributesWithoutAttributes_default(),options.insert=insertBySelector_default().bind(null,"head"),options.domAPI=styleDomAPI_default(),options.insertStyleElement=insertStyleElement_default();injectStylesIntoStyleTag_default()(RoomLayout.Z,options);const layout_RoomLayout=RoomLayout.Z&&RoomLayout.Z.locals?RoomLayout.Z.locals:void 0;var Toolbar=__webpack_require__("./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[13].use[1]!./node_modules/sass-loader/dist/cjs.js!./src/react-components/layout/Toolbar.scss"),Toolbar_options={};Toolbar_options.styleTagTransform=styleTagTransform_default(),Toolbar_options.setAttributes=setAttributesWithoutAttributes_default(),Toolbar_options.insert=insertBySelector_default().bind(null,"head"),Toolbar_options.domAPI=styleDomAPI_default(),Toolbar_options.insertStyleElement=insertStyleElement_default();injectStylesIntoStyleTag_default()(Toolbar.Z,Toolbar_options);const layout_Toolbar=Toolbar.Z&&Toolbar.Z.locals?Toolbar.Z.locals:void 0;var style_utils=__webpack_require__("./src/react-components/styles/style-utils.scss"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const _excluded=["className","left","center","right"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter((function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable}))),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach((function(key){_defineProperty(target,key,source[key])})):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach((function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))}))}return target}function _defineProperty(obj,key,value){return(key=function _toPropertyKey(arg){var key=function _toPrimitive(input,hint){if("object"!=typeof input||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!=typeof res)return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string");return"symbol"==typeof key?key:String(key)}(key))in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],excluded.indexOf(key)>=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],excluded.indexOf(key)>=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function Toolbar_Toolbar(_ref){let{className,left,center,right}=_ref,rest=_objectWithoutProperties(_ref,_excluded);return(0,jsx_runtime.jsxs)("div",_objectSpread(_objectSpread({className:classnames_default()(layout_Toolbar.toolbar,className)},rest),{},{children:[(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_Toolbar.content,layout_Toolbar.left_content,style_utils.Z.showLg),children:left}),(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_Toolbar.content,layout_Toolbar.center_content),children:center}),(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_Toolbar.content,layout_Toolbar.right_content,style_utils.Z.showLg),children:right})]}))}Toolbar_Toolbar.displayName="Toolbar",Toolbar_Toolbar.propTypes={className:prop_types_default().string,left:prop_types_default().node,center:prop_types_default().node,right:prop_types_default().node,hideLeft:prop_types_default().string,hideRight:prop_types_default().string},Toolbar_Toolbar.__docgenInfo={description:"",methods:[],displayName:"Toolbar",props:{className:{description:"",type:{name:"string"},required:!1},left:{description:"",type:{name:"node"},required:!1},center:{description:"",type:{name:"node"},required:!1},right:{description:"",type:{name:"node"},required:!1},hideLeft:{description:"",type:{name:"string"},required:!1},hideRight:{description:"",type:{name:"string"},required:!1}}};const RoomLayout_excluded=["className","viewportClassName","sidebar","sidebarClassName","toolbarLeft","toolbarCenter","toolbarRight","toolbarClassName","modal","viewport","objectFocused","streaming","viewportRef"];function RoomLayout_ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter((function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable}))),keys.push.apply(keys,symbols)}return keys}function RoomLayout_objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?RoomLayout_ownKeys(Object(source),!0).forEach((function(key){RoomLayout_defineProperty(target,key,source[key])})):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):RoomLayout_ownKeys(Object(source)).forEach((function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))}))}return target}function RoomLayout_defineProperty(obj,key,value){return(key=function RoomLayout_toPropertyKey(arg){var key=function RoomLayout_toPrimitive(input,hint){if("object"!=typeof input||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!=typeof res)return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string");return"symbol"==typeof key?key:String(key)}(key))in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}function RoomLayout_objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=function RoomLayout_objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],excluded.indexOf(key)>=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],excluded.indexOf(key)>=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}function RoomLayout_RoomLayout(_ref){let{className,viewportClassName,sidebar,sidebarClassName,toolbarLeft,toolbarCenter,toolbarRight,toolbarClassName,modal,viewport,objectFocused,streaming,viewportRef}=_ref,rest=RoomLayout_objectWithoutProperties(_ref,RoomLayout_excluded);return(0,jsx_runtime.jsxs)("div",RoomLayout_objectSpread(RoomLayout_objectSpread({className:classnames_default()(layout_RoomLayout.roomLayout,{[layout_RoomLayout.objectFocused]:objectFocused},className)},rest),{},{children:[sidebar&&(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_RoomLayout.sidebar,sidebarClassName),children:sidebar}),(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_RoomLayout.modalContainer,layout_RoomLayout.viewport),children:modal}),(toolbarLeft||toolbarCenter||toolbarRight)&&(0,jsx_runtime.jsx)(Toolbar_Toolbar,{className:classnames_default()(layout_RoomLayout.main,layout_RoomLayout.toolbar,toolbarClassName),left:toolbarLeft,center:toolbarCenter,right:toolbarRight}),(0,jsx_runtime.jsx)("div",{className:classnames_default()(layout_RoomLayout.main,layout_RoomLayout.viewport,{[layout_RoomLayout.streaming]:streaming},viewportClassName),ref:viewportRef,children:viewport})]}))}RoomLayout_RoomLayout.displayName="RoomLayout",RoomLayout_RoomLayout.propTypes={className:prop_types_default().string,viewportClassName:prop_types_default().string,sidebar:prop_types_default().node,sidebarClassName:prop_types_default().string,toolbarLeft:prop_types_default().node,toolbarCenter:prop_types_default().node,toolbarRight:prop_types_default().node,toolbarClassName:prop_types_default().string,modal:prop_types_default().node,viewport:prop_types_default().node,objectFocused:prop_types_default().bool,streaming:prop_types_default().bool,viewportRef:prop_types_default().any},RoomLayout_RoomLayout.__docgenInfo={description:"",methods:[],displayName:"RoomLayout",props:{className:{description:"",type:{name:"string"},required:!1},viewportClassName:{description:"",type:{name:"string"},required:!1},sidebar:{description:"",type:{name:"node"},required:!1},sidebarClassName:{description:"",type:{name:"string"},required:!1},toolbarLeft:{description:"",type:{name:"node"},required:!1},toolbarCenter:{description:"",type:{name:"node"},required:!1},toolbarRight:{description:"",type:{name:"node"},required:!1},toolbarClassName:{description:"",type:{name:"string"},required:!1},modal:{description:"",type:{name:"node"},required:!1},viewport:{description:"",type:{name:"node"},required:!1},objectFocused:{description:"",type:{name:"bool"},required:!1},streaming:{description:"",type:{name:"bool"},required:!1},viewportRef:{description:"",type:{name:"any"},required:!1}}}},"./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[13].use[1]!./node_modules/sass-loader/dist/cjs.js!./src/react-components/layout/RoomLayout.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/css-loader/dist/runtime/sourceMaps.js"),_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".RoomLayout__room-layout__kTC2f{display:grid;width:100%;height:100%;grid-template-columns:[main] auto [sidebar] minmax(0, min-content);grid-template-rows:[viewport] auto [toolbar] min-content;overflow:hidden;position:relative;pointer-events:none}.RoomLayout__main__YsUq9{grid-column-start:main}.RoomLayout__sidebar__c3nxk{grid-column-start:sidebar;height:100%;overflow:hidden;width:450px}@media(max-width: 991px),(max-height: 599px){.RoomLayout__sidebar__c3nxk{position:fixed;top:0;left:0;bottom:0;right:0;margin:0;width:100%;z-index:9}}.RoomLayout__viewport__UVY6l{position:relative;grid-row-start:viewport;display:flex;justify-content:center;align-items:center}.RoomLayout__viewport__UVY6l>*{pointer-events:auto}.RoomLayout__toolbar__HAuuI{grid-row-start:toolbar;grid-column-end:-1;pointer-events:auto;z-index:0}.RoomLayout__modal-container__Zn2lB{grid-column:main;grid-row:viewport;position:relative;display:flex;justify-content:center;align-items:center;z-index:10}.RoomLayout__modal-container__Zn2lB>*{pointer-events:auto}.RoomLayout__scene__higS0{position:absolute;top:0;left:0;width:100%;height:100%}@media(max-width: 991px),(max-height: 599px){.RoomLayout__object-focused__w_gE0 .RoomLayout__toolbar__HAuuI{display:none}.RoomLayout__object-focused__w_gE0 .RoomLayout__sidebar__c3nxk{display:none}}.RoomLayout__streaming__e4Nkj{box-shadow:inset 0 0 0 3px #f5325c}","",{version:3,sources:["webpack://./src/react-components/layout/RoomLayout.scss"],names:[],mappings:"AAEA,gCACE,YAAA,CACA,UAAA,CACA,WAAA,CACA,kEACE,CAGF,wDACE,CAGF,eAAA,CACA,iBAAA,CACA,mBAAA,CAGF,yBACE,sBAAA,CAGF,4BACE,yBAAA,CACA,WAAA,CACA,eAAA,CACA,WAAA,CAEA,6CANF,4BAOI,cAAA,CACA,KAAA,CACA,MAAA,CACA,QAAA,CACA,OAAA,CACA,QAAA,CACA,UAAA,CACA,SAAA,CAAA,CAIJ,6BACE,iBAAA,CACA,uBAAA,CACA,YAAA,CACA,sBAAA,CACA,kBAAA,CAEA,+BACE,mBAAA,CAIJ,4BACE,sBAAA,CACA,kBAAA,CACA,mBAAA,CACA,SAAA,CAGF,oCACE,gBAAA,CACA,iBAAA,CACA,iBAAA,CACA,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,UAAA,CAEA,sCACE,mBAAA,CAIJ,0BACE,iBAAA,CACA,KAAA,CACA,MAAA,CACA,UAAA,CACA,WAAA,CAIA,6CACE,+DACE,YAAA,CAGF,+DACE,YAAA,CAAA,CAKN,8BACE,kCAAA",sourcesContent:['@use "../styles/theme.scss";\n\n:local(.room-layout) {\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-columns:\n [main] auto\n [sidebar] minmax(0, min-content);\n\n grid-template-rows:\n [viewport] auto\n [toolbar] min-content;\n\n overflow: hidden;\n position: relative;\n pointer-events: none;\n}\n\n:local(.main) {\n grid-column-start: main;\n}\n\n:local(.sidebar) {\n grid-column-start: sidebar;\n height: 100%;\n overflow: hidden;\n width: 450px;\n\n @media (max-width: theme.$breakpoint-lg - 1), (max-height: theme.$breakpoint-vr - 1) {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n margin: 0;\n width: 100%;\n z-index: 9;\n }\n}\n\n:local(.viewport) {\n position: relative;\n grid-row-start: viewport;\n display: flex;\n justify-content: center;\n align-items: center;\n\n & > * {\n pointer-events: auto;\n }\n}\n\n:local(.toolbar) {\n grid-row-start: toolbar;\n grid-column-end: -1;\n pointer-events: auto;\n z-index: 0;\n}\n\n:local(.modal-container) {\n grid-column: main;\n grid-row: viewport;\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 10;\n\n & > * {\n pointer-events: auto;\n }\n}\n\n:local(.scene) {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n\n:local(.object-focused) {\n @media (max-width: theme.$breakpoint-lg - 1), (max-height: theme.$breakpoint-vr - 1) {\n :local(.toolbar) {\n display: none;\n }\n\n :local(.sidebar) {\n display: none;\n }\n }\n}\n\n:local(.streaming) {\n box-shadow: inset 0 0 0 3px theme.$red;\n}\n'],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={"room-layout":"RoomLayout__room-layout__kTC2f",roomLayout:"RoomLayout__room-layout__kTC2f",main:"RoomLayout__main__YsUq9",sidebar:"RoomLayout__sidebar__c3nxk",viewport:"RoomLayout__viewport__UVY6l",toolbar:"RoomLayout__toolbar__HAuuI","modal-container":"RoomLayout__modal-container__Zn2lB",modalContainer:"RoomLayout__modal-container__Zn2lB",scene:"RoomLayout__scene__higS0","object-focused":"RoomLayout__object-focused__w_gE0",objectFocused:"RoomLayout__object-focused__w_gE0",streaming:"RoomLayout__streaming__e4Nkj"};const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___},"./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[13].use[1]!./node_modules/sass-loader/dist/cjs.js!./src/react-components/layout/Toolbar.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/css-loader/dist/runtime/sourceMaps.js"),_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".Toolbar__toolbar__YcMAi{height:96px;display:flex;padding:12px;background-color:var(--background1-color);border-top:1px solid var(--border1-color);position:relative}@media(min-width: 992px){.Toolbar__toolbar__YcMAi{padding:12px 24px;justify-content:space-between}}.Toolbar__content__fDPmA{display:flex;flex:1;justify-content:space-around;align-items:center;gap:0 24px}@media(min-width: 992px){.Toolbar__content__fDPmA{flex:0}}.Toolbar__center_content__Vdgeb{position:absolute;display:flex;width:calc(100% - 48px);justify-content:center;z-index:-1}@media(max-width: 992px){.Toolbar__center_content__Vdgeb{width:100%;position:relative;justify-content:space-around;gap:unset}}","",{version:3,sources:["webpack://./src/react-components/layout/Toolbar.scss","webpack://./src/react-components/styles/theme.scss"],names:[],mappings:"AAEA,yBACE,WAAA,CACA,YAAA,CACA,YAAA,CACA,yCCgKkB,CD/JlB,yCAAA,CACA,iBAAA,CAEA,yBARF,yBASI,iBAAA,CACA,6BAAA,CAAA,CAIJ,yBACE,YAAA,CACA,MAAA,CACA,4BAAA,CACA,kBAAA,CACA,UAAA,CAEA,yBAPF,yBAQI,MAAA,CAAA,CAIJ,gCACE,iBAAA,CACA,YAAA,CACA,uBAAA,CACA,sBAAA,CACA,UAAA,CAEA,yBAPF,gCAQI,UAAA,CACA,iBAAA,CACA,4BAAA,CACA,SAAA,CAAA",sourcesContent:['@use "../styles/theme";\n\n:local(.toolbar) {\n height: 96px;\n display: flex;\n padding: 12px;\n background-color: theme.$background1-color;\n border-top: 1px solid theme.$border1-color;\n position: relative;\n\n @media (min-width: theme.$breakpoint-lg) {\n padding: 12px 24px;\n justify-content: space-between;\n }\n}\n\n:local(.content) {\n display: flex;\n flex: 1;\n justify-content: space-around;\n align-items: center;\n gap: 0 24px;\n\n @media (min-width: theme.$breakpoint-lg) {\n flex: 0;\n }\n}\n\n:local(.center_content) {\n position: absolute;\n display: flex;\n width: calc(100% - 48px);\n justify-content: center;\n z-index: -1;\n\n @media (max-width: theme.$breakpoint-lg) {\n width: 100%;\n position: relative;\n justify-content: space-around;\n gap: unset;\n }\n}\n',"// Breakpoints\n// default below 576px (Portrait Phones)\n$breakpoint-sm: 576px; // Landscape Phones\n$breakpoint-md: 768px; // Tablets\n$breakpoint-lg: 992px; // Desktops\n$breakpoint-xl: 1200px; // Large Desktops\n$breakpoint-xxl: 1600px; // Extra Large Desktops\n$breakpoint-vr: 600px; // Standalone VR Browsers\n\n// Font styles\n$font-size-xs: 10px;\n$font-size-sm: 12px;\n$font-size-md: 14px;\n$font-size-lg: 20px;\n$font-size-xl: 24px;\n$font-size-2xl: 28px;\n\n$font-weight-regular: 400;\n$font-weight-medium: 500;\n$font-weight-bold: 700;\n\n// Border styles\n$border-radius-regular: 8px;\n$border-radius-small: 6px;\n\n// Spacing\n$spacing-2xs: 4px;\n$spacing-xs: 8px;\n$spacing-sm: 12px;\n$spacing-md: 16px;\n$spacing-lg: 20px;\n$spacing-xl: 24px;\n\n// Utility colors\n$transparent: transparent;\n$transparent-hover: rgba(0, 0, 0, 0.08);\n$transparent-pressed: rgba(0, 0, 0, 0.12);\n\n$white: #ffffff;\n$white-hover: #e7e7e7;\n$white-pressed: #dbdbdb;\n\n$lightgrey: #e7e7e7;\n$lightgrey-hover: #f5f5f5;\n$lightgrey-pressed: #dbdbdb;\n\n$grey: #bbbbbb;\n$grey-hover: #c7c7c7;\n$grey-pressed: #adadad;\n\n$darkgrey: #868686;\n$darkgrey-hover: #949494;\n$darkgrey-pressed: #7a7a7a;\n\n$black: #000000;\n$black-hover: #404040;\n$black-pressed: #7a7a7a;\n\n$red: #f5325c;\n$red-hover: #f64b70;\n$red-pressed: #f41a49;\n\n$orange: #ff8500;\n$orange-hover: #ff911a;\n$orange-pressed: #e67800;\n\n$green: #7ed320;\n$green-hover: #8cdf2f;\n$green-pressed: #72be1d;\n\n$blue: #007ab8;\n$blue-hover: #008bd1;\n$blue-pressed: #00699e;\n\n$purple: #7854f6;\n$purple-hover: #8c6ef7;\n$purple-pressed: #663df5;\n\n$recessed-bg: #f9f9f9;\n\n$yellow: #ffc000;\n\n// Brand Colors\n$spoke-primary-color: #2f80ed;\n$twitter-primary-color: #6fc0fd;\n$slack-primary-color: #611f69;\n$discord--primary-color: #7289da;\n\n// Discord Bot Page Colors\n$discord-bg-color: #2a2d32;\n$discord-text1-color: white;\n$discord-text2-color: #a3a3a3;\n$discord-text3-color: rgb(127, 127, 127);\n$discord-text4-color: rgb(64, 64, 64);\n\n// Theme SCSS Variables:\n// Reference these variables in the Hubs codebase.\n// The CSS variables they reference are defined in ./global.scss such that they are only included on the page once.\n$font-family-default: var(--font-family-default);\n$font-family-monospace: var(--font-family-monospace);\n\n$text1-color: var(--text1-color);\n$text1-color-hover: var(--text1-color-hover);\n$text1-color-pressed: var(--text1-color-pressed);\n$text2-color: var(--text2-color);\n$text2-color-hover: var(--text2-color-hover);\n$text2-color-pressed: var(--text2-color-pressed);\n$text3-color: var(--text3-color);\n$text3-color-hover: var(--text3-color-hover);\n$text3-color-pressed: var(--text3-color-pressed);\n$text4-color: var(--text4-color);\n$text4-color-hover: var(--text4-color-hover);\n$text4-color-pressed: var(--text4-color-pressed);\n$text5-color: var(--text5-color);\n$text5-color-hover: var(--text5-color-hover);\n$text5-color-pressed: var(--text5-color-pressed);\n$text-inverted-color: var(--text-inverted-color);\n\n$link-color: var(--link-color);\n$link-color-hover: var(--link-color-hover);\n$link-color-pressed: var(--link-color-pressed);\n\n$accept-color: var(--accept-color);\n$accept-border-color: var(--accept-border-color);\n$accept-color-hover: var(--accept-color-hover);\n$accept-color-pressed: var(--accept-color-pressed);\n\n$cancel-color: var(--cancel-color);\n$cancel-color-hover: var(--cancel-color-hover);\n$cancel-color-pressed: var(--cancel-color-pressed);\n\n$accent1-color: var(--accent1-color);\n$accent1-border-color: var(--accent1-border-color);\n$accent1-color-hover: var(--accent1-color-hover);\n$accent1-color-pressed: var(--accent1-color-pressed);\n\n$accent2-color: var(--accent2-color);\n$accent2-border-color: var(--accent2-border-color);\n$accent2-color-hover: var(--accent2-color-hover);\n$accent2-color-pressed: var(--accent2-color-pressed);\n\n$accent3-color: var(--accent3-color);\n$accent3-color-hover: var(--accent3-color-hover);\n$accent3-color-pressed: var(--accent3-color-pressed);\n$accent3-border-color: var(--accent3-border-color);\n\n$accent4-color: var(--accent4-color);\n$accent4-border-color: var(--accent4-border-color);\n$accent4-color-hover: var(--accent4-color-hover);\n$accent4-color-pressed: var(--accent4-color-pressed);\n\n$accent5-color: var(--accent5-color);\n$accent5-border-color: var(--accent5-border-color);\n$accent5-color-hover: var(--accent5-color-hover);\n$accent5-color-pressed: var(--accent5-color-pressed);\n\n$accent6-color: var(--accent6-color);\n$accent6-color-hover: var(--accent6-color-hover);\n$accent6-color-pressed: var(--accent6-color-pressed);\n\n$primary-color: var(--primary-color);\n$primary-color-hover: var(--primary-color-hover);\n$primary-color-pressed: var(--primary-color-pressed);\n\n$secondary-color: var(--secondary-color);\n\n$background1-color: var(--background1-color);\n$background2-color: var(--background2-color);\n$background3-color: var(--background3-color);\n$background4-color: var(--background4-color);\n\n$loading-screen-background: var(--loading-screen-background);\n\n$border1-color: var(--border1-color);\n$border2-color: var(--border2-color);\n\n$outline-color: var(--outline-color);\n\n$shadow-color: var(--shadow-color);\n\n$basic-color: var(--basic-color);\n$basic-color-hover: var(--basic-color-hover);\n$basic-color-pressed: var(--basic-color-pressed);\n$basic-border-color: var(--basic-border-color);\n\n$disabled-text-color: var(--disabled-text-color);\n$disabled-bg-color: var(--disabled-bg-color);\n$disabled-icon-color: var(--disabled-icon-color);\n\n$radio-border-color: var(--radio-border-color);\n$radio-bg-color: var(--radio-bg-color);\n$radio-bg-color-hover: var(--radio-bg-color-hover);\n$radio-bg-color-pressed: var(--radio-bg-color-pressed);\n\n$toggle-button-color: var(--toggle-button-color);\n\n$input-bg-color: var(--input-bg-color);\n$input-icon-color: var(--input-icon-color);\n$input-border-color: var(--input-border-color);\n$input-border-color-hover: var(--input-border-color-hover);\n$input-outline-color: var(--input-outline-color);\n\n$button-text-color: var(--button-text-color);\n$button-border-color: var(--button-border-color);\n$button-bg-color: var(--button-bg-color);\n$button-bg-color-hover: var(--button-bg-color-hover);\n$button-bg-color-pressed: var(--button-bg-color-pressed);\n\n$active-text-color: var(--active-text-color);\n$active-color: var(--active-color);\n$active-color-hover: var(--active-color-hover);\n$active-color-pressed: var(--active-color-pressed);\n\n$chat-bubble-bg-color-sent: var(--chat-bubble-bg-color-sent);\n$chat-bubble-text-color-sent: var(--chat-bubble-text-color-sent);\n$chat-bubble-link-color-sent-hover: var(--chat-bubble-link-color-sent-hover);\n$chat-bubble-link-color-sent-pressed: var(--chat-bubble-link-color-sent-pressed);\n$chat-bubble-bg-color-received: var(--chat-bubble-bg-color-received);\n\n$favorite-color: var(--favorite-color);\n\n$error-color: var(--error-color);\n\n$overlay-bg-color: var(--overlay-bg-color);\n$overlay-text-color: var(--overlay-text-color);\n$overlay-border-color: var(--overlay-border-color);\n\n$toolbar-icon-color: var(--toolbar-icon-color);\n$toolbar-icon-selected-bg: var(--toolbar-icon-selected-bg);\n$toolbar-basic-icon-color: var(--toolbar-basic-icon-color);\n$toolbar-basic-selected-icon-color: var(--toolbar-basic-selected-icon-color);\n$toolbar-basic-color: var(--toolbar-basic-color);\n$toolbar-basic-color-hover: var(--toolbar-basic-color-hover);\n$toolbar-basic-color-pressed: var(--toolbar-basic-color-pressed);\n$toolbar-basic-border-color: var(--toolbar-basic-border-color);\n\n$tile-text-color: var(--tile-text-color);\n$tile-bg-color: var(--tile-bg-color);\n$tile-bg-color-hover: var(--tile-bg-color-hover);\n$tile-bg-color-pressed: var(--tile-bg-color-pressed);\n$tile-button-text-color: var(--tile-button-text-color);\n$tile-button-bg-color: var(--tile-button-bg-color);\n$tile-button-bg-color-hover: var(--tile-button-bg-color-hover);\n$tile-button-bg-color-pressed: var(--tile-button-bg-color-pressed);\n$tile-button-border-color: var(--tile-button-border-color);\n\n// Mozilla Lilypad compatible variables\n\n/**\n PRIMARY INTERACTION\n **/\n$color-interaction-primary: var(--color-interaction-primary);\n$color-interaction-primary-hover: var(--color-interaction-primary-hover);\n$color-interaction-primary-active: var(--color-interaction-primary-active);\n$color-interaction-primary-disabled: var(--color-interaction-primary-disabled);\n$color-interaction-primary-alt: var(--color-interaction-primary-alt);\n$color-interaction-primary-alt-hover: var(--color-interaction-primary-alt-hover);\n$color-interaction-primary-alt-active: var(--color-interaction-primary-alt-active);\n$color-interaction-primary-alt-disabled: var(--color-interaction-primary-alt-disabled);\n\n/**\n SECONDARY INTERACTION\n **/\n$color-interaction-secondary: var(--color-interaction-secondary);\n$color-interaction-secondary-hover: var(--color-interaction-secondary-hover);\n$color-interaction-secondary-active: var(--color-interaction-secondary-active);\n$color-interaction-secondary-disabled: var(--color-interaction-secondary-disabled);\n$color-interaction-secondary-alt: var(--color-interaction-secondary-alt);\n$color-interaction-secondary-alt-hover: var(--color-interaction-secondary-alt-hover);\n$color-interaction-secondary-alt-active: var(--color-interaction-secondary-alt-active);\n$color-interaction-secondary-alt-disabled: var(--color-interaction-secondary-alt-disabled);\n\n/**\n SEMANTIC\n **/\n$color-semantic-info: var(--color-semantic-info);\n$color-semantic-info-hover: var(--color-semantic-info-hover);\n$color-semantic-info-active: var(--color-semantic-info-active);\n$color-semantic-disabled: var(--color-semantic-disabled);\n$color-semantic-success: var(--color-semantic-success);\n$color-semantic-success-hover: var(--color-semantic-success-hover);\n$color-semantic--success-active: var(--color-semantic-success-active);\n$color-semantic-success-disabled: var(--color-semantic-success-disabled);\n$color-semantic-warning: var(--color-semantic-warning);\n$color-semantic-warning-hover: var(--color-semantic-warning-hover);\n$color-semantic-warning-active: var(--color-semantic-warning-active);\n$color-semantic-warning-disabled: var(--color-semantic-warning-disabled);\n$color-semantic-critical: var(--color-semantic-critical);\n$color-semantic-critical-hover: var(--color-semantic-critical-hover);\n$color-semantic-critical-active: var(--color-semantic-critical-active);\n$color-semantic-critical-disabled: var(--color-semantic-critical-disabled);\n$color-semantic-critical-bg-alt: var(--color-semantic-critical-bg-alt);\n$color-semantic-neutral: var(--color-semantic-neutral);\n$color-semantic-neutral-hover: var(--color-semantic-neutral-hover);\n$color-semantic-neutral-active: var(--color-semantic-neutral-active);\n$color-semantic-neutral-inactive: var(--color-semantic-neutral-inactive);\n\n/**\n TEXT\n **/\n$color-text-main: var(--color-text-main);\n$color-text-subtle: var(--color-text-subtle);\n$color-text-reverse: var(--color-text-reverse);\n$color-text-reverse-subtle: var(--color-text-reverse-subtle);\n$color-text-disabled: var(--color-text-disabled);\n$color-text-info: var(--color-text-info);\n$color-text-success: var(--color-text-success);\n$color-text-warning: var(--color-text-warning);\n$color-text-critical: var(--color-text-critical);\n\n/**\n BORDER\n **/\n$color-border-1: var(--color-border-1);\n$color-border-2: var(--color-border-2);\n$color-border-3: var(--color-border-3);\n\n/**\n NEUTRALS\n **/\n$color-neutral-0: var(--color-neutral-0);\n$color-neutral-0-reverse: var(--color-neutral-0-reverse);\n$color-neutral-1: var(--color-neutral-1);\n$color-neutral-2: var(--color-neutral-2);\n$color-neutral-3: var(--color-neutral-3);\n\n/**\n STATUS\n **/\n$color-status-ready: var(--color-status-ready);\n$color-status-offline: var(--color-status-offline);\n$color-status-busy: var(--color-status-busy);\n\n/**\n BACKGROUNDS\n **/\n$color-background-overlay: var(--color-background-overlay);\n$color-background-callout: var(--color-background-subtle-callout);\n$color-background-modal-overlay: var(--color-background-modal-overlay);\n$color-background-critical: var(--color-background-critical);\n$color-background-neutral-0: var(--color-background-neutral-0);\n\n/**\n MENU\n **/\n$color-interactions-menu: var(--color-interactions-menu);\n$color-interactions-menu-hover: var(--color-interactions-menu-hover);\n$color-interactions-menu-inactive: var(--color-interactions-menu-inactive);\n"],sourceRoot:""}]),___CSS_LOADER_EXPORT___.locals={toolbar:"Toolbar__toolbar__YcMAi",content:"Toolbar__content__fDPmA",center_content:"Toolbar__center_content__Vdgeb",centerContent:"Toolbar__center_content__Vdgeb"};const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___}}]); |