summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/battlemap/www/style.css163
1 files changed, 88 insertions, 75 deletions
diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css
index c8d8fab..17dd289 100644
--- a/src/battlemap/www/style.css
+++ b/src/battlemap/www/style.css
@@ -1,3 +1,6 @@
+/******************************************************************************/
+/** LAYOUT ********************************************************************/
+/******************************************************************************/
.battlemap-left-panel
{
flex-grow: 1;
@@ -14,6 +17,7 @@
display: flex;
}
+/** Left Panel ****************************************************************/
.battlemap-container
{
flex-grow: 1;
@@ -23,6 +27,26 @@
width: inherit;
}
+.battlemap-footer
+{
+ max-height: 30%;
+
+ overflow-y: auto;
+ width: inherit;
+ word-wrap: break-word;
+ padding-bottom: 1em;
+}
+
+/*** Main View ****************************************************************/
+.battlemap-actual
+{
+ display: inline-block;
+ transform-origin: top left;
+}
+
+/******************************************************************************/
+/** RIGHT PANEL ***************************************************************/
+/******************************************************************************/
.battlemap-side-bar
{
flex-grow: 1;
@@ -34,23 +58,78 @@
flex-direction: column;
}
-.battlemap-footer
+.battlemap-tabmenu
{
- max-height: 30%;
+ flex-grow: 1;
+ display: flex;
+ flex-direction: column;
+ flex-wrap: wrap;
+ width: inherit;
+}
- overflow-y: auto;
+/** Tab Menu Specifics ********************************************************/
+.battlemap-tabmenu-selector
+{
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: space-between;
+}
+
+.battlemap-tabmenu-selector button
+{
+ flex: 1;
+}
+
+.battlemap-tabmenu-content
+{
+ flex: initial;
+}
+
+/** General *******************************************************************/
+.battlemap-side-bar-targets
+{
+ flex-grow: 1;
+ display: flex;
+ flex-direction: column;
+ flex-wrap: wrap;
width: inherit;
- word-wrap: break-word;
- padding-bottom: 1em;
}
-.battlemap-actual
+.battlemap-manual-controls
{
- display: inline-block;
- transform-origin: top left;
+ max-height: 30%;
+ width: inherit;
+ flex: initial;
+
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
}
-/** Inside the container ******************************************************/
+/** Tabs **********************************************************************/
+
+/**** Characters Tab */
+.battlemap-tabmenu-characters-tab
+{
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+}
+
+.battlemap-character-portrait
+{
+ margin: 0.5em;
+ box-sizing: border-box;
+ border: 2px solid rgba(0,0,0,0.5);
+ border-radius: 25px 25px 0 25px;
+ width: 100px;
+ height: 100px;
+}
+
+/******************************************************************************/
+/** Main View Elements ********************************************************/
+/******************************************************************************/
.battlemap-tiled
{
height: 32px;
@@ -149,69 +228,3 @@
{
content: "x";
}
-
-/** Footer ********************************************************************/
-.battlemap-tabmenu
-{
- flex-grow: 1;
- display: flex;
- flex-direction: column;
- flex-wrap: wrap;
- width: inherit;
-}
-
-.battlemap-side-bar-targets
-{
- flex-grow: 1;
- display: flex;
- flex-direction: column;
- flex-wrap: wrap;
- width: inherit;
-}
-
-.battlemap-manual-controls
-{
- max-height: 30%;
- width: inherit;
- flex: initial;
-
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
-}
-/**** Tabmenu *****************************************************************/
-.battlemap-tabmenu-selector
-{
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- justify-content: space-between;
-}
-
-.battlemap-tabmenu-selector button
-{
- flex: 1;
-}
-
-.battlemap-tabmenu-content
-{
- flex: initial;
-}
-
-/******************************************************************************/
-.battlemap-character-portrait
-{
- margin: 0.5em;
- box-sizing: border-box;
- border: 2px solid rgba(0,0,0,0.5);
- border-radius: 25px 25px 0 25px;
- width: 128px;
- height: 128px;
-}
-
-.battlemap-tabmenu-characters-tab
-{
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
-}