Convert generic overlay css from px to rem. (#109)

This commit is contained in:
Daniel Scalzi 2020-09-13 19:05:29 -04:00
parent 0cbd39b79c
commit 043f85c0dc
No known key found for this signature in database
GPG Key ID: D18EA3FB4B142A57
2 changed files with 17 additions and 16 deletions

View File

@ -303,11 +303,11 @@ class Application extends React.Component<InternalApplicationProps, ApplicationS
// console.log(serverStatus) // console.log(serverStatus)
// } // }
// }) // })
// this.props.pushGenericOverlay({ this.props.pushGenericOverlay({
// title: 'Test Title 2', title: 'Test Title 2',
// description: 'Test Description', description: 'Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.',
// dismissible: true dismissible: true
// }) })
// this.props.pushGenericOverlay({ // this.props.pushGenericOverlay({
// title: 'Test Title IMPORTANT', // title: 'Test Title IMPORTANT',
// description: 'Test Description', // description: 'Test Description',

View File

@ -5,10 +5,10 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
/*justify-content: space-between;*/ /*justify-content: space-between;*/
width: 300px; width: 20rem;
/*height: 35%;*/ /*height: 35%;*/
box-sizing: border-box; box-sizing: border-box;
padding: 15px 0px; padding: 1rem 0;
/* background-color: #424242; */ /* background-color: #424242; */
text-align: center; text-align: center;
} }
@ -31,19 +31,19 @@
/* Add spacing between overlay content elements. */ /* Add spacing between overlay content elements. */
#overlayContent > *:first-child { #overlayContent > *:first-child {
margin-top: 0px !important; margin-top: 0 !important;
} }
#overlayContent > *:last-child { #overlayContent > *:last-child {
margin-bottom: 0px !important; margin-bottom: 0 !important;
} }
#overlayContent > * { #overlayContent > * {
margin: 8px 0px; margin: 0.5rem 0;
} }
/* Overlay title styles. */ /* Overlay title styles. */
#overlayTitle { #overlayTitle {
font-family: 'Avenir Medium'; font-family: 'Avenir Medium';
font-size: 20px; font-size: 1.25rem;
font-weight: bold; font-weight: bold;
letter-spacing: 1px; letter-spacing: 1px;
-webkit-user-select: initial; -webkit-user-select: initial;
@ -51,7 +51,7 @@
/* Overlay description styles. */ /* Overlay description styles. */
#overlayDesc { #overlayDesc {
font-size: 12px; font-size: .75rem;
font-weight: bold; font-weight: bold;
-webkit-user-select: initial; -webkit-user-select: initial;
} }
@ -71,13 +71,14 @@
font-family: 'Avenir Medium'; font-family: 'Avenir Medium';
font-weight: bold; font-weight: bold;
border-radius: 2px; border-radius: 2px;
padding: 0px 8.1px; padding: 0 0.5rem;
cursor: pointer; cursor: pointer;
transition: 0.25s ease; transition: 0.25s ease;
font-size: 0.875rem;
} }
#overlayAcknowledge:hover, #overlayAcknowledge:hover,
#overlayAcknowledge:focus { #overlayAcknowledge:focus {
box-shadow: 0px 0px 10px 0px #fff; box-shadow: 0 0 0.625rem 0 #fff;
outline: none; outline: none;
} }
#overlayAcknowledge:active { #overlayAcknowledge:active {
@ -88,9 +89,9 @@
/* Overlay dismiss option styles. */ /* Overlay dismiss option styles. */
#overlayDismiss { #overlayDismiss {
font-weight: bold; font-weight: bold;
font-size: 10px; font-size: 0.625rem;
text-decoration: none; text-decoration: none;
padding-top: 2.5px; padding-top: 0.15625rem;
background: none; background: none;
border: none; border: none;
outline: none; outline: none;