-
-
Notifications
You must be signed in to change notification settings - Fork 72
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
notification bar enhanced #102
Conversation
✅ Deploy Preview for girlscript-asansol ready!
To edit notification comments on pull requests, go to your Netlify site settings. |
index.html
Outdated
@@ -92,9 +92,9 @@ | |||
|
|||
<!-- Dismissable notification bar --> | |||
<div class="notif-bar-btn" id="close"> | |||
<div style="display: flex;width:73%;align-items: flex-end;"> | |||
<div style="display: flex;width:73%;align-items: flex-end; justify-content: center;"><!--To center only the text and the button--> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Change align-items: flex-end
to align-items: center
to nicely centre the elements inside the notif-bar vertically.
styles.css
Outdated
@@ -33,12 +33,77 @@ body.dark { | |||
|
|||
/* general styling for dismissable alert */ | |||
.notif-bar-btn{ | |||
background-color: #FE6155; | |||
background-color: #00111c; /*mentioned color added*/ | |||
color: white; | |||
height: 3rem; | |||
display: flex; | |||
align-items: center; | |||
justify-content: flex-end; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Change justify-content: flex-end;
to justify-content: center;
,
index.html
Outdated
<div style="margin-right: 1rem;">Join us on Discord!</div> | ||
<a href="https://discord.gg/vYSspBkgNc"><Button style="background-color: rgb(54,66,86);color:white;margin-right: 1rem;border-radius: 0.5rem;">Join Discord</Button></a> | ||
<a href="https://discord.gg/vYSspBkgNc"><button class="button-61" role="button">Join Discord</button></a><!--Material UI button added--> | ||
</div> | ||
<div style="display: flex;width: 10%;justify-content: flex-end; margin-right: 1rem;"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Line 99: change style to position:fixed; right: 30px
. That should be it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@LalitChauhan27 You can now create a commit with the above changes. The PR will be updated automatically.
Hey @jay-io, can you please add the |
Related Issue
Proposed Changes
Checklist
Screenshots