Как изменить цвет текста в поле ввода материализовать в локальном файле home.scss

Framework: реагировать на рельсах CSS: МатериализоватьКак изменить цвет текста в поле ввода материализовать в локальном файле home.scss

Поэтому я использую пакет Defualt CSS материализовать и импортировать его как:

<!--Import Google Icon Font--> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
    <!-- Compiled and minified CSS --> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/css/materialize.min.css">

с скриптов в нижней части <body>:

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.0/js/materialize.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.0/moment.min.js"></script>

Вот элементы Я ищу цель:

<div className="input-field"> 
    <textarea ref="ideaTextArea" className="materialize-textarea" /> 
    <label>Trading Ideas: with TradeDesk</label> 
    <button type="submit" className="btn right blue">Share</button> 
</div>

Это CSS я добавляю целевой элемент, я хочу, чтобы изменить каталог приложений/активов/StyleSheets под home.scss:

.input-field textarea:focus + label { 
    color: #2196f3; 
} 

.row .input-field textarea:focus { 
    border-bottom: 1px solid #2196f3; 
    box-shadow: 0 1px 0 0 #2196f3; 
}

Однако, это по-прежнему делает по умолчанию материализовать turqoiuse цвет:

render

ли кто-нибудь знает, как изменить цвет текста для ввода поля на # 2196f3? Является ли мой CSS attenmpt правильным? Как я могу сохранить материализацию на местном уровне, было бы намного проще реализовать изменения css, которые я хочу?

источник

2016-12-02 Michael Roberts

Так что я нашел @ether «s ответ будет почти правильный способ достижения этой цели. Я обнаружил, что

.input-field textarea:focus + label { 
    color: #2196f3 !important; 
} 

.row .input-field textarea:focus { 
    border-bottom: 1px solid #2196f3 !important; 
    box-shadow: 0 1px 0 0 #2196f3 !important 
}

также работал. Ясно, что важно перезаписать импортированный файл materialize.css с локальными значениями - это хорошо, так как он помогает локальному css немного упростить обработку только таргетинга на определенные элементы.

источник

2016-12-03 11:16:25

Если я правильно помню, вы должны просто настроить таргетинг на ваш textarea.

Проверьте это: JSFiddle

textarea { 
color:#2196f3; 
}

источник

2016-12-02 19:21:39

Как изменить цвет текста в поле ввода материализовать в локальном файле home.scss

ответ

Смежные вопросы