lanta/pubg
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fancy ass buttons and background

Browse source
This commit is contained in:
Thijs Stobbelaar 2023-09-21 16:34:58 +02:00
parent 0a83412049
commit 3325c38b41
2 changed files with 48 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

49
includes/styles.css
View file

@ -1,3 +1,6 @@
/* Add Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');
/* Reset some default styles */
body, h1, h2, p, ul, li, a {
margin: 0;
@ -6,8 +9,8 @@ body, h1, h2, p, ul, li, a {
}
body {
font-family: Arial, sans-serif;
background-color: black;
font-family: 'Roboto', sans-serif;
background: linear-gradient(to right, #0f2027, #203a43, #2c5364);
color: white;
}
@ -33,6 +36,8 @@ nav a {
color: white;
padding: 10px 15px;
display: block;
border-radius: 5px;
transition: background-color 0.3s;
}
nav a:hover {
@ -42,8 +47,10 @@ nav a:hover {
header, main, footer {
max-width: 800px;
margin: 20px auto;
padding: 10px 20px;
padding: 20px;
border: 1px solid white;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}
header h1, section h2 {
@ -56,7 +63,6 @@ footer {
text-align: center;
}
/* Responsive Styles */
@media (max-width: 600px) {
nav li {
display: block;
@ -72,6 +78,7 @@ table {
table, th, td {
border: 1px solid white;
border-radius: 5px;
}
th, td {
@ -88,13 +95,43 @@ tr:hover {
}
.discord-logo {
width: 50px; /* Reduced from 50px to 30px */
width: 50px;
height: auto;
margin-top: 10px;
cursor: pointer;
transition: opacity 0.3s;
transition: opacity 0.3s, transform 0.3s;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
border-radius: 5px;
}
.discord-logo:hover {
transform: scale(1.05);
opacity: 0.8;
}
/* Fancy Button Styles */
.btn {
display: inline-block;
font-size: 16px;
padding: 12px 20px;
border: none;
border-radius: 25px; /* Rounded Edges */
background: linear-gradient(to right, #FF416C, #FF4B2B); /* Gradient Background */
color: white;
cursor: pointer;
transition: transform 0.3s, box-shadow 0.3s; /* Smooth Transition for Hover Effect */
text-align: center;
text-decoration: none; /* In case you use it on anchor tags */
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1); /* Slight Shadow */
margin: 10px 0; /* Some Margin for Space */
}
.btn:hover {
transform: translateY(-3px); /* Slight Lift on Hover */
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2); /* Increased Shadow on Hover */
}
.btn:active {
transform: translateY(1px); /* Slight Pressed-In effect on Click */
}

8
user_stats.php
View file

@ -29,15 +29,15 @@ error_reporting(E_ALL);
// Form to select game mode
echo "<form method='post' action=''>
<input type='submit' name='game_mode' value='solo'>
<input type='submit' name='game_mode' value='duo'>
<input type='submit' name='game_mode' value='squad'>
<input type='submit' name='game_mode' value='solo' class='btn'>
<input type='submit' name='game_mode' value='duo' class='btn'>
<input type='submit' name='game_mode' value='squad' class='btn'>
</form><br>";
// Buttons for each player
echo "<form method='post' action=''>";
foreach ($players_data[$selected_mode] as $player_name => $player_details) {
echo "<button type='submit' name='selected_player' value='$player_name'>$player_name</button>";
echo "<button type='submit' name='selected_player' value='$player_name' class='btn' >$player_name</button>";
}
echo "</form><br>";