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