refactored text css
This commit is contained in:
parent
0a584bb58a
commit
8964165e78
15 changed files with 41 additions and 108 deletions
|
|
@ -37,30 +37,4 @@
|
|||
flex: 1;
|
||||
white-space: nowrap;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.dialog-buttons {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.dialog-btn {
|
||||
padding: 4px 8px;
|
||||
border: 1px solid #333;
|
||||
background: #f0f0f0;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 0.8rem;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.dialog-btn:hover:not(:disabled) {
|
||||
background: #333;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.dialog-btn:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
14
frontend/css/text.css
Normal file
14
frontend/css/text.css
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
h1 {
|
||||
text-align: left;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
margin-left: 40px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Liste des Yakus - Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<style>
|
||||
#menu {
|
||||
|
|
@ -38,13 +39,6 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
color: white;
|
||||
margin: 40px 0 50px 0;
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
.yakus-container {
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
|
|
@ -131,7 +125,7 @@
|
|||
</div>
|
||||
<div id="mascotte"></div>
|
||||
|
||||
<h1>Yakus les plus courants</h1>
|
||||
<h1 style="text-align: center;">Yakus les plus courants</h1>
|
||||
|
||||
<div class="yakus-container" id="yakus-list"></div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,19 +4,13 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Ressources - Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<style>
|
||||
#menu {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
color: white;
|
||||
margin: 40px 0 50px 0;
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
.resources-list {
|
||||
max-width: 700px;
|
||||
margin: 40px auto;
|
||||
|
|
@ -55,7 +49,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h2>Ressources complémentaires</h2>
|
||||
<h2 style="text-align: center;">Ressources complémentaires</h2>
|
||||
<ul class="resources-list">
|
||||
<li class="resource-item">
|
||||
<div class="resource-title">Guide PDF du Riichi Mahjong</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<style>
|
||||
#menu {
|
||||
|
|
@ -139,6 +140,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 1</h1>
|
||||
<div id="tile-container"></div>
|
||||
<div id="tiles-display">
|
||||
<div class="tiles-numbers">
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -38,17 +39,11 @@
|
|||
.speech-bubble.visible {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 10</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -38,17 +39,11 @@
|
|||
.speech-bubble.visible {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 11</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -124,6 +125,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 2</h1>
|
||||
<div id="tile-container"></div>
|
||||
<div id="tiles-display"></div>
|
||||
<div class="speech-bubble">
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -54,17 +55,11 @@
|
|||
gap: 60px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 3</h1>
|
||||
<h2>Combinaisons valides</h2>
|
||||
<div id="tiles-container">
|
||||
<div id="tiles-display"></div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -54,17 +55,11 @@
|
|||
gap: 10px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 4</h1>
|
||||
<h2>Mains bien formées</h2>
|
||||
<div id="tiles-container">
|
||||
<div id="tiles-display"></div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -38,17 +39,11 @@
|
|||
.speech-bubble.visible {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 5</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -38,17 +39,11 @@
|
|||
.speech-bubble.visible {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 6</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -39,15 +40,6 @@
|
|||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#winds-box {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
|
|
@ -114,6 +106,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 7</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -54,17 +55,11 @@
|
|||
gap: 10px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 8</h1>
|
||||
|
||||
<h2>Brelan de valeur (dragons, Est ou vent du joueur)</h2>
|
||||
<div id="tiles-display"></div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<title>Tuto Riichi</title>
|
||||
<link rel="stylesheet" href="/frontend/css/style.css">
|
||||
<link rel="stylesheet" href="/frontend/css/text.css">
|
||||
<link rel="stylesheet" href="/frontend/css/speech-bubble.css">
|
||||
<link rel="stylesheet" href="/frontend/css/hand.css">
|
||||
<style>
|
||||
|
|
@ -38,17 +39,11 @@
|
|||
.speech-bubble.visible {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="menu"></div>
|
||||
<h1>Chapitre 9</h1>
|
||||
<div class="speech-bubble">
|
||||
<div class="speech-text" id="speech-text"></div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue