scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 17:45:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Use the same class name, use tag selector for styling

Browse source
This commit is contained in:
Paul Kaplan 2021-05-19 15:36:23 -04:00
parent 116d640fdd
commit c039a29189
2 changed files with 18 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/views/studio/studio-description.jsx
View file

@ -33,7 +33,7 @@ const StudioDescription = ({
});
return (
<div className="studio-info-section">
{ canEditInfo ? (
{canEditInfo ? (
<React.Fragment>
<textarea
rows="20"
@ -49,7 +49,7 @@ const StudioDescription = ({
/>}
</React.Fragment>
) : (
<div className="studio-description studio-description-text">
<div className={fieldClassName}>
{decorateText(description, {
usernames: true,
hashtags: false,

35
src/views/studio/studio.scss
View file

@ -48,18 +48,6 @@ $radius: 8px;
grid-template-columns: minmax(0, 1fr);
gap: 20px;
.studio-title, .studio-description {
background: transparent;
margin: 0 -8px; /* Outset the border horizontally */
padding: 5px 8px;
border: 2px dashed $ui-blue-25percent;
border-radius: $radius;
resize: none;
width: 300px;
&:disabled { border-color: transparent; }
}
.studio-info-section {
position: relative;
.validation-message {
@ -72,20 +60,29 @@ $radius: 8px;
font-weight: 700;
}
.studio-title:disabled {
padding: 0;
margin: 0;
}
.studio-description:disabled, .studio-description-text {
.studio-description {
background: $ui-blue-10percent;
}
.studio-description-text {
padding: 15px 20px;
border-color: transparent;
border-radius: $radius;
word-wrap: break-word;
white-space: pre-wrap;
width: 300px;
box-sizing: border-box;
height: 24rem;
overflow-y: scroll;
}
/* Overrides for when title and description are editable textareas */
textarea.studio-title, textarea.studio-description {
background: transparent;
padding: 5px 8px;
border: 2px dashed $ui-blue-25percent;
border-radius: $radius;
resize: none;
width: 300px;
box-sizing: border-box;
}
.studio-follow-button {
padding-top: 14px;
padding-bottom: 14px;