From dc630416825b0e180c9fe1411ca8d6653331a549 Mon Sep 17 00:00:00 2001 From: Vincent Vandemeulebrouck Date: Sun, 14 Sep 2025 23:14:58 +0200 Subject: [PATCH] Fix style sidebar Perdu depuis la v13 (ou avant) --- assets/ui/d100.svg | 1 + assets/ui/icon_sidebar_cards.svg | 1 + assets/ui/icon_sidebar_chat.svg | 450 +--------------------- assets/ui/icon_sidebar_macros.svg | 54 +++ assets/ui/players-border.webp | Bin 5024 -> 0 bytes css/foundryvtt-reve-de-dragon.css | 549 ++++++++++++++------------- less/foundryvtt-reve-de-dragon.less | 560 ++++++++++++++-------------- 7 files changed, 610 insertions(+), 1005 deletions(-) create mode 100644 assets/ui/d100.svg create mode 100644 assets/ui/icon_sidebar_cards.svg create mode 100644 assets/ui/icon_sidebar_macros.svg delete mode 100644 assets/ui/players-border.webp diff --git a/assets/ui/d100.svg b/assets/ui/d100.svg new file mode 100644 index 00000000..fa96ccd2 --- /dev/null +++ b/assets/ui/d100.svg @@ -0,0 +1 @@ +0 \ No newline at end of file diff --git a/assets/ui/icon_sidebar_cards.svg b/assets/ui/icon_sidebar_cards.svg new file mode 100644 index 00000000..24e481c6 --- /dev/null +++ b/assets/ui/icon_sidebar_cards.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/ui/icon_sidebar_chat.svg b/assets/ui/icon_sidebar_chat.svg index d3fc0290..380d1c37 100644 --- a/assets/ui/icon_sidebar_chat.svg +++ b/assets/ui/icon_sidebar_chat.svg @@ -1,449 +1 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + \ No newline at end of file diff --git a/assets/ui/icon_sidebar_macros.svg b/assets/ui/icon_sidebar_macros.svg new file mode 100644 index 00000000..68ab4fbd --- /dev/null +++ b/assets/ui/icon_sidebar_macros.svg @@ -0,0 +1,54 @@ + + + + + + image/svg+xml + + + + + + + + + diff --git a/assets/ui/players-border.webp b/assets/ui/players-border.webp deleted file mode 100644 index 4f9848a17fec43b15721dcd5920fa1fc11281343..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 5024 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äZJZ`STRi37J+s;Ag~m&ip|V#*H%9;i}xNSW*nTario(XxL0@z@*U zKWN@g0A^J$9A(#E=Y0NjeyQ{c3%%$y)+8q}_GQ)P_L>^$H4T%(P0KQdyugF$GSy7v zwCwk}d6^Dz@6_E^e-2Y1k>DCD`>zW@t2wvCph0P|7b$qi#c#|tCF6P$Olqlea6N=(xcB .utiliser-attribut { - flex-basis: available; - flex-grow: 1; +.system-foundryvtt-reve-de-dragon .rdd.sheet .window-content .sheet-body .carac-list .caracteristique { + flex-wrap: nowrap; + justify-content: stretch; } .system-foundryvtt-reve-de-dragon .rdd.sheet .window-content .sheet-body .carac-list .caracteristique .carac-value { flex-basis: 15%; @@ -1194,25 +1191,24 @@ select, padding: 5px; } .system-foundryvtt-reve-de-dragon .poesie-extrait { + max-height: 12rem; font-size: 0.8rem; font-style: italic; + color: rgba(82, 17, 131, 0.9); + overflow: hidden; +} +.system-foundryvtt-reve-de-dragon .poesie-extrait:hover { + max-height: unset; + overflow: visible; + opacity: 1; +} +.system-foundryvtt-reve-de-dragon .poesie-extrait.poesie-overflow { + max-height: 2rem; } .system-foundryvtt-reve-de-dragon .poesie-reference { font-size: 0.7rem; text-align: right; } -.system-foundryvtt-reve-de-dragon .poesie-overflow { - color: rgba(82, 17, 131, 0.9); - max-height: 1.5rem; - overflow: hidden; - border-left: 1px dotted black; - /* If you want dots under the hoverable text */ -} -.system-foundryvtt-reve-de-dragon .poesie-overflow:hover { - max-height: unset; - overflow: visible; - border-left: 0px; -} .system-foundryvtt-reve-de-dragon .type-compendium { font-size: 0.6rem; } @@ -1779,6 +1775,9 @@ select, background: rgba(0, 0, 0, 0.05); cursor: pointer; } +.system-foundryvtt-reve-de-dragon .chat-message { + background: var(--color-background-chat-message); +} .system-foundryvtt-reve-de-dragon .chat-message h4 { font-size: 0.9rem; } @@ -1789,13 +1788,13 @@ select, font-size: 0.7rem; flex-grow: 3; } -.system-foundryvtt-reve-de-dragon .chat-message.whisper { - background: rgba(220, 220, 210, 0.75); - border: 2px solid #545469; -} .system-foundryvtt-reve-de-dragon .chat-message hr { margin: 0.2rem 0; } +.system-foundryvtt-reve-de-dragon .chat-message.whisper { + background: var(--color-background-chat-whisper); + border: 2px solid #545469; +} .system-foundryvtt-reve-de-dragon .chat-icon { border: 0; padding: 2px 6px 2px 2px; @@ -1817,69 +1816,68 @@ select, margin-right: 0.2rem; vertical-align: bottom; } -.system-foundryvtt-reve-de-dragon #sidebar-tabs { - flex: 0 0 28px; - box-sizing: border-box; - margin: 0 0 3px; - border-bottom: 1px solid rgba(0, 0, 0, 0); - box-shadow: inset 0 0 2rem rgba(0, 0, 0, 0.5); +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button:is( + [data-tab="chat"], + [data-tab="combat"], + [data-tab="scenes"], + [data-tab="actors"], + [data-tab="items"], + [data-tab="journal"], + [data-tab="cards"], + [data-tab="macros"], + [data-tab="tables"], + [data-tab="playlists"], + [data-tab="compendium"], + [data-tab="settings"] + )::before { + content: none; } -.system-foundryvtt-reve-de-dragon #sidebar-tabs > .item.active { - border: 1px solid #726248; - background: rgba(30, 25, 20, 0.75); - box-shadow: 0 0 6px inset #726248; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button { + background-repeat: no-repeat; } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i { - width: 23px; - height: 23px; - display: inline-block; - background-position: center; - background-size: cover; - text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.75); +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[aria-pressed="false"] { + background-color: hsla(30, 37%, 50%, 0.5); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i:is( - .fa-comments, .fa-fist-raised, .fa-swords, - .fa-users, .fa-user, .fa-map, .fa-suitcase, - .fa-book-open, .fa-th-list, .fa-music, - .fa-atlas,.fa-cogs - ):before { - content: ""; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[aria-pressed="true"] { + border: 1px solid hsl(15, 80%, 30%); + background-color: hsla(30, 100%, 90%, 0.6); + box-shadow: 0 0 3px inset hsl(15, 80%, 30%); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-comments { - background: url("../assets/ui/icon_sidebar_chat.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="chat"] { + background-image: url("../assets/ui/icon_sidebar_chat.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-fist-raised { - background: url("../assets/ui/icon_sidebar_fight.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="combat"] { + background-image: url("../assets/ui/icon_sidebar_fight.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-swords { - background: url("../assets/ui/icon_sidebar_fight.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="scenes"] { + background-image: url("../assets/ui/icon_sidebar_scene.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-user { - background: url("../assets/ui/icon_sidebar_actor.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="actors"] { + background-image: url("../assets/ui/icon_sidebar_actor.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-users { - background: url("../assets/ui/icon_sidebar_actor.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="items"] { + background-image: url("../assets/ui/icon_sidebar_item.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-map { - background: url("../assets/ui/icon_sidebar_scene.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="journal"] { + background-image: url("../assets/ui/icon_sidebar_journal.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-suitcase { - background: url("../assets/ui/icon_sidebar_item.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="cards"] { + background-image: url("../assets/ui/icon_sidebar_cards.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-book-open { - background: url("../assets/ui/icon_sidebar_journal.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="macros"] { + background-image: url("../assets/ui/icon_sidebar_macros.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-th-list { - background: url("../assets/ui/icon_sidebar_rolltable.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="tables"] { + background-image: url("../assets/ui/d100.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-music { - background: url("../assets/ui/icon_sidebar_music.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="playlists"] { + background-image: url("../assets/ui/icon_sidebar_music.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-atlas { - background: url("../assets/ui/icon_sidebar_compendium.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="compendium"] { + background-image: url("../assets/ui/icon_sidebar_compendium.svg"); } -.system-foundryvtt-reve-de-dragon #sidebar #sidebar-tabs i.fa-cogs { - background: url("../assets/ui/icon_sidebar_settings.svg") no-repeat; +.system-foundryvtt-reve-de-dragon #sidebar-tabs menu button[data-tab="settings"] { + background-image: url("../assets/ui/icon_sidebar_settings.svg"); } .system-foundryvtt-reve-de-dragon #combat #combat-controls { box-shadow: inset 0 0 2rem rgba(0, 0, 0, 0.5); @@ -1954,55 +1952,6 @@ select, border-image-width: 4px; border-image-outset: 0px; } -.system-foundryvtt-reve-de-dragon .window-app.calendar { - display: inline-block; - background: none; - margin: 0; - padding: 0; - box-shadow: none; - pointer-events: none; - max-height: fit-content; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar header.window-header { - min-width: fit-content; - height: 1.4rem; - pointer-events: all; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar .window-content { - margin: 0; - padding: 0; - z-index: 100; - flex-direction: column; - min-width: 250px; - height: fit-content; - background: hsla(0, 0%, 0%, 0); - font-family: "GoudyAcc"; - pointer-events: none; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar .window-content div:is(.calendar-boutons-heure, .horloge-digitale) { - pointer-events: all; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar .window-content div.horloge-analogique { - pointer-events: none; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar .window-content div.horloge-analogique div.horloge-roue { - pointer-events: all; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-roue { - position: relative; - margin-bottom: 7px; - left: 0; - width: 8rem; - height: 8rem; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-roue div.horloge-heure { - width: 1.4rem; - height: 1.4rem; -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-roue div.horloge-heure img.horloge-heure-img { - width: 1.4rem; - height: 1.4rem; -} .system-foundryvtt-reve-de-dragon div.horloge-roue div { position: absolute; border: none; @@ -2064,157 +2013,207 @@ select, .system-foundryvtt-reve-de-dragon div.horloge-roue div img { border: none; } -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-01 { - top: calc(50% - 0.7rem + 0 * 38%); - left: calc(50% - 0.7rem + -1 * 38%); +.system-foundryvtt-reve-de-dragon .calendar { + display: inline-block; + background: none; + margin: 0; + padding: 0; + box-shadow: none; + pointer-events: none; + max-height: fit-content; } -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-02 { - top: calc(50% - 0.7rem + -0.5 * 38%); - left: calc(50% - 0.7rem + -0.8660254 * 38%); +.system-foundryvtt-reve-de-dragon .calendar header.window-header { + min-width: fit-content; + height: 1.4rem; + pointer-events: all; } -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-03 { - top: calc(50% - 0.7rem + -0.8660254 * 38%); - left: calc(50% - 0.7rem + -0.5 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-04 { - top: calc(50% - 0.7rem + -1 * 38%); - left: calc(50% - 0.7rem + 0 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-05 { - top: calc(50% - 0.7rem + -0.8660254 * 38%); - left: calc(50% - 0.7rem + 0.5 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-06 { - top: calc(50% - 0.7rem + -0.5 * 38%); - left: calc(50% - 0.7rem + 0.8660254 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-07 { - top: calc(50% - 0.7rem + 0 * 38%); - left: calc(50% - 0.7rem + 1 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-08 { - top: calc(50% - 0.7rem + 0.5 * 38%); - left: calc(50% - 0.7rem + 0.8660254 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-09 { - top: calc(50% - 0.7rem + 0.8660254 * 38%); - left: calc(50% - 0.7rem + 0.5 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-10 { - top: calc(50% - 0.7rem + 1 * 38%); - left: calc(50% - 0.7rem + 0 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-11 { - top: calc(50% - 0.7rem + 0.8660254 * 38%); - left: calc(50% - 0.7rem + -0.5 * 38%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar div.horloge-heure.heure-12 { - top: calc(50% - 0.7rem + 0.5 * 38%); - left: calc(50% - 0.7rem + -0.8660254 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-01 { - top: calc(50% - 1rem + 0 * 41%); - left: calc(50% - 1rem + -1 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-02 { - top: calc(50% - 1rem + -0.5 * 41%); - left: calc(50% - 1rem + -0.8660254 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-03 { - top: calc(50% - 1rem + -0.8660254 * 41%); - left: calc(50% - 1rem + -0.5 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-04 { - top: calc(50% - 1rem + -1 * 41%); - left: calc(50% - 1rem + 0 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-05 { - top: calc(50% - 1rem + -0.8660254 * 41%); - left: calc(50% - 1rem + 0.5 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-06 { - top: calc(50% - 1rem + -0.5 * 41%); - left: calc(50% - 1rem + 0.8660254 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-07 { - top: calc(50% - 1rem + 0 * 41%); - left: calc(50% - 1rem + 1 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-08 { - top: calc(50% - 1rem + 0.5 * 41%); - left: calc(50% - 1rem + 0.8660254 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-09 { - top: calc(50% - 1rem + 0.8660254 * 41%); - left: calc(50% - 1rem + 0.5 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-10 { - top: calc(50% - 1rem + 1 * 41%); - left: calc(50% - 1rem + 0 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-11 { - top: calc(50% - 1rem + 0.8660254 * 41%); - left: calc(50% - 1rem + -0.5 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-heure.heure-12 { - top: calc(50% - 1rem + 0.5 * 41%); - left: calc(50% - 1rem + -0.8660254 * 41%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-01 { - top: calc(50% - 0.4rem + 0 * 28%); - left: calc(50% - 0.4rem + -1 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-02 { - top: calc(50% - 0.4rem + -0.5 * 28%); - left: calc(50% - 0.4rem + -0.8660254 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-03 { - top: calc(50% - 0.4rem + -0.8660254 * 28%); - left: calc(50% - 0.4rem + -0.5 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-04 { - top: calc(50% - 0.4rem + -1 * 28%); - left: calc(50% - 0.4rem + 0 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-05 { - top: calc(50% - 0.4rem + -0.8660254 * 28%); - left: calc(50% - 0.4rem + 0.5 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-06 { - top: calc(50% - 0.4rem + -0.5 * 28%); - left: calc(50% - 0.4rem + 0.8660254 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-07 { - top: calc(50% - 0.4rem + 0 * 28%); - left: calc(50% - 0.4rem + 1 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-08 { - top: calc(50% - 0.4rem + 0.5 * 28%); - left: calc(50% - 0.4rem + 0.8660254 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-09 { - top: calc(50% - 0.4rem + 0.8660254 * 28%); - left: calc(50% - 0.4rem + 0.5 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-10 { - top: calc(50% - 0.4rem + 1 * 28%); - left: calc(50% - 0.4rem + 0 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-11 { - top: calc(50% - 0.4rem + 0.8660254 * 28%); - left: calc(50% - 0.4rem + -0.5 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar-astrologie div.horloge-ajustement.heure-12 { - top: calc(50% - 0.4rem + 0.5 * 28%); - left: calc(50% - 0.4rem + -0.8660254 * 28%); -} -.system-foundryvtt-reve-de-dragon .window-app.calendar header.window-header h4 { +.system-foundryvtt-reve-de-dragon .calendar header.window-header h4 { font-size: 0.8rem; } -.system-foundryvtt-reve-de-dragon .window-app.calendar section.window-content div.calendar-boutons-heure { +.system-foundryvtt-reve-de-dragon .calendar .window-content { + margin: 0; + padding: 0; + z-index: 100; + flex-direction: column; + min-width: 250px; + height: fit-content; + background: hsla(0, 0%, 0%, 0); + font-family: "GoudyAcc"; + pointer-events: none; +} +.system-foundryvtt-reve-de-dragon .calendar .window-content div.calendar-boutons-heure { display: grid; background: hsl(0, 0%, 20%); color: hsla(0, 0%, 80%, 0.8); + pointer-events: all; +} +.system-foundryvtt-reve-de-dragon .calendar .window-content div.horloge-digitale { + pointer-events: all; +} +.system-foundryvtt-reve-de-dragon .calendar .window-content div.horloge-analogique { + pointer-events: none; +} +.system-foundryvtt-reve-de-dragon .calendar .window-content div.horloge-analogique div.horloge-roue { + pointer-events: all; +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-roue { + position: relative; + margin-bottom: 7px; + left: 0; + width: 8rem; + height: 8rem; +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-roue div.horloge-heure { + width: 1.4rem; + height: 1.4rem; +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-roue div.horloge-heure img.horloge-heure-img { + width: 1.4rem; + height: 1.4rem; +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-01 { + top: calc(50% - 0.7rem + 0 * 38%); + left: calc(50% - 0.7rem + -1 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-02 { + top: calc(50% - 0.7rem + -0.5 * 38%); + left: calc(50% - 0.7rem + -0.8660254 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-03 { + top: calc(50% - 0.7rem + -0.8660254 * 38%); + left: calc(50% - 0.7rem + -0.5 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-04 { + top: calc(50% - 0.7rem + -1 * 38%); + left: calc(50% - 0.7rem + 0 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-05 { + top: calc(50% - 0.7rem + -0.8660254 * 38%); + left: calc(50% - 0.7rem + 0.5 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-06 { + top: calc(50% - 0.7rem + -0.5 * 38%); + left: calc(50% - 0.7rem + 0.8660254 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-07 { + top: calc(50% - 0.7rem + 0 * 38%); + left: calc(50% - 0.7rem + 1 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-08 { + top: calc(50% - 0.7rem + 0.5 * 38%); + left: calc(50% - 0.7rem + 0.8660254 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-09 { + top: calc(50% - 0.7rem + 0.8660254 * 38%); + left: calc(50% - 0.7rem + 0.5 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-10 { + top: calc(50% - 0.7rem + 1 * 38%); + left: calc(50% - 0.7rem + 0 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-11 { + top: calc(50% - 0.7rem + 0.8660254 * 38%); + left: calc(50% - 0.7rem + -0.5 * 38%); +} +.system-foundryvtt-reve-de-dragon .calendar div.horloge-heure.heure-12 { + top: calc(50% - 0.7rem + 0.5 * 38%); + left: calc(50% - 0.7rem + -0.8660254 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-01 { + top: calc(50% - 1rem + 0 * 41%); + left: calc(50% - 1rem + -1 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-02 { + top: calc(50% - 1rem + -0.5 * 41%); + left: calc(50% - 1rem + -0.8660254 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-03 { + top: calc(50% - 1rem + -0.8660254 * 41%); + left: calc(50% - 1rem + -0.5 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-04 { + top: calc(50% - 1rem + -1 * 41%); + left: calc(50% - 1rem + 0 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-05 { + top: calc(50% - 1rem + -0.8660254 * 41%); + left: calc(50% - 1rem + 0.5 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-06 { + top: calc(50% - 1rem + -0.5 * 41%); + left: calc(50% - 1rem + 0.8660254 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-07 { + top: calc(50% - 1rem + 0 * 41%); + left: calc(50% - 1rem + 1 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-08 { + top: calc(50% - 1rem + 0.5 * 41%); + left: calc(50% - 1rem + 0.8660254 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-09 { + top: calc(50% - 1rem + 0.8660254 * 41%); + left: calc(50% - 1rem + 0.5 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-10 { + top: calc(50% - 1rem + 1 * 41%); + left: calc(50% - 1rem + 0 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-11 { + top: calc(50% - 1rem + 0.8660254 * 41%); + left: calc(50% - 1rem + -0.5 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-heure.heure-12 { + top: calc(50% - 1rem + 0.5 * 41%); + left: calc(50% - 1rem + -0.8660254 * 41%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-01 { + top: calc(50% - 0.4rem + 0 * 28%); + left: calc(50% - 0.4rem + -1 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-02 { + top: calc(50% - 0.4rem + -0.5 * 28%); + left: calc(50% - 0.4rem + -0.8660254 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-03 { + top: calc(50% - 0.4rem + -0.8660254 * 28%); + left: calc(50% - 0.4rem + -0.5 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-04 { + top: calc(50% - 0.4rem + -1 * 28%); + left: calc(50% - 0.4rem + 0 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-05 { + top: calc(50% - 0.4rem + -0.8660254 * 28%); + left: calc(50% - 0.4rem + 0.5 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-06 { + top: calc(50% - 0.4rem + -0.5 * 28%); + left: calc(50% - 0.4rem + 0.8660254 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-07 { + top: calc(50% - 0.4rem + 0 * 28%); + left: calc(50% - 0.4rem + 1 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-08 { + top: calc(50% - 0.4rem + 0.5 * 28%); + left: calc(50% - 0.4rem + 0.8660254 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-09 { + top: calc(50% - 0.4rem + 0.8660254 * 28%); + left: calc(50% - 0.4rem + 0.5 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-10 { + top: calc(50% - 0.4rem + 1 * 28%); + left: calc(50% - 0.4rem + 0 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-11 { + top: calc(50% - 0.4rem + 0.8660254 * 28%); + left: calc(50% - 0.4rem + -0.5 * 28%); +} +.system-foundryvtt-reve-de-dragon .calendar-astrologie div.horloge-ajustement.heure-12 { + top: calc(50% - 0.4rem + 0.5 * 28%); + left: calc(50% - 0.4rem + -0.8660254 * 28%); } .system-foundryvtt-reve-de-dragon .calendar-boutons-heure .calendar-btn:is(.calendar-lyre,.calendar-vaisseau) img { color: hsla(0, 0%, 100%, 0.5); diff --git a/less/foundryvtt-reve-de-dragon.less b/less/foundryvtt-reve-de-dragon.less index 31a45975..ea99b12b 100644 --- a/less/foundryvtt-reve-de-dragon.less +++ b/less/foundryvtt-reve-de-dragon.less @@ -7,10 +7,6 @@ @import "item/munition.less"; @import "item/tarot.less"; - // body { - // --input-height: 1.4rem; - // } - .window-header{ background: rgba(0,0,0,0.75); } @@ -78,10 +74,16 @@ .sheet-header :is(.header-compteurs,.header-etats,.profile-img, .profile-img-token){ padding: 0 0.4rem; } - - .sheet-header .header-etats div div{ - display: flex; - flex-direction: row; + .sheet-header div.header-etats { + width: calc(40% - 32px - 1rem); + height: 48px; + max-width: fit-content; + flex: initial; + flex-grow: 3; + div div{ + display: flex; + flex-direction: row; + } } .sheet-header :is(.profile-img, .profile-img-token) { @@ -121,13 +123,6 @@ max-width: fit-content; } - .sheet-header div.header-etats { - width: calc(40% - 32px - 1rem); - height: 48px; - max-width: fit-content; - flex: initial; - } - .sheet-header .resource-content { width: 2rem; } @@ -579,51 +574,55 @@ height: 100%; } - .rdd.sheet .window-content {overflow: hidden;} - .rdd.sheet .window-content .sheet-body {overflow-y: scroll;} - .rdd.sheet .window-content .sheet-body .tab {padding-bottom: 30px;} - .rdd.sheet .window-content .sheet-body .competence-list {width: 100%;} - .rdd.sheet .window-content .sheet-body .carac-list { - width: 100%; - flex-grow: 0; - } - - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique { - flex-wrap: nowrap; - justify-content: stretch; - } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique.streched { - flex-wrap: nowrap; - justify-content: stretch; - flex-basis: 7.5em; - width: max-content; - } - .carac-label { font-weight: bold; flex-basis: 40%; } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique > .utiliser-attribut { - flex-basis: available; - flex-grow: 1; - } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique .carac-value { - flex-basis: 15%; - flex-grow: 0; - } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique .carac-xp { - flex-basis: 13%; - flex-grow: 0; - } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique .derivee-label { - flex-grow: 1; - } - .rdd.sheet .window-content .sheet-body .carac-list .caracteristique .derivee-value { - flex-grow: 0; - flex-basis: 15%; - margin-right: 0.2rem; - margin-left: 0.2rem; + .rdd.sheet { + .window-content { + overflow: hidden; + .sheet-body { + overflow-y: scroll; + .tab {padding-bottom: 30px;} + .competence-list {width: 100%;} + .carac-list { + width: 100%; + flex-grow: 0; + + .caracteristique.streched { + flex-wrap: nowrap; + justify-content: stretch; + flex-basis: 7.5em; + width: max-content; + } + + .caracteristique { + flex-wrap: nowrap; + justify-content: stretch; + + .carac-value { + flex-basis: 15%; + flex-grow: 0; + } + .carac-xp { + flex-basis: 13%; + flex-grow: 0; + } + .derivee-label { + flex-grow: 1; + } + .derivee-value { + flex-grow: 0; + flex-basis: 15%; + margin-right: 0.2rem; + margin-left: 0.2rem; + } + } + } + } + } } + .flex-grow-1 { flex-grow: 1; } @@ -834,26 +833,27 @@ } .poesie-extrait { + max-height: 12rem; font-size: 0.8rem; font-style: italic; + color: rgba(82, 17, 131, 0.9); + overflow: hidden; } - .poesie-reference{ + .poesie-extrait:hover { + max-height: unset; + overflow: visible; + opacity: 1; + } + .poesie-extrait.poesie-overflow { + max-height: 2rem; + } + + .poesie-reference { font-size: 0.7rem; text-align: right; } - .poesie-overflow { - color: rgba(82, 17, 131, 0.9); - max-height: 1.5rem; - overflow: hidden; - border-left: 1px dotted black; /* If you want dots under the hoverable text */ - } - .poesie-overflow:hover { - max-height: unset; - overflow: visible; - border-left: 0px - } - .type-compendium{ + .type-compendium { font-size: 0.6rem; } @@ -922,27 +922,26 @@ color: var(--color-text-dark-primary); border-radius: 3px; } - .app-calendar-astrologie div.theme-astral{ - width: 14rem; - margin: 0.4rem; - } - - .app-calendar-astrologie div.horloge-roue { - position: relative; - left: calc(50% - 6.5rem); - width: 13rem; - height: 13rem; - } - - .app-calendar-astrologie div.horloge-roue div.horloge-heure { - position: absolute; - width: 1.8rem; - height: 1.8rem; - } - - .app-calendar-astrologie div.horloge-roue div.horloge-heure img.horloge-heure-img { - width: 2rem; - height: 2rem; + .app-calendar-astrologie{ + div.theme-astral{ + width: 14rem; + margin: 0.4rem; + } + div.horloge-roue { + position: relative; + left: calc(50% - 6.5rem); + width: 13rem; + height: 13rem; + div.horloge-heure { + position: absolute; + width: 1.8rem; + height: 1.8rem; + img.horloge-heure-img { + width: 2rem; + height: 2rem; + } + } + } } .window-app .window-content, .window-app.sheet .window-content .sheet-body{ @@ -1476,27 +1475,29 @@ cursor: pointer; } - - .chat-message h4 { - font-size: 0.9rem; + .chat-message { + background: var(--color-background-chat-message); + + h4 { + font-size: 0.9rem; + } + .message-content { + text-align: justify; + } + header.message-header .heure-rdd { + font-size: 0.7rem; + flex-grow: 3; + } + hr { + margin: 0.2rem 0; + } + } - .chat-message .message-content { - text-align: justify; - } - .chat-message header.message-header .heure-rdd { - font-size: 0.7rem; - flex-grow: 3; - } - .chat-message.whisper { - background: rgba(220,220,210,0.75); + background: var(--color-background-chat-whisper); border: 2px solid #545469; } - .chat-message hr { - margin: 0.2rem 0; - } - .chat-icon { border: 0; padding: 2px 6px 2px 2px; @@ -1520,49 +1521,49 @@ vertical-align: bottom; } - #sidebar-tabs { - flex: 0 0 28px; - box-sizing: border-box; - margin: 0 0 3px; - border-bottom: 1px solid rgba(0,0,0,0); - box-shadow: inset 0 0 2rem rgba(0,0,0,0.5); + #sidebar-tabs menu { + button:is( + [data-tab="chat"], + [data-tab="combat"], + [data-tab="scenes"], + [data-tab="actors"], + [data-tab="items"], + [data-tab="journal"], + [data-tab="cards"], + [data-tab="macros"], + [data-tab="tables"], + [data-tab="playlists"], + [data-tab="compendium"], + [data-tab="settings"] + )::before{ content: none; } + + button { + background-repeat: no-repeat; + } + button[aria-pressed="false"] { + background-color: hsla(30, 37%, 50%, 0.5); + } + button[aria-pressed="true"] { + border: 1px solid hsla(15, 80%, 30%, 1); + background-color: hsla(30, 100%, 90%, 0.6); + box-shadow: 0 0 3px inset hsla(15, 80%, 30%, 1); + } + button[data-tab="chat"] { background-image: url("../assets/ui/icon_sidebar_chat.svg"); } + button[data-tab="combat"] { background-image: url("../assets/ui/icon_sidebar_fight.svg"); } + button[data-tab="scenes"] { background-image: url("../assets/ui/icon_sidebar_scene.svg"); } + button[data-tab="actors"] { background-image: url("../assets/ui/icon_sidebar_actor.svg"); } + button[data-tab="items"] { background-image: url("../assets/ui/icon_sidebar_item.svg"); } + button[data-tab="journal"] { background-image: url("../assets/ui/icon_sidebar_journal.svg"); } + button[data-tab="cards"] { background-image: url("../assets/ui/icon_sidebar_cards.svg"); } + button[data-tab="macros"] { background-image: url("../assets/ui/icon_sidebar_macros.svg"); } + button[data-tab="tables"] { background-image: url("../assets/ui/d100.svg"); } + button[data-tab="playlists"] { background-image: url("../assets/ui/icon_sidebar_music.svg"); } + button[data-tab="compendium"] { background-image: url("../assets/ui/icon_sidebar_compendium.svg"); } + button[data-tab="settings"] { background-image: url("../assets/ui/icon_sidebar_settings.svg"); } } - - #sidebar-tabs > .item.active { - border: 1px solid rgba(114,98,72,1); - background: rgba(30, 25, 20, 0.75); - box-shadow: 0 0 6px inset rgba(114,98,72,1); - } - - #sidebar #sidebar-tabs i{ - width: 23px; - height: 23px; - display: inline-block; - background-position:center; - background-size:cover; - text-shadow: 1px 1px 0 rgba(0,0,0,0.75); - - } - - #sidebar #sidebar-tabs i:is( - .fa-comments, .fa-fist-raised, .fa-swords, - .fa-users, .fa-user, .fa-map, .fa-suitcase, - .fa-book-open, .fa-th-list, .fa-music, - .fa-atlas,.fa-cogs - ):before {content: "";} - #sidebar #sidebar-tabs i.fa-comments {background: url("../assets/ui/icon_sidebar_chat.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-fist-raised {background: url("../assets/ui/icon_sidebar_fight.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-swords {background: url("../assets/ui/icon_sidebar_fight.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-user {background: url("../assets/ui/icon_sidebar_actor.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-users {background: url("../assets/ui/icon_sidebar_actor.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-map {background: url("../assets/ui/icon_sidebar_scene.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-suitcase {background: url("../assets/ui/icon_sidebar_item.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-book-open {background: url("../assets/ui/icon_sidebar_journal.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-th-list {background: url("../assets/ui/icon_sidebar_rolltable.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-music {background: url("../assets/ui/icon_sidebar_music.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-atlas {background: url("../assets/ui/icon_sidebar_compendium.svg") no-repeat;} - #sidebar #sidebar-tabs i.fa-cogs {background: url("../assets/ui/icon_sidebar_settings.svg") no-repeat;} - + + + // #sidebar #sidebar-tabs i.fa-th-list {background: url("../assets/ui/icon_sidebar_rolltable.svg") no-repeat;} #combat #combat-controls { box-shadow: inset 0 0 2rem rgba(0,0,0,0.5); } @@ -1647,63 +1648,6 @@ border-image-outset: 0px; } - - .window-app.calendar { - display: inline-block; - background: none; - margin: 0; - padding: 0; - box-shadow: none; - pointer-events: none; - max-height: fit-content; - } - - .window-app.calendar header.window-header { - min-width: fit-content; - height: 1.4rem; - pointer-events: all; - } - - .window-app.calendar .window-content { - margin: 0; - padding: 0; - z-index: 100; - flex-direction: column; - min-width: 250px; - height: fit-content; - background: hsla(0, 0%, 0%, 0.0); - font-family: "GoudyAcc"; - pointer-events: none; - } - - .window-app.calendar .window-content div:is(.calendar-boutons-heure, .horloge-digitale) { - pointer-events: all; - } - .window-app.calendar .window-content div.horloge-analogique { - pointer-events: none; - } - - .window-app.calendar .window-content div.horloge-analogique div.horloge-roue { - pointer-events: all; - } - - .window-app.calendar div.horloge-roue { - position: relative; - margin-bottom: 7px; - left: 0; - width: 8rem; - height: 8rem; - } - - .window-app.calendar div.horloge-roue div.horloge-heure { - width: 1.4rem; - height: 1.4rem; - } - .window-app.calendar div.horloge-roue div.horloge-heure img.horloge-heure-img { - width: 1.4rem; - height: 1.4rem; - } - div.horloge-roue div { position: absolute; border: none; @@ -1748,74 +1692,130 @@ div.horloge-roue div img { border: none; } + + + .calendar { + + display: inline-block; + background: none; + margin: 0; + padding: 0; + box-shadow: none; + pointer-events: none; + max-height: fit-content; + + header.window-header { + min-width: fit-content; + height: 1.4rem; + pointer-events: all; + h4 { + font-size: 0.8rem; + } + } + .window-content { + margin: 0; + padding: 0; + z-index: 100; + flex-direction: column; + min-width: 250px; + height: fit-content; + background: hsla(0, 0%, 0%, 0.0); + font-family: "GoudyAcc"; + pointer-events: none; + div.calendar-boutons-heure { + display: grid; + background: hsla(0, 0%, 20%, 1); + color: hsla(0, 0%, 80%, 0.8); + pointer-events: all; + } + div.horloge-digitale { + pointer-events: all; + } + div.horloge-analogique { + pointer-events: none; + } + div.horloge-analogique div.horloge-roue { + pointer-events: all; + } + } + div.horloge-roue { + position: relative; + margin-bottom: 7px; + left: 0; + width: 8rem; + height: 8rem; + div.horloge-heure { + width: 1.4rem; + height: 1.4rem; + img.horloge-heure-img { + width: 1.4rem; + height: 1.4rem; + } + } + } - .window-app.calendar div.horloge-heure.heure-01 { top: calc(50% - 0.7rem + sin(-180deg) *38%); left: calc(50% - 0.7rem + cos(-180deg) *38%); } - .window-app.calendar div.horloge-heure.heure-02 { top: calc(50% - 0.7rem + sin(-150deg) *38%); left: calc(50% - 0.7rem + cos(-150deg) *38%); } - .window-app.calendar div.horloge-heure.heure-03 { top: calc(50% - 0.7rem + sin(-120deg) *38%); left: calc(50% - 0.7rem + cos(-120deg) *38%); } - .window-app.calendar div.horloge-heure.heure-04 { top: calc(50% - 0.7rem + sin(-90deg) *38%); left: calc(50% - 0.7rem + cos(-90deg) *38%); } - .window-app.calendar div.horloge-heure.heure-05 { top: calc(50% - 0.7rem + sin(-60deg) *38%); left: calc(50% - 0.7rem + cos(-60deg) *38%); } - .window-app.calendar div.horloge-heure.heure-06 { top: calc(50% - 0.7rem + sin(-30deg) *38%); left: calc(50% - 0.7rem + cos(-30deg) *38%); } - .window-app.calendar div.horloge-heure.heure-07 { top: calc(50% - 0.7rem + sin(-0deg) *38%); left: calc(50% - 0.7rem + cos(-0deg) *38%); } - .window-app.calendar div.horloge-heure.heure-08 { top: calc(50% - 0.7rem + sin(30deg) *38%); left: calc(50% - 0.7rem + cos(30deg) *38%); } - .window-app.calendar div.horloge-heure.heure-09 { top: calc(50% - 0.7rem + sin(60deg) *38%); left: calc(50% - 0.7rem + cos(60deg) *38%); } - .window-app.calendar div.horloge-heure.heure-10 { top: calc(50% - 0.7rem + sin(90deg) *38%); left: calc(50% - 0.7rem + cos(90deg) *38%); } - .window-app.calendar div.horloge-heure.heure-11 { top: calc(50% - 0.7rem + sin(120deg) *38%); left: calc(50% - 0.7rem + cos(120deg) *38%); } - .window-app.calendar div.horloge-heure.heure-12 { top: calc(50% - 0.7rem + sin(150deg) *38%); left: calc(50% - 0.7rem + cos(150deg) *41%); } - - .window-app.calendar-astrologie div.horloge-heure.heure-01 { top: calc(50% - 1rem + sin(-180deg) *41%); left: calc(50% - 1rem + cos(-180deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-02 { top: calc(50% - 1rem + sin(-150deg) *41%); left: calc(50% - 1rem + cos(-150deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-03 { top: calc(50% - 1rem + sin(-120deg) *41%); left: calc(50% - 1rem + cos(-120deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-04 { top: calc(50% - 1rem + sin(-90deg) *41%); left: calc(50% - 1rem + cos(-90deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-05 { top: calc(50% - 1rem + sin(-60deg) *41%); left: calc(50% - 1rem + cos(-60deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-06 { top: calc(50% - 1rem + sin(-30deg) *41%); left: calc(50% - 1rem + cos(-30deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-07 { top: calc(50% - 1rem + sin(-0deg) *41%); left: calc(50% - 1rem + cos(-0deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-08 { top: calc(50% - 1rem + sin(30deg) *41%); left: calc(50% - 1rem + cos(30deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-09 { top: calc(50% - 1rem + sin(60deg) *41%); left: calc(50% - 1rem + cos(60deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-10 { top: calc(50% - 1rem + sin(90deg) *41%); left: calc(50% - 1rem + cos(90deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-11 { top: calc(50% - 1rem + sin(120deg) *41%); left: calc(50% - 1rem + cos(120deg) *41%); } - .window-app.calendar-astrologie div.horloge-heure.heure-12 { top: calc(50% - 1rem + sin(150deg) *41%); left: calc(50% - 1rem + cos(150deg) *41%); } - - .window-app.calendar-astrologie div.horloge-ajustement.heure-01 { top: calc(50% - 0.4rem + sin(180deg) * 28%); left: calc(50% - 0.4rem + cos(180deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-02 { top: calc(50% - 0.4rem + sin(-150deg) * 28%); left: calc(50% - 0.4rem + cos(-150deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-03 { top: calc(50% - 0.4rem + sin(-120deg) * 28%); left: calc(50% - 0.4rem + cos(-120deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-04 { top: calc(50% - 0.4rem + sin(-90deg) * 28%); left: calc(50% - 0.4rem + cos(-90deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-05 { top: calc(50% - 0.4rem + sin(-60deg) * 28%); left: calc(50% - 0.4rem + cos(-60deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-06 { top: calc(50% - 0.4rem + sin(-30deg) * 28%); left: calc(50% - 0.4rem + cos(-30deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-07 { top: calc(50% - 0.4rem + sin(0deg) * 28%); left: calc(50% - 0.4rem + cos(0deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-08 { top: calc(50% - 0.4rem + sin(30deg) * 28%); left: calc(50% - 0.4rem + cos(30deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-09 { top: calc(50% - 0.4rem + sin(60deg) * 28%); left: calc(50% - 0.4rem + cos(60deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-10 { top: calc(50% - 0.4rem + sin(90deg) * 28%); left: calc(50% - 0.4rem + cos(90deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-11 { top: calc(50% - 0.4rem + sin(120deg) * 28%); left: calc(50% - 0.4rem + cos(120deg) * 28%); } - .window-app.calendar-astrologie div.horloge-ajustement.heure-12 { top: calc(50% - 0.4rem + sin(150deg) * 28%); left: calc(50% - 0.4rem + cos(150deg) * 28%); } - - .window-app.calendar header.window-header h4 { - font-size: 0.8rem; + div.horloge-heure.heure-01 { top: calc(50% - 0.7rem + sin(-180deg) *38%); left: calc(50% - 0.7rem + cos(-180deg) *38%); } + div.horloge-heure.heure-02 { top: calc(50% - 0.7rem + sin(-150deg) *38%); left: calc(50% - 0.7rem + cos(-150deg) *38%); } + div.horloge-heure.heure-03 { top: calc(50% - 0.7rem + sin(-120deg) *38%); left: calc(50% - 0.7rem + cos(-120deg) *38%); } + div.horloge-heure.heure-04 { top: calc(50% - 0.7rem + sin(-90deg) *38%); left: calc(50% - 0.7rem + cos(-90deg) *38%); } + div.horloge-heure.heure-05 { top: calc(50% - 0.7rem + sin(-60deg) *38%); left: calc(50% - 0.7rem + cos(-60deg) *38%); } + div.horloge-heure.heure-06 { top: calc(50% - 0.7rem + sin(-30deg) *38%); left: calc(50% - 0.7rem + cos(-30deg) *38%); } + div.horloge-heure.heure-07 { top: calc(50% - 0.7rem + sin(-0deg) *38%); left: calc(50% - 0.7rem + cos(-0deg) *38%); } + div.horloge-heure.heure-08 { top: calc(50% - 0.7rem + sin(30deg) *38%); left: calc(50% - 0.7rem + cos(30deg) *38%); } + div.horloge-heure.heure-09 { top: calc(50% - 0.7rem + sin(60deg) *38%); left: calc(50% - 0.7rem + cos(60deg) *38%); } + div.horloge-heure.heure-10 { top: calc(50% - 0.7rem + sin(90deg) *38%); left: calc(50% - 0.7rem + cos(90deg) *38%); } + div.horloge-heure.heure-11 { top: calc(50% - 0.7rem + sin(120deg) *38%); left: calc(50% - 0.7rem + cos(120deg) *38%); } + div.horloge-heure.heure-12 { top: calc(50% - 0.7rem + sin(150deg) *38%); left: calc(50% - 0.7rem + cos(150deg) *41%); } } - .window-app.calendar section.window-content div.calendar-boutons-heure { - display: grid; - background: hsla(0, 0%, 20%, 1); - color: hsla(0, 0%, 80%, 0.8); + .calendar-astrologie { + div.horloge-heure.heure-01 { top: calc(50% - 1rem + sin(-180deg) *41%); left: calc(50% - 1rem + cos(-180deg) *41%); } + div.horloge-heure.heure-02 { top: calc(50% - 1rem + sin(-150deg) *41%); left: calc(50% - 1rem + cos(-150deg) *41%); } + div.horloge-heure.heure-03 { top: calc(50% - 1rem + sin(-120deg) *41%); left: calc(50% - 1rem + cos(-120deg) *41%); } + div.horloge-heure.heure-04 { top: calc(50% - 1rem + sin(-90deg) *41%); left: calc(50% - 1rem + cos(-90deg) *41%); } + div.horloge-heure.heure-05 { top: calc(50% - 1rem + sin(-60deg) *41%); left: calc(50% - 1rem + cos(-60deg) *41%); } + div.horloge-heure.heure-06 { top: calc(50% - 1rem + sin(-30deg) *41%); left: calc(50% - 1rem + cos(-30deg) *41%); } + div.horloge-heure.heure-07 { top: calc(50% - 1rem + sin(-0deg) *41%); left: calc(50% - 1rem + cos(-0deg) *41%); } + div.horloge-heure.heure-08 { top: calc(50% - 1rem + sin(30deg) *41%); left: calc(50% - 1rem + cos(30deg) *41%); } + div.horloge-heure.heure-09 { top: calc(50% - 1rem + sin(60deg) *41%); left: calc(50% - 1rem + cos(60deg) *41%); } + div.horloge-heure.heure-10 { top: calc(50% - 1rem + sin(90deg) *41%); left: calc(50% - 1rem + cos(90deg) *41%); } + div.horloge-heure.heure-11 { top: calc(50% - 1rem + sin(120deg) *41%); left: calc(50% - 1rem + cos(120deg) *41%); } + div.horloge-heure.heure-12 { top: calc(50% - 1rem + sin(150deg) *41%); left: calc(50% - 1rem + cos(150deg) *41%); } + + div.horloge-ajustement.heure-01 { top: calc(50% - 0.4rem + sin(180deg) * 28%); left: calc(50% - 0.4rem + cos(180deg) * 28%); } + div.horloge-ajustement.heure-02 { top: calc(50% - 0.4rem + sin(-150deg) * 28%); left: calc(50% - 0.4rem + cos(-150deg) * 28%); } + div.horloge-ajustement.heure-03 { top: calc(50% - 0.4rem + sin(-120deg) * 28%); left: calc(50% - 0.4rem + cos(-120deg) * 28%); } + div.horloge-ajustement.heure-04 { top: calc(50% - 0.4rem + sin(-90deg) * 28%); left: calc(50% - 0.4rem + cos(-90deg) * 28%); } + div.horloge-ajustement.heure-05 { top: calc(50% - 0.4rem + sin(-60deg) * 28%); left: calc(50% - 0.4rem + cos(-60deg) * 28%); } + div.horloge-ajustement.heure-06 { top: calc(50% - 0.4rem + sin(-30deg) * 28%); left: calc(50% - 0.4rem + cos(-30deg) * 28%); } + div.horloge-ajustement.heure-07 { top: calc(50% - 0.4rem + sin(0deg) * 28%); left: calc(50% - 0.4rem + cos(0deg) * 28%); } + div.horloge-ajustement.heure-08 { top: calc(50% - 0.4rem + sin(30deg) * 28%); left: calc(50% - 0.4rem + cos(30deg) * 28%); } + div.horloge-ajustement.heure-09 { top: calc(50% - 0.4rem + sin(60deg) * 28%); left: calc(50% - 0.4rem + cos(60deg) * 28%); } + div.horloge-ajustement.heure-10 { top: calc(50% - 0.4rem + sin(90deg) * 28%); left: calc(50% - 0.4rem + cos(90deg) * 28%); } + div.horloge-ajustement.heure-11 { top: calc(50% - 0.4rem + sin(120deg) * 28%); left: calc(50% - 0.4rem + cos(120deg) * 28%); } + div.horloge-ajustement.heure-12 { top: calc(50% - 0.4rem + sin(150deg) * 28%); left: calc(50% - 0.4rem + cos(150deg) * 28%); } + } + + .calendar-boutons-heure { + .calendar-btn:is(.calendar-lyre,.calendar-vaisseau) img { + color: hsla(0, 0%, 100%, 0.5); + border: none; + vertical-align: bottom; + max-width: 1.2em; + max-height: 1.2em; + margin: 1px; + } + i { + border: 1px solid rgba(0, 0, 0, 0); + } + a:hover { + color: var(--color-controls-hover); + border: 1px solid var(--color-control-border-hover); + cursor: pointer; + } } - .calendar-boutons-heure .calendar-btn:is(.calendar-lyre,.calendar-vaisseau) img { - color: hsla(0, 0%, 100%, 0.5); - border: none; - vertical-align: bottom; - max-width: 1.2em; - max-height: 1.2em; - margin: 1px; - } - - .calendar-boutons-heure i { - border: 1px solid rgba(0, 0, 0, 0); - } - .calendar-boutons-heure a:hover { - color: var(--color-controls-hover); - border: 1px solid var(--color-control-border-hover); - cursor: pointer; - } .calendar-1min { grid-column: 1/1; } .calendar-5min { grid-column: 2/2; } @@ -1843,21 +1843,19 @@ background: hsla(0, 0%, 20%, 1); text-align: center; width: 100%; - } - - div.horloge-digitale :is(.calendar-heure-texte,.calendar-minute-texte) { - font-size: 1rem; - pointer-events: all; - margin: 0; - } - - div.horloge-digitale a { - border: 1px solid rgba(0, 0, 0, 0); - } - div.horloge-digitale a:hover { - color: var(--color-controls-hover); - border: 1px solid var(--color-control-border-hover); - cursor: pointer; + :is(.calendar-heure-texte,.calendar-minute-texte) { + font-size: 1rem; + pointer-events: all; + margin: 0; + } + a { + border: 1px solid rgba(0, 0, 0, 0); + } + a:hover { + color: var(--color-controls-hover); + border: 1px solid var(--color-control-border-hover); + cursor: pointer; + } } div.calendar-timestamp-edit select.calendar-signe-heure {