Contained, auto-resize group labels

This commit is contained in:
Ian Gulliver
2019-07-05 04:09:24 +00:00
parent b4a072c8da
commit 6543e36378
2 changed files with 41 additions and 34 deletions

View File

@@ -127,52 +127,39 @@ body {
margin: 10px;
}
.gridNode, .gridGroup, .gridGroupLabel {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
font-size: 20px;
border-radius: 10px;
overflow-wrap: anywhere;
overflow: hidden;
cursor: default;
user-select: none;
}
.gridNode {
width: calc(100% - 24px);
height: calc(100% - 24px);
display: flex;
align-items: center;
background: var(--background);
justify-content: center;
text-align: center;
font-size: 20px;
overflow-wrap: anywhere;
border-radius: 10px;
padding: 3px;
border: 1px solid white;
overflow: hidden;
background: var(--background);
z-index: 2;
cursor: default;
user-select: none;
}
.gridGroup {
width: calc(100% - 10px);
height: calc(100% - 30px);
display: flex;
flex-direction: column;
align-items: center;
background: var(--background);
justify-content: flex-start;
text-align: center;
font-size: 20px;
overflow-wrap: anywhere;
border-radius: 10px;
margin-top: 20px;
padding: 5px;
border: 1px dashed white;
overflow: hidden;
background: var(--background);
z-index: 1;
cursor: default;
user-select: none;
}
.gridGroup:empty {
@@ -180,6 +167,17 @@ body {
margin-top: 0;
}
.gridGroupLabel {
width: calc(100% - 10px);
height: 100%;
justify-content: center;
font-size: 20px;
padding-top: 3px;
overflow: hidden;
overflow-wrap: anywhere;
z-index: 2;
}
.gridLines {
width: 100%;
height: 100%;