@import "themes/light"; /** * Style variables */ $baseFontFamily: 'open_sanslight', 'Helvetica Neue', Helvetica, Arial, sans-serif; $hangupColor: #bf2117; $hangupFontSize: 2em; /** * Size variables. */ // Video layout. $thumbnailToolbarHeight: 22px; $thumbnailIndicatorBorder: 2px; $thumbnailIndicatorSize: $thumbnailToolbarHeight; $thumbnailVideoMargin: 2px; $thumbnailsBorder: 2px; $thumbnailVideoBorder: 2px; $filmstripToggleButtonWidth: 17px; /** * Color variables. */ $defaultColor: #F1F1F1; $defaultSideBarFontColor: #44A5FF; $defaultSemiDarkColor: #ACACAC; $defaultDarkColor: #2b3d5c; $tooltipBg: rgba(0,0,0, 0.7); /** * Toolbar */ $defaultToolbarSize: 50px; $splitterToolbarButtonMargin: 18px; $toolbarBackground: rgba(0, 0, 0, 0.5); $toolbarBadgeBackground: #165ECC; $toolbarBadgeColor: #FFFFFF; $toolbarFontSize: 1.9em; $toolbarSelectBackground: rgba(0, 0, 0, .6); $toolbarTitleColor: #FFFFFF; $toolbarTitleFontSize: 19px; $toolbarToggleBackground: #12499C; /** * Main controls * TODO: looks like we don't use it */ $inputSemiBackground: rgba(132, 132, 132, .8); $inputLightBackground: #EBEBEB; /** * Video layout */ $videoThumbnailHovered: rgba(22, 94, 204, .4); $videoThumbnailSelected: #165ECC; $participantNameColor: #fff; $thumbnailPictogramColor: #fff; $dominantSpeakerBg: #165ecc; $raiseHandBg: #D6D61E; $audioLevelBg: #44A5FF; $connectionIndicatorBg: #165ecc; $audioLevelShadow: rgba(9, 36, 77, 0.9); $videoStateIndicatorColor: $defaultColor; $videoStateIndicatorBackground: $toolbarBackground; /** * Feedback Modal */ $feedbackContentBg: #fff; $feedbackInputBg: #fff; $feedbackTextColor: #000; $feedbackInputTextColor: #333; $feedbackInputPlaceholderColor: #777; $rateStarLabelColor: #333; $rateStarDefault: #ccc; $rateStarActivity: #165ecc; $rateStarSize: 34px; /** * Modals */ $modalButtonFontSize: 14px; $modalTextColor: #333; /** * Notifications */ $notificationFontSize: 13px; $notificationColor: #FFFFFF; $notificationBackground: $tooltipBg; $notificationTitleColor: $notificationColor; $notificationMessageColor: $notificationColor; $notificationLinkColor: $notificationColor; $notificationOpacity: 0.9; $notificationPadding: 15px 20px; $notificationBorderRadius: 4px; $notificationWidth: 215px; /** * Misc. */ $borderRadius: 4px; $defaultWatermarkLink: '../images/watermark.png'; $sidebarWidth: 220px; $popoverMenuPadding: 13px; $happySoftwareBackground: transparent; /** * Z-indexes. TODO: Replace this by a function. */ $zindex0: 0; $zindex1: 1; $zindex2: 2; $zindex3: 3; $filmstripVideosZ: 5; $zindex10: 10; $reloadZ: 20; $poweredByZ: 100; $ringingZ: 300; $sideToolbarContainerZ: 300; $toolbarZ: 400; $tooltipsZ: 401; $dropdownMaskZ: 900; $dropdownZ: 901; $overlayZ: 902; $jitsipopoverZ: 1010; $centeredVideoLabelZ: 1011; $notificationZ: 1012; $popoverZ: 1015; /** * Font Colors */ $defaultFontColor: #777; $defaultLightFontColor: #F1F1F1; $defaultDarkFontColor: #000; /** * Forms */ //inputs $inputControlEmColor: #f29424; //buttons $linkFontColor: #489afe; $linkHoverFontColor: #287ade; /** * Unsupported browser */ $primaryUnsupportedBrowserButtonBgColor: #17a0db; $unsupportedBrowserButtonBgColor: #ff9a00; $unsupportedBrowserTextColor: #4a4a4a; $unsupportedBrowserTextSmallFontSize: 17px; $unsupportedBrowserTitleColor: #fff; $unsupportedBrowserTitleFontSize: 24px; $unsupportedDesktopBrowserTextColor: rgba(255, 255, 255, 0.7); $unsupportedDesktopBrowserTextFontSize: 21px;