bida/bastodon
6
0
انشعاب 0
کد مسائل 7 تقاضاهای واکشی انتشارها دانشنامه فعالیت

Fix domain blocks on about page not working well on small screens in web UI (#20391)

فهرست منبع
This commit is contained in:
Eugen Rochko 2022-11-11 08:26:58 +01:00 کامیت شده توسط GitHub
والد 36bc90e8aa
کامیت 6774c339b2
هیچ کلید شناخته شده ای برای این امضا در پایگاه داده ها یافت نشد
شناسه کلید GPG: 4AEE18F83AFDEB23
2فایلهای تغییر یافته به همراه45 افزوده شده و 35 حذف شده
نمایش وضعیت دانلود پرونده وصله دانلود فایل تغییرات diff Expand all files Collapse all files

29
app/javascript/mastodon/features/about/index.js
مشاهده پرونده

@ -183,25 +183,18 @@ class About extends React.PureComponent {
<>
<p><FormattedMessage id='about.domain_blocks.preamble' defaultMessage='Mastodon generally allows you to view content from and interact with users from any other server in the fediverse. These are the exceptions that have been made on this particular server.' /></p>
<table className='about__domain-blocks'>
<thead>
<tr>
<th><FormattedMessage id='about.domain_blocks.domain' defaultMessage='Domain' /></th>
<th><FormattedMessage id='about.domain_blocks.severity' defaultMessage='Severity' /></th>
<th><FormattedMessage id='about.domain_blocks.comment' defaultMessage='Reason' /></th>
</tr>
</thead>
<div className='about__domain-blocks'>
{domainBlocks.get('items').map(block => (
<div className='about__domain-blocks__domain' key={block.get('domain')}>
<div className='about__domain-blocks__domain__header'>
<h6><span title={`SHA-256: ${block.get('digest')}`}>{block.get('domain')}</span></h6>
<span className='about__domain-blocks__domain__type' title={intl.formatMessage(severityMessages[block.get('severity')].explanation)}>{intl.formatMessage(severityMessages[block.get('severity')].title)}</span>
</div>
<tbody>
{domainBlocks.get('items').map(block => (
<tr key={block.get('domain')}>
<td><span title={`SHA-256: ${block.get('digest')}`}>{block.get('domain')}</span></td>
<td><span title={intl.formatMessage(severityMessages[block.get('severity')].explanation)}>{intl.formatMessage(severityMessages[block.get('severity')].title)}</span></td>
<td>{block.get('comment')}</td>
</tr>
))}
</tbody>
</table>
<p>{block.get('comment').length > 0 ? block.get('comment') : <FormattedMessage id='about.domain_blocks.no_reason_available' defaultMessage='Reason not available' />}</p>
</div>
))}
</div>
</>
) : (
<p><FormattedMessage id='about.not_available' defaultMessage='This information has not been made available on this server.' /></p>

51
app/javascript/styles/mastodon/components.scss
مشاهده پرونده

@ -8557,28 +8557,45 @@ noscript {
&__domain-blocks {
margin-top: 30px;
width: 100%;
border-collapse: collapse;
break-inside: auto;
background: darken($ui-base-color, 4%);
border: 1px solid lighten($ui-base-color, 4%);
border-radius: 4px;
th {
text-align: left;
font-weight: 500;
&__domain {
border-bottom: 1px solid lighten($ui-base-color, 4%);
padding: 10px;
font-size: 15px;
color: $darker-text-color;
}
thead tr,
tbody tr {
border-bottom: 1px solid lighten($ui-base-color, 8%);
}
&:nth-child(2n) {
background: darken($ui-base-color, 2%);
}
tbody tr:last-child {
border-bottom: 0;
}
&:last-child {
border-bottom: 0;
}
th,
td {
padding: 8px;
&__header {
display: flex;
gap: 10px;
justify-content: space-between;
font-weight: 500;
margin-bottom: 4px;
}
h6 {
color: $secondary-text-color;
font-size: inherit;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
}