Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://coreui.io/react/docs/components/tooltip/styling/ below:

React Tooltip Component Styling - CoreUI

Learn how to customize the React Tooltip component with CSS classes, variables, and SASS for flexible styling and seamless integration into your design.

React Tooltip supports CSS variables for easy customization. These variables are set via SASS but allow direct overrides in your stylesheets or inline styles.

--cui-tooltip-zindex: #{$zindex-tooltip};
--cui-tooltip-max-width: #{$tooltip-max-width};
--cui-tooltip-padding-x: #{$tooltip-padding-x};
--cui-tooltip-padding-y: #{$tooltip-padding-y};
--cui-tooltip-margin: #{$tooltip-margin};
@include rfs($tooltip-font-size, --cui-tooltip-font-size);
--cui-tooltip-color: #{$tooltip-color};
--cui-tooltip-bg: #{$tooltip-bg};
--cui-tooltip-border-radius: #{$tooltip-border-radius};
--cui-tooltip-opacity: #{$tooltip-opacity};
--cui-tooltip-arrow-width: #{$tooltip-arrow-width};
--cui-tooltip-arrow-height: #{$tooltip-arrow-height};

const customVars = {
  '--cui-tooltip-color': '#888',
  '--cui-tooltip-bg': '#f2f4f6',
}
return <CTooltip style={customVars}>{}</CTooltip>

$tooltip-font-size:                 $font-size-sm !default;
$tooltip-max-width:                 200px !default;
$tooltip-color:                     var(--cui-body-bg) !default;
$tooltip-bg:                        var(--cui-emphasis-color) !default;
$tooltip-border-radius:             var(--cui-border-radius) !default;
$tooltip-opacity:                   .9 !default;
$tooltip-padding-y:                 $spacer * .25 !default;
$tooltip-padding-x:                 $spacer * .5 !default;
$tooltip-margin:                    null !default; 
$tooltip-arrow-width:               .8rem !default;
$tooltip-arrow-height:              .4rem !default;
$tooltip-arrow-color:               null !default; 

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4