fix(client-UI): view button takes full width (#45964)

* added class to td so it takes full width

* added width 100% to dropbox components

* removed excessive code

* limit the max space dropdown takes

* `view` takes the same size as `show-solution`

* undo previous change

* view takes the same size as show-solution

* fix: static width for buttons on small screen

* fix: remove max-width cause iocd

Co-authored-by: moT01 <20648924+moT01@users.noreply.github.com>
This commit is contained in:
Muhammed Mustafa
2022-06-06 08:43:48 +02:00
committed by GitHub
parent 09d66c5e95
commit e7d7702e25
2 changed files with 19 additions and 16 deletions

View File

@@ -264,10 +264,10 @@ export class CertificationSettings extends Component {
return projectsMap[certName]
.map(({ link, title, id }) => (
<tr className='project-row' key={id}>
<td className='project-title col-sm-8'>
<td className='project-title col-sm-8 col-xs-8'>
<Link to={link}>{title}</Link>
</td>
<td className='project-solution col-sm-4'>
<td className='project-solution col-sm-4 col-xs-4'>
{this.getProjectSolution(id, title)}
</td>
</tr>
@@ -278,6 +278,7 @@ export class CertificationSettings extends Component {
<Button
block={true}
bsStyle='primary'
className={'col-xs-12'}
href={certLocation}
data-cy={`btn-for-${certSlug}`}
onClick={createClickHandler(certSlug)}

View File

@@ -77,20 +77,22 @@ export function SolutionDisplayWidget({
</Button>
);
const ShowMultifileProjectSolution = (
<DropdownButton
block={true}
bsStyle='primary'
className='btn-invert'
id={`dropdown-for-${id}`}
title={t('buttons.view')}
>
<MenuItem bsStyle='primary' onClick={showUserCode}>
{t('buttons.show-code')}
</MenuItem>
<MenuItem bsStyle='primary' onClick={showProjectPreview}>
{t('buttons.show-project')}
</MenuItem>
</DropdownButton>
<div className='solutions-dropdown'>
<DropdownButton
block={true}
bsStyle='primary'
className='btn-invert'
id={`dropdown-for-${id}`}
title={t('buttons.view')}
>
<MenuItem bsStyle='primary' onClick={showUserCode}>
{t('buttons.show-code')}
</MenuItem>
<MenuItem bsStyle='primary' onClick={showProjectPreview}>
{t('buttons.show-project')}
</MenuItem>
</DropdownButton>
</div>
);
const ShowProjectAndGithubLinks = (