-@import '_variables';
-@import '_mixins';
+@use '_variables' as *;
+@use '_mixins' as *;
.root {
display: flex;
}
-my-global-icon {
+.root > my-global-icon {
@include margin-left(10px);
height: 28px;
width: 28px;
cursor: pointer;
+ color: pvar(--mainColor);
&:hover {
color: pvar(--mainHoverColor);
}
+}
- &[iconName=search] {
- color: pvar(--mainForegroundColor);
- }
+input {
+ @include peertube-input-text(200px);
- &[iconName=cross] {
- color: pvar(--mainForegroundColor);
+ &:focus {
+ box-shadow: 0 0 5px 0 #a5a5a5;
}
}
-input {
- @include peertube-input-text(200px);
+.input-group > my-global-icon {
+ width: 20px;
}