html - 将元素划分为组件后无法正确放置元素（Angular）

Question

我对css布局有点菜鸟。所以我有一个侧边栏和 app-root 都放在 index.html 文件中，你可以在存储库的主分支中看到： https ://github.com/Ghevi/Angular-BugTracker/tree/master

它还不完美，但它是一些东西：https ://imgur.com/a/jGUjhct

导航栏动画很好，当导航栏悬停并打开时，主要内容向右移动。

因此，我尝试将所有内容移动到正确的组件中，并将#wrapper #left #right 样式放置在 app.component.css 中以应用于 app.component.html 的选择器中。

但现在比以往任何时候都更加破碎：https ://imgur.com/a/GZR5fXp

https://github.com/Ghevi/Angular-BugTracker/tree/broken

我不明白为什么除了显示在另一个之上的组件之外，导航栏现在还缺少背景颜色和动画，即使我将其代码复制粘贴到正确的组件中也是如此。

作为参考，导航栏是这个：https ://www.youtube.com/watch?v=biOMz4puGt8

我知道这个问题已经加载并且有点模糊，但我现在真的迷路了。

标签： htmlcssangular