";
echo "";
@@ -12,7 +12,6 @@ foreach($playlists as $playlist){
echo "";
echo "";
echo "";
- // If you want to add an image, you can add it here
echo "
";
}
echo "
";
diff --git a/ci/assets/connexion.css b/ci/assets/connexion.css
index 97e3623..12dd35e 100644
--- a/ci/assets/connexion.css
+++ b/ci/assets/connexion.css
@@ -1,83 +1,9 @@
-body {
+body{
margin: 0;
padding: 0;
- font-family: 'Arial', sans-serif;
- background-color: #1DB954;
- display: flex;
- justify-content: center;
- align-items: center;
- height: 100vh;
-}
-
-.container {
- background-color: #191414;
- padding: 20px;
- border-radius: 10px;
- box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
-}
-
-.login-box {
- max-width: 400px;
- margin: auto;
- color: white;
-}
-
-.login-box h1 {
- text-align: center;
- margin-bottom: 20px;
-}
-
-.textbox {
- margin-bottom: 20px;
-}
-
-.textbox input {
- width: 100%;
- padding: 10px;
- background-color: #333;
- border: none;
- border-radius: 5px;
- color: white;
+ box-sizing: border-box;
+ background-color: white;
font-size: 16px;
-}
+ height: 80%;
-.btn {
- width: 100%;
- padding: 10px;
- border: none;
- border-radius: 5px;
- font-size: 16px;
- cursor: pointer;
-}
-
-.btn:hover {
- opacity: 0.9;
-}
-
-.btn.social-btn {
- display: block;
- margin-bottom: 10px;
-}
-
-.apple {
- background-color: #A3AAAE;
-}
-
-.google {
- background-color: #DB4437;
-}
-
-.facebook {
- background-color: #3B5998;
-}
-
-.alt-login p {
- text-align: center;
- margin: 20px 0;
-}
-
-hr {
- border: none;
- border-top: 1px solid #333;
- margin: 20px 0;
-}
+}
\ No newline at end of file
diff --git a/ci/assets/playlist.css b/ci/assets/playlist.css
index 7920b89..367dcce 100644
--- a/ci/assets/playlist.css
+++ b/ci/assets/playlist.css
@@ -1,22 +1,25 @@
-/* Style for the buttons */
+/* Style pour les boutons */
button[type='submit'].create-button,
button[type='submit'].delete-button {
- background-color: #1ed860 !important;
+ background-color: #1ed860;
color: white;
- padding: 5px 10px;
+ padding: 8px 12px;
border: none;
border-radius: 5px;
cursor: pointer;
margin: 5px;
+ transition: background-color 0.3s, color 0.3s;
}
+
button.upload-image-button {
background-color: transparent;
color: green;
border: 1px solid green;
- padding: 5px 10px;
+ padding: 8px 12px;
border-radius: 5px;
cursor: pointer;
margin-top: 10px;
+ transition: background-color 0.3s, color 0.3s;
}
button.upload-image-button:hover {
@@ -24,33 +27,37 @@ button.upload-image-button:hover {
color: white;
}
-/* Style for the playlist container */
+/* Style pour le conteneur de la playlist */
div.playlist-container {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
- padding-top: 20px; /* Ajoutez un padding pour éviter que le contenu ne soit caché par la barre de navigation */
+ padding-top: 20px; /* Ajouter un padding pour éviter que le contenu ne soit caché par la barre de navigation */
}
-/* Style for each playlist */
+/* Style pour chaque élément de la playlist */
div.playlist-item {
width: 200px;
margin: 10px;
- padding: 10px;
+ padding: 12px;
border: 1px solid #ccc;
- border-radius: 5px;
+ border-radius: 8px;
text-align: center;
+ transition: transform 0.3s;
+ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}
div.playlist-item img {
max-width: 100%;
height: auto;
+ border-radius: 5px;
}
-/* Style for the playlist name */
+/* Style pour le nom de la playlist */
div.playlist-item h3 {
margin-top: 10px;
- font-size: 18px;
+ font-size: 20px;
+ color: #333; /* changer la couleur du texte */
}
div.playlist-item:hover {
diff --git a/ci/assets/style.css b/ci/assets/style.css
index 04f95c2..702e8f2 100644
--- a/ci/assets/style.css
+++ b/ci/assets/style.css
@@ -1,11 +1,10 @@
body {
- margin: 0;
- padding: 0;
box-sizing: border-box;
background-color: white;
font-size: 16px;
height: 80%;
-
+ padding-top: 100px;
+ padding-right: 50px;
}
.navbar a {
color: white;