From 05db52de5daf3bf8306d8f357fa2d5dbdda0ef26 Mon Sep 17 00:00:00 2001 From: thijs Date: Fri, 3 Nov 2023 16:54:19 +0100 Subject: [PATCH] btn change --- includes/styles.css | 53 ++++++++++++++++++++++++--------------------- index.php | 2 +- 2 files changed, 29 insertions(+), 26 deletions(-) diff --git a/includes/styles.css b/includes/styles.css index 2e89f11..c63640f 100644 --- a/includes/styles.css +++ b/includes/styles.css @@ -115,32 +115,7 @@ tr:hover { 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 */ -} /* Hacker theme styles */ body { @@ -168,3 +143,31 @@ a { color: #6699ff; /* Blue color for links */ text-decoration: underline; /* Underline links for better visibility */ } + +/* Specific button styles for .btn class to match the hacker theme */ +.btn { + font-family: 'Courier New', monospace; + background: #222; /* Dark background for buttons */ + color: #33ff33; /* Bright green text */ + border: 1px solid #33ff33; /* Border to match text color */ + padding: 10px 20px; + text-transform: uppercase; + transition: background-color 0.3s ease, color 0.3s ease; +} + +.btn:hover { + background: #33ff33; /* Bright green background on hover */ + color: #000; /* Dark text on hover */ + cursor: pointer; +} + +/* Responsive button sizing for mobile for .btn class*/ +@media (max-width: 768px) { + .btn { + padding: 8px 16px; + font-size: 14px; /* Adjust font size for mobile readability */ + } +} +.btn:active { + transform: translateY(1px); /* Slight Pressed-In effect on Click */ +} \ No newline at end of file diff --git a/index.php b/index.php index 14c14e6..ae3229c 100644 --- a/index.php +++ b/index.php @@ -35,7 +35,7 @@ $lastMatches = array_slice($allMatches, 0, 8);
- +