Skip to content
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

Fix #21 styling #105

Open
wants to merge 13 commits into
base: master
Choose a base branch
from
Open
12 changes: 11 additions & 1 deletion mysite/templates/Login.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,24 @@

<style>

.login-main {
min-height: 76vh;
display: grid;
place-content: center;
}

.login-body{
background-color: rgb(30, 30, 30);
box-shadow: 13px 4px 19px 7px rgb(19 17 17);
border-radius: 40px;
color: white;
max-width: 450px;
min-width: 450px;
padding: 15px;
margin: auto;
display: flex;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey this is just work around not a generic solution as this problem persists with sign up page as well. we need to write some css logic to footer itself.
image

flex-direction: column;
justify-content: center;
align-items: center;
}

.login-head{
Expand Down
12 changes: 7 additions & 5 deletions mysite/templates/main_index.html
Original file line number Diff line number Diff line change
Expand Up @@ -214,14 +214,16 @@ <h4 class="modal-title" id="ad-title">Calcont Whiteboard</h4>
</script>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3911342542125154" crossorigin="anonymous"></script>
<!-- recommend-calcont-adunit -->
<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3911342542125154" data-ad-slot="3259871936" data-ad-format="auto" data-full-width-responsive="true"></ins>
<script>
;(adsbygoogle = window.adsbygoogle || []).push({})
</script>
<div class="add-container">
abhinab-choudhury marked this conversation as resolved.
Show resolved Hide resolved
<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3911342542125154" data-ad-slot="3259871936" data-ad-format="auto" data-full-width-responsive="true"></ins>
<script>
;(adsbygoogle = window.adsbygoogle || []).push({})
</script>
<div>
<script src="/static/js/utils.js"></script>
<script src="/static/js/main.js"></script>
{% block JS %}

{% endblock %}
</body>
</html>
</html>
321 changes: 167 additions & 154 deletions staticfiles/css/main.css
Original file line number Diff line number Diff line change
@@ -1,154 +1,167 @@

@import url('https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css');

html {
scroll-behavior: smooth;
}

a {
color: #6c859a;
}

body {
background-color: rgb(25, 25, 25);
}

navbar {
background-color: rgb(5, 5, 5);
}

thead {
background-color: #2f6794;
color: #a1b0bb;
}

tbody {
background-color: #1c2023;
}

/* width */
::-webkit-scrollbar {
width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px #362f2f;
border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: #333538;
border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #333538;
}

.btn {
padding: 0.5rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
}

.btn-outline-secondary {
padding: 0.5rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
background-color: #313233;
}

.trae {
padding: 0.8rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
background-color: #3879ba;
}

.content-bg {
background-color: rgb(30, 30, 30);
box-shadow: 13px 4px 19px 7px rgb(19 17 17);
border-radius: 20px;
}

@media only screen and (max-width: 500px) and (min-width: 200px) {
#AlertS {
font-size: 14px;
}

.radio-text {
font-size: 12px;
}
}

#baktop {
right: 10px;
margin-top: 500px;
position: fixed;
}

.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}

.brand {
border: 1px solid black;
border-radius: 50px;
}

.dropdown-menu {
background-color: rgb(25, 25, 25);
border: 1.5px solid white;
border-radius: 10px;
color: blanchedalmond;
}

.dropdown-item {
color: white;
}

.footer {
position: absolute;
}

.modelText {
font-size: 18px;
}

.form-component {
color: white;
background-color: #191717;
border: 2px solid #141414;
border-radius: 10px;
}

.form-component:focus {
color: white;
background-color: #191717;
border: 2px solid #141414;
border-radius: 10px;
}

.form-component[readonly]{
background-color: #191717;
}

@import url('https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css');

html {
scroll-behavior: smooth;
}

a {
color: #6c859a;
}
abhinab-choudhury marked this conversation as resolved.
Show resolved Hide resolved

body {
background-color: rgb(25, 25, 25);
}

navbar {
background-color: rgb(5, 5, 5);
}

abhinab-choudhury marked this conversation as resolved.
Show resolved Hide resolved
thead {
background-color: #2f6794;
color: #a1b0bb;
}

tbody {
background-color: #1c2023;
}

/* width */
::-webkit-scrollbar {
width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px #362f2f;
border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: #333538;
border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #333538;
}

.btn {
padding: 0.5rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
}

.btn-outline-secondary {
padding: 0.5rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
background-color: #313233;
}

.trae {
padding: 0.8rem 1.8rem;
border: none;
font-size: 1rem;
border-radius: 2rem;
box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.8);
background-color: #3879ba;
}

.content-bg {
background-color: rgb(30, 30, 30);
box-shadow: 13px 4px 19px 7px rgb(19 17 17);
border-radius: 20px;
}

.add-container {
display: flex;
justify-content: center;
align-items: center;
}

.add-container>body {
display: flex;
justify-content: center;
align-items: center;
}

@media only screen and (max-width: 500px) and (min-width: 200px) {
#AlertS {
font-size: 14px;
}

.radio-text {
font-size: 12px;
}
}

#baktop {
right: 10px;
margin-top: 500px;
position: fixed;
}

.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}

.brand {
border: 1px solid black;
border-radius: 50px;
}

.dropdown-menu {
background-color: rgb(25, 25, 25);
border: 1.5px solid white;
border-radius: 10px;
color: blanchedalmond;
}

.dropdown-item {
color: white;
}

.footer {
position: absolute;
}

.modelText {
font-size: 18px;
}

.form-component {
color: white;
background-color: #191717;
border: 2px solid #141414;
border-radius: 10px;
}

.form-component:focus {
color: white;
background-color: #191717;
border: 2px solid #141414;
border-radius: 10px;
}

.form-component[readonly]{
background-color: #191717;
}