misc css cleanup

This commit is contained in:
Collin Barrett 2018-03-24 11:32:25 -05:00
parent 94f01b2731
commit adaeb4e892
2 changed files with 36 additions and 20 deletions

View file

@ -33,7 +33,7 @@ export default class ListDetails extends React.Component<any, any> {
}
function FilterListDetails(props: any) {
return <div className="panel panel-default">
return <div className="panel panel-default panel-list-details">
<Description description={props.details.description} url={props.details.descriptionSourceUrl}/>
<Languages languages={props.details.languages}/>
<PublishedDate date={props.details.publishedDate}/>
@ -84,21 +84,23 @@ function DiscontinuedDate(props: any) {
function SubscribeUrl(props: any) {
return <a href={`abp:subscribe?location=${encodeURIComponent(props.url)}&amp;title=${encodeURIComponent(props.name)}`}
className="visible-xs btn btn-primary btn-bloc"
className="visible-xs btn btn-primary btn-bloc btn-expander-link"
title={ `Subscribe to ${props.name} with browser extension supporting \"abp:\" protcool (e.g. uBlock Origin, AdBlock Plus).` }>
Subscribe
</a >;
}
function ViewUrl(props: any) {
return <a href={props.url} className="btn btn-primary btn-block" title={`View ${props.name} in its raw format.`}>
return <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`View ${props.name} in its raw format.`}>
View
</a>;
}
function HomeUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block" title={`View the home page for ${props.name}.`}>
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`View the home page for ${props.name}.`}>
Home
</a>
: null;
@ -106,7 +108,7 @@ function HomeUrl(props: any) {
function PolicyUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block"
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`View the policy for which rules ${props.name} includes.`}>
Policy
</a>
@ -115,7 +117,8 @@ function PolicyUrl(props: any) {
function DonateUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block" title={`Donate to support ${props.name}.`}>
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`Donate to support ${props.name}.`}>
Donate
</a>
: null;
@ -123,7 +126,8 @@ function DonateUrl(props: any) {
function IssuesUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block" title={`View the GitHub Issues for ${props.name}.`}>
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`View the GitHub Issues for ${props.name}.`}>
GitHub Issues
</a>
: null;
@ -131,7 +135,8 @@ function IssuesUrl(props: any) {
function ForumUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block" title={`View the forum for ${props.name}.`}>
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`View the forum for ${props.name}.`}>
Forum
</a>
: null;
@ -139,7 +144,8 @@ function ForumUrl(props: any) {
function ChatUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block" title={`Enter the chat room for ${props.name}.`}>
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`Enter the chat room for ${props.name}.`}>
Chat
</a>
: null;
@ -147,7 +153,7 @@ function ChatUrl(props: any) {
function SubmissionUrl(props: any) {
return props.url
? <a href={props.url} className="btn btn-primary btn-block"
? <a href={props.url} className="btn btn-primary btn-block btn-expander-link"
title={`Submit a new rule to be included in ${props.name}.`}>
Submit New Rule
</a>
@ -156,7 +162,8 @@ function SubmissionUrl(props: any) {
function EmailAddress(props: any) {
return props.email
? <a href={`mailto:${props.email}`} className="btn btn-primary btn-block" title={`Email ${props.name}.`}>
? <a href={`mailto:${props.email}`} className="btn btn-primary btn-block btn-expander-link"
title={`Email ${props.name}.`}>
Email
</a>
: null;
@ -165,21 +172,21 @@ function EmailAddress(props: any) {
function Maintainers(props: any) {
return props.maintainers.length > 0
? <div>
{props.maintainers.map(
(maintainer: any) => <Maintainer maintainer={maintainer} key={maintainer.id.toString()}/>)}
{props.maintainers.map(
(maintainer: any) => <Maintainer maintainer={maintainer} key={maintainer.id.toString()}/>)}
</div>
: null;
}
function Maintainer(props: any) {
return <div className="panel panel-default">
return <div className="panel panel-default panel-maintainer">
<div className="panel-heading">
<h4 className="panel-title">Maintained by {props.maintainer.name}</h4>
</div>
<div className="panel-body">
{props.maintainer.homeUrl
? <p>
<a href={props.maintainer.homeUrl} className="btn btn-primary btn-block"
<a href={props.maintainer.homeUrl} className="btn btn-primary btn-block btn-expander-link"
title={`View the home page of ${props.maintainer.name}.`}>
Home
</a>
@ -188,7 +195,7 @@ function Maintainer(props: any) {
{props.maintainer.emailAddress
? <p>
<a href={`mailto:${props.maintainer.emailAddress}`}
className="btn btn-primary btn-block"
className="btn btn-primary btn-block btn-expander-link"
title={`Email ${props.maintainer.name}.`}>
Email
</a>
@ -197,7 +204,7 @@ function Maintainer(props: any) {
{props.maintainer.twitterHandle
? <p>
<a href={`https://twitter.com/${props.maintainer.twitterHandle}`}
className="btn btn-primary btn-block"
className="btn btn-primary btn-block btn-expander-link"
title={`View the Twitter page of ${props.maintainer.name}.`}>
Twitter
</a>

View file

@ -2,15 +2,24 @@ body, h2, h3, h4, h5, blockquote {
font-size: 16px;
}
.panel {
.rt-tr {
-ms-align-items: center;
-o-align-items: center;
-webkit-align-items: center;
align-items: center;
}
.panel-list-details {
padding: 20px;
margin-bottom: 0;
}
.panel-default {
.panel-maintainer {
padding: 20px;
margin-bottom: 0;
}
.btn-block {
.btn-expander-link {
margin-top: 0;
margin-bottom: 5px;
}