First Commit
This commit is contained in:
commit
ce0758fbbb
496 changed files with 52062 additions and 0 deletions
108
static/themes/00s-copy/banner.css
Executable file
108
static/themes/00s-copy/banner.css
Executable file
|
|
@ -0,0 +1,108 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
background: linear-gradient(to bottom, #003366 0%, #0066cc 100%);
|
||||
border: 2px solid #00ccff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin: auto;
|
||||
box-shadow: 0 0 10px #00ccff;
|
||||
animation: fadeIn 2s ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% { opacity: 0; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
|
||||
.galaxy-background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background:
|
||||
linear-gradient(90deg,
|
||||
rgba(0, 204, 255, 0.1) 0%,
|
||||
rgba(255, 255, 255, 0.1) 100%
|
||||
),
|
||||
linear-gradient(0deg, transparent 0%, rgba(0, 0, 0, 0.8) 100%),
|
||||
repeating-linear-gradient(
|
||||
0deg,
|
||||
transparent 0%,
|
||||
transparent 1px,
|
||||
rgba(255, 255, 255, 0.1) 2px,
|
||||
rgba(255, 255, 255, 0.1) 4px
|
||||
);
|
||||
z-index: 1;
|
||||
animation: moveBackground 10s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes moveBackground {
|
||||
0% { background-position: 0 0; }
|
||||
100% { background-position: 100% 0; }
|
||||
}
|
||||
|
||||
.banner-text {
|
||||
font-family: 'Press Start 2P', cursive;
|
||||
font-size: 36px;
|
||||
color: #ffffff;
|
||||
text-shadow: 2px 2px 0px #00ccff, 4px 4px 0px #0066cc;
|
||||
z-index: 2;
|
||||
animation: textGlow 1.5s ease-in-out infinite alternate;
|
||||
}
|
||||
|
||||
@keyframes textGlow {
|
||||
0% { text-shadow: 2px 2px 0px #00ccff, 4px 4px 0px #0066cc; }
|
||||
100% { text-shadow: 2px 2px 10px #00ccff, 4px 4px 10px #0066cc; }
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font-family: 'Press Start 2P', cursive;
|
||||
font-size: 14px;
|
||||
color: #ffffff;
|
||||
text-shadow: 1px 1px 0px #00ccff;
|
||||
z-index: 2;
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
padding: 0 20px;
|
||||
animation: fadeIn 3s ease-in-out;
|
||||
}
|
||||
|
||||
/* Ajout des styles responsive */
|
||||
@media screen and (max-width: 768px) {
|
||||
.banner {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.banner-text {
|
||||
font-size: 24px;
|
||||
text-align: center;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font-size: 12px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.banner {
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.banner-text {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
95
static/themes/00s-copy/bbcode.css
Normal file
95
static/themes/00s-copy/bbcode.css
Normal file
|
|
@ -0,0 +1,95 @@
|
|||
|
||||
.bbcode-bar, .bbcode-bar ul {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.bbcode-bar {
|
||||
flex-direction: column;
|
||||
background-color: rgba(0,0,0, 0.);
|
||||
border-top: 2px inset #0066cc;
|
||||
border-right: 2px inset #0066cc;
|
||||
border-left: 2px inset #0066cc;
|
||||
margin: 0 -5px -5px 5px;
|
||||
width: 99%;
|
||||
}
|
||||
|
||||
.bbcode-bar ul {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.bbcode-bar li {
|
||||
margin: 0 3px 3px 3px;
|
||||
font-family: 'Press Start 2P';
|
||||
}
|
||||
|
||||
.bbcode-bar button {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.draggable {
|
||||
width: 600px;
|
||||
height: 300px;
|
||||
overflow: auto;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
background-color: rgba(0,0,0, 0.8);
|
||||
border: 2px solid #ccc;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
|
||||
z-index: 1000;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.draggable .header {
|
||||
position: fixed;
|
||||
width: 596px;
|
||||
background-color: #082039;
|
||||
color: #fff;
|
||||
padding: 5px;
|
||||
cursor: move;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.draggable .close-button {
|
||||
color: white;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.draggable .content {
|
||||
padding: 15px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
ul.bbcode-list {
|
||||
margin-left: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
h1.h1-bbcode {
|
||||
font-family: "Roboto";
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
h2.h2-bbcode {
|
||||
font-family: "Roboto";
|
||||
font-size: 1.5rem;
|
||||
background-color: rgba(0, 0, 0, 0.0);
|
||||
border: none;
|
||||
}
|
||||
|
||||
h3.h3-bbcode {
|
||||
font-family: "Roboto";
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
fieldset.quote-bbcode {
|
||||
padding: 10px;
|
||||
border: 1px solid #fff;
|
||||
background-color: rgba(0,0,0, 0.4);
|
||||
}
|
||||
364
static/themes/00s-copy/colors.css
Executable file
364
static/themes/00s-copy/colors.css
Executable file
|
|
@ -0,0 +1,364 @@
|
|||
html, body {
|
||||
background: #e0e0e0;
|
||||
background-size: 20px 20px;
|
||||
font-family: 'Verdana', sans-serif;
|
||||
}
|
||||
|
||||
.notification li.success {
|
||||
border-color: #d6e9c6;
|
||||
color: #468847;
|
||||
background-color: #dff0d8;
|
||||
box-shadow: none;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
text-shadow: none;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.notification li.error {
|
||||
border: 1px solid orange;
|
||||
background-color: rgb(255, 215, 140);
|
||||
color: rgb(152, 120, 60);
|
||||
box-shadow: none;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
text-shadow: none;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.container, .menu {
|
||||
background-color: #d0e7ff;
|
||||
border-color: #a3c2ff;
|
||||
}
|
||||
|
||||
.menu {
|
||||
background-repeat: no-repeat;
|
||||
background-size: 45%;
|
||||
background-color: #b3d1ff;
|
||||
}
|
||||
|
||||
.menu ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.menu h2 {
|
||||
background-color: #415c8a;
|
||||
color: #c4d8fd;
|
||||
text-shadow: 0 0 10px rgba(153, 204, 255, 0.5);
|
||||
}
|
||||
|
||||
.menu ul.guestbook {
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
.menu ul.guestbook li span.date {
|
||||
color: #64886a;
|
||||
}
|
||||
|
||||
.menu ul.guestbook li span.author {
|
||||
color: #816488;
|
||||
}
|
||||
|
||||
.new-item-menu::after {
|
||||
color: #ffffff;
|
||||
border-color: #ff0000;
|
||||
background-color: #ff4444;
|
||||
box-shadow: #ff0000 0 0 15px;
|
||||
}
|
||||
|
||||
.badge {
|
||||
background-color: #ff0000;
|
||||
border-color: #990000;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.container h2 {
|
||||
background: linear-gradient(90deg, #99ccff, #cce7ff);
|
||||
-webkit-background-clip: text;
|
||||
color: rgb(61, 61, 145);
|
||||
text-shadow: 0 0 10px rgba(153, 204, 255, 0.5);
|
||||
}
|
||||
|
||||
.guestbook p span.author {
|
||||
color: #64886a;
|
||||
}
|
||||
|
||||
.post-card, .news, .guestbook p {
|
||||
background-color: #f0f0f0;
|
||||
border-color: #d0d0d0;
|
||||
}
|
||||
|
||||
.post-card-header, .news-header {
|
||||
border-color: #d0d0d0;
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.post-card-header, .news-header h3 {
|
||||
text-shadow: #99ccff 0 0 10px;
|
||||
}
|
||||
|
||||
/* Contribution Page */
|
||||
|
||||
.games {
|
||||
background: url('/static/themes/default/img/gamepad2.png') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 30%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.games:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.movies {
|
||||
background: url('/static/themes/default/img/television.png') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.movies:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.musics {
|
||||
background: url('/static/themes/default/img/music.png') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.musics:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.tech {
|
||||
background: url('/static/themes/default/img/computer.png') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.tech:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.category {
|
||||
background: url('') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.category:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.news_contrib {
|
||||
background: url('/static/themes/default/img/news_contrib.png') right;
|
||||
background-position: calc(100% + 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20%;
|
||||
background-color: #fff;
|
||||
border-color: #ffffff;
|
||||
transition: background-position 0.8s;
|
||||
}
|
||||
|
||||
.news_contrib:hover {
|
||||
background-position: calc(100% - 20px);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
a {
|
||||
color: #693b05;
|
||||
text-decoration: underline;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #046539;
|
||||
text-shadow: 0 0 10px #cce7ff;
|
||||
}
|
||||
|
||||
a.danger {
|
||||
color: #ff6666;
|
||||
}
|
||||
|
||||
.text-admin {
|
||||
color: #ff3333;
|
||||
}
|
||||
|
||||
.text-sadmin {
|
||||
color: #ff0000;
|
||||
text-shadow: #cce7ff 0 0 15px;
|
||||
}
|
||||
|
||||
/* Forum */
|
||||
|
||||
.forum h3 {
|
||||
color: #99ccff;
|
||||
text-shadow: #99ccff 0 0 10px;
|
||||
}
|
||||
|
||||
.forum .category-name {
|
||||
background-color: #66a3ff;
|
||||
}
|
||||
|
||||
.forum .forum-row {
|
||||
background-color: #99ccff;
|
||||
}
|
||||
|
||||
.forum .forum-header {
|
||||
background-color: #cce7ff;
|
||||
}
|
||||
|
||||
.stats_forum ul {
|
||||
background-color: #f0f0f0;
|
||||
color: #333333;
|
||||
border-color: #d0d0d0;
|
||||
}
|
||||
|
||||
span.unread-badge {
|
||||
color: #00fc45;
|
||||
text-shadow: #00ff00 0 0 15px;
|
||||
}
|
||||
|
||||
/* FORMULAIRES */
|
||||
|
||||
button, .btn-default {
|
||||
background: linear-gradient(45deg, #235587, #cce7ff);
|
||||
border: 1px solid #ffffff;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
button:hover, .btn-default:hover {
|
||||
background: linear-gradient(45deg, #cce7ff, #235587);
|
||||
box-shadow: 0 0 15px #99ccff;
|
||||
}
|
||||
|
||||
.btn {
|
||||
border: 1px solid #ffffff;
|
||||
color: #ffffff;
|
||||
background-color: #0795d7;
|
||||
text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.btn-add {
|
||||
background-color: #003311;
|
||||
color: #ffffff;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
.btn-add:hover {
|
||||
background-color: #00cf45;
|
||||
color: #ffffff;
|
||||
box-shadow: #00ff00 0 0 15px;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background-color: #330000;
|
||||
color: #ffffff;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
.btn-danger:hover {
|
||||
background-color: #ff0000;
|
||||
color: #ffffff;
|
||||
box-shadow: #ff0000 0 0 15px;
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background-color: #333300;
|
||||
color: #ffffff;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
.btn-warning:hover {
|
||||
background-color: #ffae00;
|
||||
color: #9b3201;
|
||||
box-shadow: #ffa600 0 0 15px;
|
||||
}
|
||||
|
||||
input[type="text"], input[type="password"], input[type="email"], select, textarea {
|
||||
background-color: #f0f0f0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
.page-link {
|
||||
background-color: #f0f0f0;
|
||||
color: #333333;
|
||||
border-color: #d0d0d0;
|
||||
}
|
||||
|
||||
li.active span {
|
||||
box-shadow: #00ff00 0 0 15px;
|
||||
}
|
||||
|
||||
li.disabled span {
|
||||
background-color: #494949;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.footer p {
|
||||
color: #ffffff;
|
||||
text-shadow: #ff0000 0 0 10px;
|
||||
}
|
||||
|
||||
.deactivate {
|
||||
border: 1px solid !important;
|
||||
border-radius: 3px !important;
|
||||
padding: 2px !important;
|
||||
color: #a9a9a9 !important;
|
||||
opacity: 0.4 !important;
|
||||
}
|
||||
|
||||
a.new-item-menu {
|
||||
background-color: rgba(255, 0, 0, 0.2);
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
a.new-item-menu:hover {
|
||||
background-color: rgba(255, 0, 0, 0.8);
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
a.new-item-menu::after {
|
||||
content: "New";
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
right: 30%;
|
||||
padding: 5px;
|
||||
background-color: #ff0000;
|
||||
color: #ffffff;
|
||||
border-radius: 3px;
|
||||
font-size: 0.6rem;
|
||||
z-index: 0;
|
||||
}
|
||||
43
static/themes/00s-copy/forms.css
Normal file
43
static/themes/00s-copy/forms.css
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.btn, input[type="submit"], button {
|
||||
border: 1px solid;
|
||||
border-radius: 10px;
|
||||
padding: 5px 10px;
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
max-width: max-content;
|
||||
font-size: 0.8rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-small {
|
||||
font-size: 0.5rem;
|
||||
}
|
||||
|
||||
.btn-large {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
input[type="text"], input[type="password"], input[type="email"], select, textarea {
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
width: 99%;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
input[type="text"], input[type="password"], input[type="email"], select {
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
.form-inline {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
13
static/themes/00s-copy/gallery.css
Normal file
13
static/themes/00s-copy/gallery.css
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
.gallery {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.gallery-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 200px;
|
||||
}
|
||||
466
static/themes/00s-copy/games.css
Normal file
466
static/themes/00s-copy/games.css
Normal file
|
|
@ -0,0 +1,466 @@
|
|||
.card-game {
|
||||
border: 1px solid #cccccc;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
background: #f9f9f9;
|
||||
margin: 15px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.card-game:hover {
|
||||
transform: scale(1.02);
|
||||
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.card-game .header {
|
||||
border-bottom: 1px solid #cccccc;
|
||||
padding: 10px;
|
||||
background: #e0e0e0;
|
||||
color: #333333;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.card-game .header a {
|
||||
color: #0066cc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.card-game .header a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.card-game .body {
|
||||
padding: 10px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.card-game .footer {
|
||||
border-top: 1px solid #cccccc;
|
||||
background-color: #e0e0e0;
|
||||
padding: 10px;
|
||||
font-size: 0.8rem;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
ul.inline {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
ul.inline li {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.countdown {
|
||||
font-size: 20px;
|
||||
color: red;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* PETIT BAC */
|
||||
.game-bac-letter {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 60px;
|
||||
border: 2px solid #cccccc;
|
||||
background: #f0f0f0;
|
||||
color: #333333;
|
||||
font-family: 'Verdana', sans-serif;
|
||||
border-radius: 5px;
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
table.bac, table.bac th, table.bac tr, table.bac td {
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
table.bac {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
table.bac th {
|
||||
background: #e0e0e0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
table.bac th, table.bac td {
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/* QUIZ */
|
||||
|
||||
table.quiz, table.quiz th, table.quiz tr, table.quiz td {
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
table.quiz {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
table.quiz th {
|
||||
background: #e0e0e0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
table.quiz th, table.quiz td {
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/* QUIZ */
|
||||
.quizes {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.quiz-item {
|
||||
flex: 1 1 300px;
|
||||
border: 1px solid #cccccc;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
background: #f9f9f9;
|
||||
padding: 15px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.quiz-item:hover {
|
||||
transform: scale(1.02);
|
||||
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.quiz-item h3 {
|
||||
border-bottom: 1px solid #cccccc;
|
||||
padding-bottom: 10px;
|
||||
margin-top: 0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.quiz-item h3 a {
|
||||
color: #0066cc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.quiz-item h3 a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.quiz-item p {
|
||||
color: #333333;
|
||||
margin: 8px 0;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.quiz-item p:last-child {
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
/* Quiz Styles */
|
||||
.quiz-container {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
font-family: 'Verdana', sans-serif;
|
||||
}
|
||||
|
||||
.quiz-title {
|
||||
color: #333333;
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
font-size: 2rem;
|
||||
text-transform: uppercase;
|
||||
border-bottom: 2px solid #cccccc;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.quiz-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.quiz-question {
|
||||
background: #f9f9f9;
|
||||
border: 1px solid #cccccc;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.question-header {
|
||||
background: linear-gradient(to bottom, #e0e0e0, #cccccc);
|
||||
padding: 10px 15px;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
.question-content {
|
||||
padding: 20px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.question-content h3 {
|
||||
color: #0066cc;
|
||||
margin-bottom: 15px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.choices-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.choice-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8px;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 3px;
|
||||
background: #f5f5f5;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.choice-item:hover {
|
||||
background: #e6e6e6;
|
||||
border-color: #cccccc;
|
||||
}
|
||||
|
||||
.choice-item input[type="radio"] {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.choice-item label {
|
||||
color: #333333;
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.submit-container {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.submit-button {
|
||||
background: linear-gradient(to bottom, #4d90fe, #357ae8);
|
||||
color: white;
|
||||
border: 1px solid #2f5bb7;
|
||||
padding: 12px 30px;
|
||||
font-size: 1.1rem;
|
||||
cursor: pointer;
|
||||
border-radius: 3px;
|
||||
font-family: 'Arial', sans-serif;
|
||||
font-weight: bold;
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.submit-button:hover {
|
||||
background: linear-gradient(to bottom, #357ae8, #2f5bb7);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Quiz Results Styles */
|
||||
.quiz-result-container {
|
||||
max-width: 800px;
|
||||
margin: 40px auto;
|
||||
padding: 20px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.quiz-result-card {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.score-number {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
color: #0066cc;
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.score-number.high { color: #008000; }
|
||||
.score-number.medium { color: #FFA500; }
|
||||
.score-number.low { color: #FF0000; }
|
||||
|
||||
.score-message {
|
||||
color: #333333;
|
||||
font-size: 18px;
|
||||
margin: 15px 0;
|
||||
font-family: 'Verdana', sans-serif;
|
||||
}
|
||||
|
||||
.quiz-score {
|
||||
float: right;
|
||||
background: #e0e0e0;
|
||||
color: #333333;
|
||||
font-size: 0.9rem;
|
||||
padding: 2px 8px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
.progress-circle {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.circular-chart {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transform: rotate(-90deg); /* Fait démarrer la progression à midi */
|
||||
}
|
||||
|
||||
.progress-path {
|
||||
stroke-linecap: round;
|
||||
transition: stroke-dasharray 0.5s ease;
|
||||
}
|
||||
|
||||
/* Couleurs pour les différents niveaux */
|
||||
.progress-path.high {
|
||||
stroke: #4caf50;
|
||||
}
|
||||
|
||||
.progress-path.medium {
|
||||
stroke: #ff9800;
|
||||
}
|
||||
|
||||
.progress-path.low {
|
||||
stroke: #f44336;
|
||||
}
|
||||
|
||||
.percentage-text {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
font-family: 'Arial', sans-serif;
|
||||
}
|
||||
|
||||
.progress-circle-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.progress-circle {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.progress-path {
|
||||
transition: stroke-dasharray 0.3s ease;
|
||||
}
|
||||
|
||||
.high {
|
||||
stroke: #4caf50; /* Green */
|
||||
}
|
||||
|
||||
.medium {
|
||||
stroke: #ffeb3b; /* Yellow */
|
||||
}
|
||||
|
||||
.low {
|
||||
stroke: #f44336; /* Red */
|
||||
}
|
||||
|
||||
/* Responsive table styles */
|
||||
.responsive-table {
|
||||
width: 100%;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
.responsive-table input[type="text"] {
|
||||
width: 100%;
|
||||
padding: 8px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Mobile first styles */
|
||||
@media screen and (max-width: 600px) {
|
||||
.responsive-table thead {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.responsive-table tr {
|
||||
margin-bottom: 20px;
|
||||
display: block;
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
.responsive-table td {
|
||||
display: block;
|
||||
text-align: left;
|
||||
border: none;
|
||||
border-bottom: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
.responsive-table td:before {
|
||||
content: attr(data-label);
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.game-bac-letter {
|
||||
position: static;
|
||||
text-align: center;
|
||||
margin: 1em auto;
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
|
||||
/* Desktop styles */
|
||||
@media screen and (min-width: 601px) {
|
||||
.responsive-table {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.responsive-table thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
.responsive-table tbody {
|
||||
display: table-row-group;
|
||||
}
|
||||
|
||||
.responsive-table tr {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.responsive-table td,
|
||||
.responsive-table th {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.responsive-table td:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.responsive-table input[type="text"] {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
59
static/themes/00s-copy/grid.css
Executable file
59
static/themes/00s-copy/grid.css
Executable file
|
|
@ -0,0 +1,59 @@
|
|||
/* Système de grille utilisant les flexbox */
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.row-xs {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.col {
|
||||
flex: 1;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
/* classes pour les largeurs des colonnes */
|
||||
|
||||
.col-1 { flex: 0 0 8.33%; }
|
||||
.col-2 { flex: 0 0 16.667%; }
|
||||
.col-3 { flex: 0 0 25%; }
|
||||
.col-4 { flex: 0 0 33.33%; }
|
||||
.col-5 { flex: 0 0 46.66%; }
|
||||
.col-6 { flex: 0 0 50%; }
|
||||
.col-7 { flex: 0 0 58.33%; }
|
||||
.col-8 { flex: 0 0 66.66%; }
|
||||
.col-9 { flex: 0 0 75%; }
|
||||
.col-10 { flex: 0 0 83.33%; }
|
||||
.col-11 { flex: 0 0 91.66%; }
|
||||
.col-12 { flex: 0 0 100%; }
|
||||
|
||||
/* Responsive */
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.row {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.col {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.menu ul.guestbook li span.date {
|
||||
color: #646788;
|
||||
}
|
||||
|
||||
.col-2 {
|
||||
order: 2; /* Placer après .col-7 */
|
||||
}
|
||||
|
||||
.col-7 {
|
||||
order: 1; /* Placer avant .col-1 */
|
||||
}
|
||||
}
|
||||
BIN
static/themes/00s-copy/img/archer_sprite.png
Executable file
BIN
static/themes/00s-copy/img/archer_sprite.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
static/themes/00s-copy/img/bg.png
Executable file
BIN
static/themes/00s-copy/img/bg.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 123 B |
BIN
static/themes/00s-copy/img/bg2.png
Executable file
BIN
static/themes/00s-copy/img/bg2.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 154 B |
BIN
static/themes/00s-copy/img/bg3.png
Executable file
BIN
static/themes/00s-copy/img/bg3.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 161 B |
BIN
static/themes/00s-copy/img/bg_container.png
Executable file
BIN
static/themes/00s-copy/img/bg_container.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 101 B |
BIN
static/themes/00s-copy/img/bg_galactique.png
Executable file
BIN
static/themes/00s-copy/img/bg_galactique.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
static/themes/00s-copy/img/bg_galactique2.png
Executable file
BIN
static/themes/00s-copy/img/bg_galactique2.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 436 KiB |
BIN
static/themes/00s-copy/img/computer.png
Executable file
BIN
static/themes/00s-copy/img/computer.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 53 KiB |
BIN
static/themes/00s-copy/img/gamepad.png
Executable file
BIN
static/themes/00s-copy/img/gamepad.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
BIN
static/themes/00s-copy/img/gamepad2.png
Executable file
BIN
static/themes/00s-copy/img/gamepad2.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 131 KiB |
BIN
static/themes/00s-copy/img/mage_sprite.png
Executable file
BIN
static/themes/00s-copy/img/mage_sprite.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
BIN
static/themes/00s-copy/img/music.png
Executable file
BIN
static/themes/00s-copy/img/music.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
static/themes/00s-copy/img/news_contrib.png
Executable file
BIN
static/themes/00s-copy/img/news_contrib.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 197 KiB |
BIN
static/themes/00s-copy/img/television.png
Executable file
BIN
static/themes/00s-copy/img/television.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 282 KiB |
34
static/themes/00s-copy/pm.css
Normal file
34
static/themes/00s-copy/pm.css
Normal file
|
|
@ -0,0 +1,34 @@
|
|||
.table {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 90%;
|
||||
margin: 0 auto 10px auto;
|
||||
}
|
||||
|
||||
.table .header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex: 1;
|
||||
border-bottom: 2px solid grey;
|
||||
font-weight: 800;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.table .body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex: 1;
|
||||
border-bottom: 1px solid grey;
|
||||
}
|
||||
|
||||
.new-message {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background-color: rgb(236, 58, 58);
|
||||
border: 1px solid red;
|
||||
font-size: 0.5rem;
|
||||
margin-right: 10px;
|
||||
padding: 3px;
|
||||
border-radius: 10px;
|
||||
text-shadow: none;
|
||||
}
|
||||
41
static/themes/00s-copy/post.css
Normal file
41
static/themes/00s-copy/post.css
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
.postmenu {
|
||||
border: 1px solid #cccccc;
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
width: 300px;
|
||||
margin: 10px;
|
||||
float: right;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.postmenu .header {
|
||||
background-color: rgb(200, 220, 255);
|
||||
padding: 5px;
|
||||
font-size: 1.2rem;
|
||||
border-bottom: 1px solid #cccccc;
|
||||
color: #333333;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.postmenu .body {
|
||||
padding: 10px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.postmenu .body ul {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.postmenu .body ul li {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
list-style-type: none;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.postmenu .body ul li:hover {
|
||||
margin-left: 10px;
|
||||
color: #0066cc;
|
||||
}
|
||||
291
static/themes/00s-copy/profile.css
Normal file
291
static/themes/00s-copy/profile.css
Normal file
|
|
@ -0,0 +1,291 @@
|
|||
.profile-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.profile-avatar {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
border: 3px solid #6699cc;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.profile-avatar:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.profile-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.profile-name {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 0.5rem;
|
||||
color: #003366;
|
||||
}
|
||||
|
||||
.profile-username {
|
||||
color: #336699;
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.profile-stats {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
gap: 1rem;
|
||||
margin: 2rem 0;
|
||||
padding: 1rem;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: #003366;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
color: #336699;
|
||||
font-size: 0.9rem;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.profile-bio {
|
||||
line-height: 1.6;
|
||||
color: #333333;
|
||||
margin: 2rem 0;
|
||||
padding: 1rem;
|
||||
border-left: 4px solid #6699cc;
|
||||
}
|
||||
|
||||
.profile-contact {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.contact-button {
|
||||
padding: 0.8rem 1.5rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background: #6699cc;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: background 0.3s ease;
|
||||
}
|
||||
|
||||
.contact-button:hover {
|
||||
background: #003366;
|
||||
}
|
||||
|
||||
.profile-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
gap: 2rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.profile-main {
|
||||
background: #f0f0f04d;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.profile-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.avatar-container {
|
||||
position: relative;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.level-badge {
|
||||
position: absolute;
|
||||
background: #078356;
|
||||
color: white;
|
||||
padding: 0.5rem;
|
||||
border-radius: 50%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.8rem;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.level-number {
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.profile-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.username {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 0.5rem;
|
||||
color: #003366;
|
||||
}
|
||||
|
||||
.joined-date {
|
||||
color: #336699;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.profile-bio {
|
||||
margin-top: 2rem;
|
||||
padding-top: 2rem;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
.bio-content {
|
||||
line-height: 1.6;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
/* Colonne de droite */
|
||||
.profile-stats {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.stats-card, .achievements-card {
|
||||
background: #f0f0f04d;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
background: #ffffff78;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: #444;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 0.9rem;
|
||||
color: #666;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.achievements-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1rem;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.badge-item {
|
||||
text-align: center;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.badge-item img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.badge-name {
|
||||
font-size: 0.8rem;
|
||||
color: #336699;
|
||||
}
|
||||
|
||||
.profile-actions {
|
||||
margin-top: 2rem;
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #6699cc;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: #99ccff;
|
||||
color: #003366;
|
||||
}
|
||||
|
||||
.inventory {
|
||||
background: #f0f0f04d;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
width: 98%;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.inventory-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
||||
gap: 15px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.inventory-item {
|
||||
text-align: center;
|
||||
margin: 15px;
|
||||
padding: 15px;
|
||||
background: #ffffff78;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.inventory-item a {
|
||||
text-decoration: none;
|
||||
color: #003366;
|
||||
}
|
||||
|
||||
.item-quantity {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: #003366;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@media (max-width: 768px) {
|
||||
.profile-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.stats-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
101
static/themes/00s-copy/shop.css
Normal file
101
static/themes/00s-copy/shop.css
Normal file
|
|
@ -0,0 +1,101 @@
|
|||
.shop {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
}
|
||||
.card-shop {
|
||||
background: #fff;
|
||||
border: 2px solid #000;
|
||||
border-radius: 8px;
|
||||
margin: 15px 0;
|
||||
padding: 15px;
|
||||
box-shadow: 3px 3px 0px #000;
|
||||
transition: transform 0.2s;
|
||||
width: 250px;
|
||||
min-height: 380px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
margin-right: 15px;
|
||||
vertical-align: top;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-shop:hover {
|
||||
transform: translateY(-5px);
|
||||
background: #f0f7ff;
|
||||
}
|
||||
|
||||
.card-shop img {
|
||||
max-width: 220px;
|
||||
margin-bottom: 10px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.card-shop .card-title {
|
||||
font-family: "Comic Sans MS", cursive;
|
||||
color: #0066cc;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.card-shop .card-text {
|
||||
font-family: Arial, sans-serif;
|
||||
color: #333;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.card-shop .card-content {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.card-shop .button-container {
|
||||
margin-top: auto;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
a.btn-shop {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-shop-primary {
|
||||
background: linear-gradient(to bottom, #0099ff, #0066cc);
|
||||
border: 2px solid #000;
|
||||
border-radius: 5px;
|
||||
padding: 5px 15px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.btn-shop-primary:hover {
|
||||
background: linear-gradient(to bottom, #00bbff, #0099ff);
|
||||
}
|
||||
|
||||
.btn-shop-secondary {
|
||||
background: linear-gradient(to bottom, #ffcc00, #ff9900);
|
||||
border: 2px solid #000;
|
||||
border-radius: 5px;
|
||||
padding: 5px 15px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.btn-shop-large {
|
||||
padding: 10px 20px;
|
||||
height: 65px;
|
||||
}
|
||||
|
||||
.fa-coins {
|
||||
color: #ffd700;
|
||||
}
|
||||
486
static/themes/00s-copy/structure.css
Executable file
486
static/themes/00s-copy/structure.css
Executable file
|
|
@ -0,0 +1,486 @@
|
|||
/* Marges, paddings, dimensions, flexbox */
|
||||
*, html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
/* margin: 20px 0 20px 0; */
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
p, ul {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
p.date {
|
||||
font-size: 0.8em;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.notification {
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.notification ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.notification ul li {
|
||||
padding: 10px;
|
||||
border: 2px solid;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.container, .menu {
|
||||
padding: 0;
|
||||
border: 2px solid;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.menu {
|
||||
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.menu h2 {
|
||||
border-bottom: 2px solid;
|
||||
padding: 10px;
|
||||
margin: 0 0 20px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.container h2 {
|
||||
border-bottom: 2px solid;
|
||||
padding: 10px;
|
||||
margin: 0 0 20px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
/* Menu horizontal */
|
||||
.menu-horizontal {
|
||||
background: linear-gradient(to bottom, #4c4c4c 0%, #2c2c2c 100%);
|
||||
border: 1px solid #666;
|
||||
box-shadow: 0 0 5px rgba(0,0,0,0.5);
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.menu-horizontal ul {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.menu-horizontal ul li {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.menu-horizontal ul li a {
|
||||
display: block;
|
||||
padding: 10px 20px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
text-shadow: 1px 1px 1px #000;
|
||||
}
|
||||
|
||||
.menu-horizontal ul li a:hover {
|
||||
background: linear-gradient(to bottom, #666 0%, #333 100%);
|
||||
}
|
||||
|
||||
.menu-horizontal .dropdown {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background: #333;
|
||||
min-width: 200px;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.5);
|
||||
z-index: 1000;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.menu-horizontal li:hover .dropdown {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-horizontal .dropdown li {
|
||||
width: 100%;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.menu-horizontal .dropdown a {
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.badge {
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
/* Style du menu burger */
|
||||
.burger-menu {
|
||||
display: none;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background: linear-gradient(to bottom, #4c4c4c 0%, #2c2c2c 100%);
|
||||
border: 1px solid #666;
|
||||
box-shadow: 0 0 5px rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.burger-icon {
|
||||
background: none;
|
||||
border: none;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.burger-icon span {
|
||||
display: block;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
background-color: white;
|
||||
border-radius: 3px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
body {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
.burger-menu {
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 1000;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.menu-horizontal {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 50px; /* Hauteur du burger menu */
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background: #000;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.menu-horizontal.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-horizontal ul {
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.menu-horizontal ul li {
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #333;
|
||||
}
|
||||
|
||||
.menu-horizontal ul li a {
|
||||
padding: 15px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Style des sous-menus sur mobile */
|
||||
.menu-horizontal ul ul {
|
||||
position: static;
|
||||
display: none;
|
||||
width: 100%;
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.menu-horizontal li.active > ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-horizontal .dropdown {
|
||||
position: static;
|
||||
width: 100%;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.menu-horizontal .dropdown li {
|
||||
padding-left: 20px; /* Indentation pour les sous-menus */
|
||||
}
|
||||
|
||||
.menu-horizontal li:hover .dropdown {
|
||||
display: none; /* Désactive l'affichage au hover sur mobile */
|
||||
}
|
||||
|
||||
.menu-horizontal li.active .dropdown {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Animation du burger quand actif */
|
||||
.burger-menu.active .burger-icon span:first-child {
|
||||
transform: rotate(45deg) translate(8px, 6px);
|
||||
}
|
||||
|
||||
.burger-menu.active .burger-icon span:nth-child(2) {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.burger-menu.active .burger-icon span:last-child {
|
||||
transform: rotate(-45deg) translate(8px, -6px);
|
||||
}
|
||||
|
||||
/* Styles des sous-menus sur mobile */
|
||||
.menu-horizontal .dropdown {
|
||||
position: static;
|
||||
width: 100%;
|
||||
box-shadow: none;
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.menu-horizontal li:hover .dropdown {
|
||||
display: none; /* Désactive l'affichage au hover sur mobile */
|
||||
}
|
||||
|
||||
.menu-horizontal li.active .dropdown {
|
||||
display: block; /* Affiche uniquement quand .active est présent */
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 769px) {
|
||||
.burger-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-horizontal {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
|
||||
.post-card {
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.news-header, .post-card-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.contrib {
|
||||
border: 1px solid;
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.contrib a {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
span.post-offline {
|
||||
color:red;
|
||||
font-weight:bold;
|
||||
margin:5px;
|
||||
background-image: url('../../img/icons/shield-red-cross.png');
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
span.post-online {
|
||||
color:green;
|
||||
font-weight:bold;
|
||||
margin:5px;
|
||||
background-image: url('../../img/icons/shield-green-v.png');
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
/* forum */
|
||||
.forum {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.forum .row {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.forum h3 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.forum-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border: 1px 1px 0 1px solid;
|
||||
margin: 10px 10px -10px 10px;
|
||||
}
|
||||
|
||||
.forum-column, .forum-column-detail {
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
border: 1px solid;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.forum-column:nth-child(1) {
|
||||
flex: 2;
|
||||
}
|
||||
|
||||
.forum-column:nth-child(2), .forum-column:nth-child(3) {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.forum-column-detail:nth-child(1) {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.forum-column-detail:nth-child(2) {
|
||||
flex: 4;
|
||||
}
|
||||
|
||||
.forum-column-detail ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.forum-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 0 1px 1px 1px solid;
|
||||
margin: 10px 10px -10px 10px;
|
||||
}
|
||||
|
||||
.forum-body img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.forum-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border: 0 1px 0 1px solid;
|
||||
}
|
||||
|
||||
.stats_forum {
|
||||
margin: 20px 0 10px 0;
|
||||
border-top: 2px solid
|
||||
}
|
||||
|
||||
.stats_forum ul {
|
||||
list-style-type: none;
|
||||
border: 1px solid;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.stats_forum ul li {
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
ul.breadcrumbs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-size: 1rem;
|
||||
list-style-type: none;
|
||||
margin: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
ul.breadcrumbs li {
|
||||
margin: 0 5px 0 5px;
|
||||
}
|
||||
|
||||
ul.breadcrumbs li a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
ul.pagination {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
list-style-type: none;
|
||||
margin: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
ul.pagination li.page-item {
|
||||
margin: 0 5px 0 5px;
|
||||
}
|
||||
|
||||
ul.pagination li.page-item a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.page-link {
|
||||
padding: 5px 10px;
|
||||
border: 2px solid;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
max-width: max-content;
|
||||
font-size: 0.8rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
li.disabled {
|
||||
pointer-events: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 2px;
|
||||
border: 2px outset #0066cc;
|
||||
}
|
||||
|
||||
td, th {
|
||||
border: 1px inset #0066cc;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
input, select, textarea {
|
||||
border: 2px inset #0066cc;
|
||||
background: #ffffff;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
/* Ajout d'un compteur de visiteurs style années 2000 */
|
||||
.visitor-counter {
|
||||
font-family: "Digital-7", monospace;
|
||||
background: #000000;
|
||||
color: #00ff00;
|
||||
padding: 5px;
|
||||
border: 1px solid #00ff00;
|
||||
text-align: center;
|
||||
margin: 10px 0;
|
||||
}
|
||||
53
static/themes/00s-copy/typo.css
Executable file
53
static/themes/00s-copy/typo.css
Executable file
|
|
@ -0,0 +1,53 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Tahoma:wght@400;700&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Verdana:wght@400;700&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Trebuchet+MS:wght@400;700&display=swap');
|
||||
|
||||
body {
|
||||
font-family: 'Verdana', sans-serif;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
text-shadow: 1px 1px 0px #99ccff;
|
||||
}
|
||||
|
||||
h1, h2, h3, .breadcrumbs, .btn, input, select, textarea, button, .notification, .page-link, .guestbook p {
|
||||
font-family: 'Trebuchet MS', sans-serif;
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-family: 'Tahoma', sans-serif;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
line-height: 1.5;
|
||||
color: #333333;
|
||||
text-shadow: 1px 1px 0px #99ccff;
|
||||
}
|
||||
|
||||
.btn, button {
|
||||
font-family: 'Trebuchet MS', sans-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
color: #ffffff;
|
||||
text-shadow: 1px 1px 0px #99ccff;
|
||||
}
|
||||
|
||||
.menu h2 {
|
||||
font-family: 'Verdana', sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
font-family: 'Verdana', sans-serif;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.blink {
|
||||
animation: blink 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
0% { opacity: 1; }
|
||||
50% { opacity: 0; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue