html - 如何使用 if 语句在 SCSS 中查找类名？

Question

我有两个不同的课程。一个是管理员，一个是用户。

<div class="admin"> ... </div>
<div class="user"> ... </div>

$color : red !default;

@if('.admin'){
    $color : red;
} @else {
    $color : green;
}

input{
    border-color : $color;
    color : $color;
}

div{
    background : $color;
}

我想做输入边框颜色动态。如果父类是 admin，则输入边框颜色为白色，如果父类为 user，则输入边框颜色为黑色。

这只是一个例子，在我的项目中有两种类型的登录，并且想在使用父类时改变很多东西。

Answer 1

.admin{ 
    background : red; 
    input{
        border-color:#fff;
    }
}
.user{ 
    background : red; 
    input{
        border-color:#000;
    }
}

Answer 2

您可以像这样嵌套这些类。“&”表示如果父类是 this（管理员或用户），让输入有 this border-color。对我来说，我可以说我会为admin然后做我的 css input，如果有任何条件，比如如果父母不在了，我会修改的外观input，我将它们嵌套在一个地方，以便为那个特定的 id、类或直接标记。

.admin { 
  background : red; 
}

.user { 
  background : green; 
}

input {
  border-color: deepskyblue;

  .admin & {
    border-color: white;
  }

  .user & {
    border-color: black;
  }
}