- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在为我的 Angular 应用程序创建自定义主题。然后我尝试设置 bootstrap 的重启,为所有非物质元素设置一个基本起点。由于 reboot 使用了很多与 Material 重叠的变量,我把它变成了一个 mixin,我将我创建的主题传递给它,并在其中尝试提取所需的值(例如字体系列或颜色)。
主题.scss:
$wb-theme: mat.define-dark-theme((
color: (
primary: $wb-primary,
accent: $wb-accent,
warn: $wb-warn,
)
));
@include mat.all-component-themes($wb-theme);
@include reboot.theme($wb-theme);
_reboot.scss
@mixin theme($theme) {
$typography-config: mat.get-typography-config($theme);
$color-config: mat.get-color-config($theme);
$primary-palette: map.get($color-config, primary);
body {
font-family: mat.font-family($typography-config);
color: mat.get-color-from-palette($primary-palette, 50);
}
}
设置颜色工作正常,但字体系列行在 Angular _typography-utils.scss 中抛出异常,说明 SassError: $map: null is not a map.
in line 46 │ $font-family: map.get($config, font-family);
我注意到 mat.get-typography-config($theme);
返回 null,因为显然我的主题不包含键 typography
而我确实不将默认值作为第二个参数传递。我测试了 map.has-key($theme, typography)
的返回值,它确实返回了 false
。
@angular_theming.scss:
/// Gets the typography configuration from the given theme or configuration.
/// For backwards compatibility, typography is not included by default.
/// @param {Map} $theme-or-config The theme map returned from `define-light-theme` or
/// `define-dark-theme`.
/// @param {Map} $default The default value returned if the given `$theme` does not include a
/// `typography` configuration.
/// @returns {Map} Typography configuration for a theme.
@function get-typography-config($theme-or-config, $default: null) {
// If a configuration has been passed, return the config directly.
@if not private-is-theme-object($theme-or-config) {
@return $theme-or-config;
}
// In case a theme has been passed, extract the configuration if present,
// or fall back to the default typography config.
@if (map.has-key($theme-or-config, typography)) {
@return map.get($theme-or-config, typography);
}
@return $default;
}
然而,根据文件中的评论,我应该能够传入我用 define-dark-theme
创建的 $wb-theme
并获得排版配置回来。由于我没有专门创建一个排版,我假设我会得到一个默认的排版,但没有,我没有得到任何东西。
但是,它确实声明默认情况下并未排除排版。因此,我尝试创建一个默认版式,但我绝对无法找到如何将此版式添加到我的主题中,以便稍后再次提取它。 define-dark-theme
函数不包含排版参数,但只允许传递三种调色板。
@angular_theming.scss:
@function define-dark-theme($primary, $accent: null, $warn: define-palette(palette.$red-palette)) { ... }
我试图只创建默认排版并将其放入 mat.core
函数中,希望这可以将其设置在变量中的某处(默认值或其他东西,也许?),主题然后创建访问但不,这没有做任何事情;我的主题仍然没有排版。我尝试在调用 define-dark-theme
和 all-component-themes
之前和之后进行设置,但无济于事。
主题.scss:
$wb-typography-config: mat.define-typography-config();
@include mat.core($wb-typography-config);
$wb-theme: mat.define-dark-theme(...);
@include mat.all-component-themes($wb-theme);
@include reboot.theme($wb-theme);
或
$wb-theme: mat.define-dark-theme(...);
$wb-typography-config: mat.define-typography-config();
@include mat.all-component-themes($wb-theme);
@include mat.core($wb-typography-config);
@include reboot.theme($wb-theme);
无论是谷歌还是任何排版指南都没有任何帮助,因为它们都没有真正在主题中设置排版,但 Material 功能在我面前尖叫着说是的,那个该死的主题应该有一个排版。那么这里发生了什么?如何在我的主题中加入排版,以便 get-typography-config($theme)
实际上返回排版配置?我是不是陷入了过时的想法,整个功能都不再使用了?那么我将如何做到这一点,我必须设置和访问什么?不过,我更喜欢在我的主题中使用排版。
最佳答案
您只需要在创建主题 map 时将排版配置添加到主题 map 中即可。
$theme-or-config: mat.define-light-theme(
(
color: (
primary: $wb-primary,
accent: $wb-accent,
warn: $wb-warn,
),
typography: $wb-typography-config
)
);
关于angular - 如何将字体排版到我的 Angular Material 主题中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68931291/
我需要将文本放在 中在一个 Div 中,在另一个 Div 中,在另一个 Div 中。所以这是它的样子: #document Change PIN
奇怪的事情发生了。 我有一个基本的 html 代码。 html,头部, body 。(因为我收到了一些反对票,这里是完整的代码) 这是我的CSS: html { backgroun
我正在尝试将 Assets 中的一组图像加载到 UICollectionview 中存在的 ImageView 中,但每当我运行应用程序时它都会显示错误。而且也没有显示图像。 我在ViewDidLoa
我需要根据带参数的 perl 脚本的输出更改一些环境变量。在 tcsh 中,我可以使用别名命令来评估 perl 脚本的输出。 tcsh: alias setsdk 'eval `/localhome/
我使用 Windows 身份验证创建了一个新的 Blazor(服务器端)应用程序,并使用 IIS Express 运行它。它将显示一条消息“Hello Domain\User!”来自右上方的以下 Ra
这是我的方法 void login(Event event);我想知道 Kotlin 中应该如何 最佳答案 在 Kotlin 中通配符运算符是 * 。它指示编译器它是未知的,但一旦知道,就不会有其他类
看下面的代码 for story in book if story.title.length < 140 - var story
我正在尝试用 C 语言学习字符串处理。我写了一个程序,它存储了一些音乐轨道,并帮助用户检查他/她想到的歌曲是否存在于存储的轨道中。这是通过要求用户输入一串字符来完成的。然后程序使用 strstr()
我正在学习 sscanf 并遇到如下格式字符串: sscanf("%[^:]:%[^*=]%*[*=]%n",a,b,&c); 我理解 %[^:] 部分意味着扫描直到遇到 ':' 并将其分配给 a。:
def char_check(x,y): if (str(x) in y or x.find(y) > -1) or (str(y) in x or y.find(x) > -1):
我有一种情况,我想将文本文件中的现有行包含到一个新 block 中。 line 1 line 2 line in block line 3 line 4 应该变成 line 1 line 2 line
我有一个新项目,我正在尝试设置 Django 调试工具栏。首先,我尝试了快速设置,它只涉及将 'debug_toolbar' 添加到我的已安装应用程序列表中。有了这个,当我转到我的根 URL 时,调试
在 Matlab 中,如果我有一个函数 f,例如签名是 f(a,b,c),我可以创建一个只有一个变量 b 的函数,它将使用固定的 a=a1 和 c=c1 调用 f: g = @(b) f(a1, b,
我不明白为什么 ForEach 中的元素之间有多余的垂直间距在 VStack 里面在 ScrollView 里面使用 GeometryReader 时渲染自定义水平分隔线。 Scrol
我想知道,是否有关于何时使用 session 和 cookie 的指南或最佳实践? 什么应该和什么不应该存储在其中?谢谢! 最佳答案 这些文档很好地了解了 session cookie 的安全问题以及
我在 scipy/numpy 中有一个 Nx3 矩阵,我想用它制作一个 3 维条形图,其中 X 轴和 Y 轴由矩阵的第一列和第二列的值、高度确定每个条形的 是矩阵中的第三列,条形的数量由 N 确定。
假设我用两种不同的方式初始化信号量 sem_init(&randomsem,0,1) sem_init(&randomsem,0,0) 现在, sem_wait(&randomsem) 在这两种情况下
我怀疑该值如何存储在“WORD”中,因为 PStr 包含实际输出。? 既然Pstr中存储的是小写到大写的字母,那么在printf中如何将其给出为“WORD”。有人可以吗?解释一下? #include
我有一个 3x3 数组: var my_array = [[0,1,2], [3,4,5], [6,7,8]]; 并想获得它的第一个 2
我意识到您可以使用如下方式轻松检查焦点: var hasFocus = true; $(window).blur(function(){ hasFocus = false; }); $(win
我是一名优秀的程序员,十分优秀!