css: Extract common bootstrap CSS rules for textarea in settings.

This commit extracts some common bootstrap rules used for textarea
elements in settings (both organization and stream settings) and
this rules are added for settings_textarea class. We also add
settings_textarea class to the textarea elements in settings.

This change is done so we can safely remove textarea CSS rules
for bootstrap.css as a part of our process to remove bootstrap
without changing existing design.
This commit is contained in:
Sahil Batra
2022-11-25 16:42:51 +05:30
committed by Tim Abbott
parent 571f6b1e91
commit 1c0b9b8c7a
6 changed files with 30 additions and 5 deletions

View File

@@ -1664,6 +1664,31 @@ $option_title_width: 180px;
margin-bottom: 20px;
}
.settings_textarea {
color: hsl(0, 0%, 33%);
background-color: hsl(0, 0%, 100%);
border-radius: 4px;
vertical-align: middle;
border: 1px solid hsl(0, 0%, 80%);
padding: 4px 6px;
box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075);
transition: border linear 0.2s, box-shadow linear 0.2s;
&:focus {
border-color: hsla(206.5, 80%, 62%, 0.8);
outline: 0;
box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075),
0 0 8px hsla(206.5, 80%, 62%, 0.6);
}
&:disabled {
cursor: not-allowed;
background-color: hsl(0, 0%, 93%);
}
}
@media (width < $lg_min) {
.user-avatar-section,
.realm-icon-section {

View File

@@ -41,6 +41,6 @@
{{/tr}}
</p>
<p>{{t "The administrators provided the following comment:" }}</p>
<textarea class="email_field_textarea" rows="8" maxlength="2000"></textarea>
<textarea class="email_field_textarea settings_textarea" rows="8" maxlength="2000"></textarea>
</div>
</div>

View File

@@ -4,7 +4,7 @@
<div class="field_hint">{{ field.hint }}</div>
<div class="field">
{{#if is_long_text_field}}
<textarea maxlength="500" class="custom_user_field_value">{{ field_value.value }}</textarea>
<textarea maxlength="500" class="custom_user_field_value settings_textarea">{{ field_value.value }}</textarea>
{{else if is_select_field}}
<select class="custom_user_field_value">
<option value=""></option>

View File

@@ -34,7 +34,7 @@
help_link="/help/communities-directory"}}
<div class="input-group admin-realm">
<label for="realm_description">{{t "Organization description" }}</label>
<textarea id="id_realm_description" name="realm_description" class="admin-realm-description setting-widget prop-element"
<textarea id="id_realm_description" name="realm_description" class="admin-realm-description setting-widget prop-element settings_textarea"
maxlength="1000" data-setting-widget-type="string">{{ realm_description }}</textarea>
</div>
</div>

View File

@@ -9,5 +9,5 @@
{{t 'Description' }}
{{> ../help_link_widget link="/help/change-the-stream-description" }}
</label>
<textarea id="change_stream_description" maxlength="{{ max_stream_description_length }}">{{ stream_description }}</textarea>
<textarea id="change_stream_description" class="settings_textarea" maxlength="{{ max_stream_description_length }}">{{ stream_description }}</textarea>
</div>

View File

@@ -8,5 +8,5 @@
<label for="change_user_group_description">
{{t 'User group description' }}
</label>
<textarea id="change_user_group_description">{{ group_description }}</textarea>
<textarea id="change_user_group_description" class="settings_textarea">{{ group_description }}</textarea>
</div>