Différences

Ci-dessous, les différences entre deux révisions de la page.

--- css:slides [2024/06/06 16:14] – avillepreux
+++ css:slides [2024/06/06 17:07] (Version actuelle) – avillepreux
@@ Ligne 1: / Ligne 1: @@
 <CSS>
+/* ---------------------------------------------------------------------------------------------- */
+/* RESET */
 /* Hide everything that is not content + unstyle everything */
@@ Ligne 35: / Ligne 38: @@
 #plugin_include__css__slides
 {
-	height: 0;
+	height: 0 !important;
-	display: none;
+	display: none !important;
 }
@@ Ligne 78: / Ligne 81: @@
     padding: 0;
     margin: 0;
-}
-.wrap_slide > .plugin_wrap > p,
-.wrap_slide > .plugin_wrap > p img,
-.wrap_slide > .plugin_wrap > p .dokuwiki img.mediacenter { /* how to target p's that are around images ? */
-    padding: 0;
-    margin: 0;
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
 }
@@ Ligne 105: / Ligne 97: @@
 }
+/* ---------------------------------------------------------------------------------------------- */
 /* SLIDES */
+/* image section */
+.wrap_img,
+.wrap_img > p,
+.wrap_img > p img,
+.wrap_img > p img.mediacenter,
+.dokuwiki .wrap_img > p img.media,
+.dokuwiki .wrap_img > p img.mediacenter {
+    padding: 0;
+    margin: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+/* Edit buttons */
 #slide-edit {
@@ Ligne 124: / Ligne 135: @@
 .wrap_slide {
     width: 100svw;
+    max-height: 100vh;
     flex-shrink: 0;
     scroll-snap-align: start;
+}
+.wrap_slide > * {
+    max-height: 100vh;
 }
@@ Ligne 139: / Ligne 154: @@
 }
-.h1, h1 { font-size: var(--font-size-h1, 3em); text-transform: var(--text-h1, uppercase); text-border: var(--text-border-h1, none); }
+.h1, h1 { font-size: var(--font-size-h1, 3rem); text-transform: var(--text-h1, uppercase); text-border: var(--text-border-h1, none); }
-.h2, h2 { font-size: var(--font-size-h2, 2em); text-transform: var(--text-h2, normal);    text-border: var(--text-border-h2, none); }
+.h2, h2 { font-size: var(--font-size-h2, 2rem); text-transform: var(--text-h2, normal);    text-border: var(--text-border-h2, none); }
 .h3, h3,
 .h4, h4,
@@ Ligne 147: / Ligne 162: @@
  ul, p { font-size: var(--font-size, 1em); }
-.wrap_txt :is(.h1, h1) { margin: var(--margin-h1, .4em .5rem .6em .5rem) !important; }
+.wrap_txt :is(.h1, h1) { margin: var(--margin-h1, .4rem 1rem .6rem 1rem) !important; }
-.wrap_txt :is(.h2, h2) { margin: var(--margin-h2, .3em .5rem .5em .5rem) !important; }
+.wrap_txt :is(.h2, h2) { margin: var(--margin-h2, .3rem 1rem .5rem 1rem) !important; }
 .wrap_txt :is(.h3, h3,
 	      .h4, h4,
 	      .h5, h5,
 	      .h6, h6,
- 	       ul, p) { margin: var(--margin, .2em .5rem .4em .5rem) !important; }
+ 	       ul, p, table) { margin: var(--margin, .2rem 1rem .4rem 1rem) !important; }
 .wrap_txt {
@@ Ligne 177: / Ligne 192: @@
 }
-body {
+html, body {
+    font-size: min(3vw, 3vh) !important;
-    font-size: min(3vw, 3vh);
-    --font-size: 1em;
-    --background-color: white;
-    --margin: .2em .5rem .4em .5rem;
-    --text-max-width: calc(4 * 100vh / 3);
-    --txt-area-aspect-ratio: 4 / 3;
-    --color-h1: var(--color-theme, black);
-    --font-size-h1: 3em;
-    --margin-h1: .4em .5rem .6em .5rem;
-    --text-h1: uppercase;
-    --text-border-h1: none;
-    --color-h2: black;
-    --font-size-h2: 2em;
-    --margin-h2: .3em .5rem .5em .5rem;
-    --text-h2: normal;
-    --text-border-h2: none;
 }
@@ Ligne 222: / Ligne 216: @@
     display: block;
     position: absolute;
-    bottom: .2em;
+    bottom: .2rem;
     left: 50%;
   }
+/* Tables */
+.table,
+.table *,
+.table-striped>tbody>tr:nth-of-type(odd),
+.table > tbody > tr > td,
+.table > tbody > tr > th,
+.table > tfoot > tr > td,
+.table > tfoot > tr > th,
+.table > thead > tr > td,
+.table > thead > tr > th {
+    color: var(--color-text);
+    background-color: var(--background-color);
+    line-height: 1.5;
+    font-size: var(--font-size);
+}
@@ Ligne 233: / Ligne 246: @@
 }
 */
+/* ---------------------------------------------------------------------------------------------- */
+/* CONFIG */
+body {
+    --txt-area-aspect-ratio: 4 / 3;
+    --font-size: 1.5rem;
+    --background-color: white;
+    --margin: .2rem 1rem .4rem 1rem;
+    --color-h1: var(--color-theme, black);
+    --font-size-h1: 3rem;
+    --margin-h1: .4rem 1rem .6rem 1rem;
+    --text-h1: uppercase;
+    --text-border-h1: none;
+    --color-h2: black;
+    --font-size-h2: 2rem;
+    --margin-h2: .3rem 1rem .5rem 1rem;
+    --text-h2: normal;
+    --text-border-h2: none;
+}
 </CSS>
@@ Ligne 239: / Ligne 278: @@
 jQuery(() => { if (typeof slides === "undefined") { var slides = true;
-	jQuery("body").append('<a id="slide-edit" href="?do=edit">✎</a>');
+  /* Add edit button */
+  jQuery("body").append('<a id="slide-edit" href="?do=edit">✎</a>');
 } });
 </JS>