Madiator2011/FreeCompetitors
1
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

made less ugly

Browse source
This commit is contained in:
Madiator2011 2024-04-29 18:19:03 +02:00
parent 838ac5719d
commit 9da1d34ea7
1 changed files with 97 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

132
default.css
View file

@ -5,16 +5,15 @@ This file could be used under both CC-BY-SA 4.0 or at your chosing GNU GPLv3 or
html {} html {}
* { * {
background-color: #311a46; background-color: #1a1a1a; /* Dark background color */
font-size: 20px; font-size: 20px;
list-style-type: none; list-style-type: none;
} }
body{ body{
color: #95bcf2; color: #e0e0e0; /* Light text color */
font-family:Open Sans; font-family: Open Sans, sans-serif;
font-weight: bold; font-weight: normal;
margin-top: 5%; margin-top: 5%;
margin-bottom: 5%; margin-bottom: 5%;
@ -38,17 +37,17 @@ pre {
h1 { h1 {
font-size: 30px; font-size: 30px;
color: #CC35F0; color: #4fc3f7; /* Bright accent color */
} }
h2 { h2 {
font-size: 25px; font-size: 25px;
color: #FFFFFF; color: #ffffff;
} }
h3 { h3 {
font-size: 22px; font-size: 22px;
color: #3798DD; color: #03a9f4; /* Complementary accent color */
} }
code { code {
@ -74,12 +73,12 @@ th,td {
} }
a { a {
color: #C648EA; color: #4fc3f7;
text-decoration: none; text-decoration: none;
} }
a:hover { a:hover {
color: #DB82F4; color: #b3e5fc; /* Lighter hover color */
text-decoration: none; text-decoration: none;
} }
@ -87,40 +86,36 @@ img {
max-width: 50%; max-width: 50%;
height: auto; height: auto;
} }
input[type=text] {
input[type=text], button, .button {
padding: 12px 20px; padding: 12px 20px;
margin: 8px 0; margin: 8px 0;
box-sizing: border-box; box-sizing: border-box;
border: 0px solid black; border: 0px solid black;
background-color: #b058c6; background-color: #424242; /* Dark button background */
color: #311a46; color: #e0e0e0;
font-weight: bold; font-weight: bold;
} }
button, .button {
padding: 12px 20px;
margin: 8px 0;
box-sizing: border-box;
border: 0px solid black;
background-color: #b058c6;
color: #311a46;
font-weight: bold;
}
.button { line-height: 3 } .button { line-height: 3 }
summary { summary {
color: #b058c6; color: #4fc3f7;
font-weight: bold; font-weight: bold;
} }
summary:hover, summary:hover > h1 { summary:hover, summary:hover > h1 {
color: white; color: #b3e5fc;
cursor: pointer; cursor: pointer;
} }
button:hover, input:hover, button:focus, input:focus, .button:hover, .button:focus { button:hover, input:hover, button:focus, input:focus, .button:hover, .button:focus {
background-color: #3798DD; background-color: #03a9f4;
color: white; color: #ffffff;
} }
hr { hr {
border-top: 1px solid #b058c6; border-top: 1px solid #4fc3f7;
} }
p { p {
@ -159,13 +154,80 @@ If a screen is at least 1024 pixels wide, we do some more things.
/* prgoress bar theme */ /* prgoress bar theme */
.back_progress {background-color: #543ba3; .back_progress {
width: 100%; background-color: #424242;
height: 7} width: 100%;
.back_progress:hover { height: 7px;
background-color: #CC35F0;
} }
.front_progress {background-color: #96bbe8;
height: 7}
.back_progress:hover {
background-color: #4fc3f7;
} }
.front_progress {
background-color: #03a9f4;
height: 7px;
}
/* Footer styles */
footer {
padding: 20px 0;
text-align: center;
}
footer .container {
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
}
footer p {
color: #e0e0e0;
margin-bottom: 10px;
}
.button-group {
background-color: transparent;
padding: 0;
margin: 0;
}
.button-group a.button {
padding: 8px 15px;
margin: 5px;
background-color: #4fc3f7;
color: #1a1a1a;
text-decoration: none;
font-size: 0.9em;
border: none;
border-radius: 5px;
transition: background-color 0.3s, color 0.3s;
min-width: 100px;
max-width: 150px;
white-space: normal;
}
.button-group a.button:hover {
background-color: #03a9f4;
color: #ffffff;
}
/* Suggestions container */
.suggestions-container {
margin-top: 40px;
}
/* Competitors heading */
.competitors-heading {
font-size: 28px;
color: #4fc3f7;
margin-bottom: 20px;
}
/* Problematic heading */
.problematic-heading {
font-size: 24px;
color: #f44336;
margin-bottom: 10px;
}