mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-16 17:31:24 +01:00
v. 057b
v. 057.00b
This commit is contained in:
parent
696e1b5576
commit
7d52af2bf0
4 changed files with 2581 additions and 1439 deletions
|
|
@ -201,9 +201,11 @@
|
|||
|
||||
/* Custom icons */
|
||||
.icon-w:before { font-style: italic; content: 'w:'; }
|
||||
.icon-f:before { font-style: italic; content: 'f:'; }
|
||||
.icon-n:before { font-style: italic; content: 'n:'; }
|
||||
.icon-i:before { font-style: italic; content: 'i:'; }
|
||||
.icon-s:before { font-style: italic; content: 's:'; }
|
||||
.icon-r:before { font-style: italic; content: 'r:'; }
|
||||
.icon-a:before { font-style: italic; content: 'a:'; }
|
||||
.icon-smooth:before {font-weight: bold; content: '∼'; }
|
||||
.icon-disrupt:before {font-weight: bold; content: '෴'; }
|
||||
|
|
|
|||
277
index.css
277
index.css
|
|
@ -7,7 +7,9 @@
|
|||
}
|
||||
|
||||
@media print {
|
||||
div, canvas {display: none;}
|
||||
div, canvas {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
|
|
@ -62,7 +64,8 @@ button, select, a {
|
|||
stroke: none;
|
||||
}
|
||||
|
||||
#lakes, #oceanLayers {
|
||||
#lakes,
|
||||
#oceanLayers {
|
||||
fill-rule: evenodd;
|
||||
}
|
||||
|
||||
|
|
@ -86,14 +89,14 @@ button, select, a {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
#burgs {
|
||||
fill-opacity: 0.6;
|
||||
#icons {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#terrain {
|
||||
mask: url(#shape);
|
||||
mask-mode: alpha;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#hills {
|
||||
|
|
@ -106,7 +109,7 @@ button, select, a {
|
|||
fill: white;
|
||||
}
|
||||
|
||||
#strokes {
|
||||
.strokes {
|
||||
stroke-width: 0.08px;
|
||||
width: 2px;
|
||||
stroke: #5c5c70;
|
||||
|
|
@ -144,9 +147,10 @@ button, select, a {
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
#updateFullscreen {
|
||||
#options i {
|
||||
cursor: pointer;
|
||||
color: #382830;
|
||||
font-size: 10px;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.editTrigger {
|
||||
|
|
@ -174,10 +178,6 @@ button, select, a {
|
|||
width: 161px;
|
||||
}
|
||||
|
||||
#editSizeIcon, #editOpacityIcon, #editShadowIcon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#editText {
|
||||
width: 160px;
|
||||
}
|
||||
|
|
@ -190,10 +190,19 @@ button, select, a {
|
|||
width: 125px;
|
||||
}
|
||||
|
||||
#editColor {
|
||||
height: 20px;
|
||||
width: 50px;
|
||||
input[type="color"].editColor {
|
||||
height: 18px;
|
||||
width: 46px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type="range"].editRange {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
input[type="number"].editNumber {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
#riverScale {
|
||||
|
|
@ -216,7 +225,11 @@ button, select, a {
|
|||
width: 34px;
|
||||
}
|
||||
|
||||
#riverEditor > *, #routeEditor > * {
|
||||
#riverEditor>*,
|
||||
#routeEditor>*,
|
||||
#iconEditor>*,
|
||||
#reliefEditor>*,
|
||||
#burgEditor * {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
|
@ -231,6 +244,14 @@ button, select, a {
|
|||
dominant-baseline: central;
|
||||
}
|
||||
|
||||
#routeLength {
|
||||
background-color: #f3f3f3;
|
||||
border: 1px solid #a5a5a5;
|
||||
padding: 3px;
|
||||
font-size: 11px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.tag {
|
||||
fill: #fffa90;
|
||||
stroke: #333333;
|
||||
|
|
@ -259,10 +280,6 @@ text.drag {
|
|||
cursor: move;
|
||||
}
|
||||
|
||||
#optionsContainer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ui-dialog, #optionsContainer {
|
||||
user-select: none;
|
||||
}
|
||||
|
|
@ -279,7 +296,8 @@ text.drag {
|
|||
|
||||
.tab {
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #5d4651;;
|
||||
border-bottom: 1px solid #5d4651;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
button.options {
|
||||
|
|
@ -293,15 +311,15 @@ button.options {
|
|||
font-size: 1em;
|
||||
}
|
||||
|
||||
#aboutTab.options {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#options p {
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#aboutContent {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
#aboutContent p {
|
||||
font-style: italic;
|
||||
font-weight: normal;
|
||||
|
|
@ -312,7 +330,8 @@ button.options {
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
#options input[type="color"], #convertImageDialog input[type="color"] {
|
||||
#options input[type="color"],
|
||||
#convertImageDialog input[type="color"] {
|
||||
width: 38px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
|
|
@ -377,16 +396,35 @@ button.options {
|
|||
z-index: 2;
|
||||
}
|
||||
|
||||
#collapsible>button {
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
#optionsTrigger {
|
||||
display: block;
|
||||
padding: 5.5px 5.5px;
|
||||
opacity: 0.6;
|
||||
width: 19px;
|
||||
font-size: 9px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#regenerate {
|
||||
display: none;
|
||||
opacity: 0.9;
|
||||
padding: 7px 10px;
|
||||
padding: 0px 8px;
|
||||
}
|
||||
|
||||
.glow {
|
||||
animation: glowing 3s infinite;
|
||||
}
|
||||
|
||||
@keyframes glowing {
|
||||
0% {
|
||||
box-shadow: 0 0 -4px #ded2d8;
|
||||
}
|
||||
50% {
|
||||
box-shadow: 0 0 6px #ded2d8;
|
||||
}
|
||||
100% {
|
||||
box-shadow: 0 0 -4px #ded2d8;
|
||||
}
|
||||
}
|
||||
|
||||
button.options:hover {
|
||||
|
|
@ -464,24 +502,42 @@ p {
|
|||
font-family: monospace;
|
||||
}
|
||||
|
||||
#statusbar {
|
||||
#cellInfo>div {
|
||||
margin: 5px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
#cellInfo>div:nth-child(2) {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
#tooltip {
|
||||
position: fixed;
|
||||
display: none;
|
||||
position: absolute;
|
||||
font-family: monospace;
|
||||
margin-left: 10px;
|
||||
color: #272727;
|
||||
word-wrap: break-word;
|
||||
font-size: 1.2vw;
|
||||
text-align: center;
|
||||
top: calc(98vh - (10px + 0.5vw));
|
||||
width: 100%;
|
||||
cursor: default;
|
||||
text-shadow: 1px 0px 1px #1d0e0f;
|
||||
color: #ffffff;
|
||||
font-size: calc(10px + 0.5vw);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#optionsContent table td:nth-of-type(1) {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
#optionsContent table td:nth-of-type(2) {
|
||||
text-decoration: underline dotted gray;
|
||||
cursor: help;
|
||||
width: 126px;
|
||||
}
|
||||
|
||||
#optionsContent table td:nth-of-type(3) {
|
||||
#optionsContent table td:nth-of-type(4) {
|
||||
text-align: right;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
.overflow-div {
|
||||
|
|
@ -505,14 +561,6 @@ p {
|
|||
fill: grey;
|
||||
}
|
||||
|
||||
#fileInputs {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#customizationMenu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.setColors {
|
||||
display: inline-block;
|
||||
}
|
||||
|
|
@ -526,7 +574,8 @@ body button.noicon {
|
|||
font-family: Copperplate, monospace;
|
||||
}
|
||||
|
||||
#brushesPanel > div, #templateEditor > div {
|
||||
#brushesPanel>div,
|
||||
#templateEditor>div {
|
||||
margin: 2px 0;
|
||||
}
|
||||
|
||||
|
|
@ -539,7 +588,7 @@ body button.noicon {
|
|||
width: 150px;
|
||||
}
|
||||
|
||||
#templateBody > div {
|
||||
#templateBody>div {
|
||||
border: 1px solid #a3a3a3;
|
||||
border-radius: 1px;
|
||||
background-image: linear-gradient(to right, #ffffff 0%, #fafafa 51%, #ebebeb 100%);
|
||||
|
|
@ -549,7 +598,7 @@ body button.noicon {
|
|||
font-size: 9px;
|
||||
}
|
||||
|
||||
#templateBody > div:hover {
|
||||
#templateBody>div:hover {
|
||||
border-color: #808080;
|
||||
background-image: linear-gradient(to right, #fcfcfc 0%, #ededed 51%, #dedede 100%);
|
||||
}
|
||||
|
|
@ -597,7 +646,7 @@ body button.noicon {
|
|||
opacity: .8;
|
||||
}
|
||||
|
||||
.drag-trigger{
|
||||
.drag-trigger {
|
||||
border-left: 12px solid transparent;
|
||||
border-right: 12px solid #916e7f;
|
||||
border-top: 12px solid transparent;
|
||||
|
|
@ -607,7 +656,7 @@ body button.noicon {
|
|||
margin-top: -12px;
|
||||
}
|
||||
|
||||
.drag-trigger:hover{
|
||||
.drag-trigger:hover {
|
||||
cursor: move;
|
||||
border-right-color: #5e4fa2;
|
||||
}
|
||||
|
|
@ -617,7 +666,9 @@ body button.noicon {
|
|||
line-height: 6px;
|
||||
}
|
||||
|
||||
#styleInputs #styleOpacity, #styleInputs #styleFill, #styleInputs #styleFilter {
|
||||
#styleInputs #styleOpacity,
|
||||
#styleInputs #styleFill,
|
||||
#styleInputs #styleFilter {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
|
@ -670,7 +721,7 @@ body button.noicon {
|
|||
}
|
||||
|
||||
.selectedColor {
|
||||
border-color: red;
|
||||
outline: 2px solid #f87b66;
|
||||
}
|
||||
|
||||
#colorScheme {
|
||||
|
|
@ -779,20 +830,23 @@ div.slider .ui-slider-handle {
|
|||
width: 44px;
|
||||
}
|
||||
|
||||
#saveDropdown > div {
|
||||
#saveDropdown>div {
|
||||
padding: 2px 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#saveDropdown > div:hover {
|
||||
#saveDropdown>div:hover {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#brushPower, #brushRadius {
|
||||
#brushPower,
|
||||
#brushRadius {
|
||||
width: 88px;
|
||||
}
|
||||
|
||||
#rescaleHigher, #rescaleLower, #rescaleModifier {
|
||||
#rescaleHigher,
|
||||
#rescaleLower,
|
||||
#rescaleModifier {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
|
|
@ -823,7 +877,7 @@ div.slider .ui-slider-handle {
|
|||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.totalLine > div {
|
||||
.totalLine>div {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
|
@ -848,13 +902,13 @@ div.states sup {
|
|||
display: inline-block;
|
||||
}
|
||||
|
||||
div.states > input {
|
||||
div.states>input {
|
||||
width: 60px;
|
||||
background: none;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
div.states > input.stateColor {
|
||||
div.states>input.stateColor {
|
||||
width: 13px;
|
||||
height: 17px;
|
||||
padding: 0px;
|
||||
|
|
@ -877,33 +931,36 @@ div.states .stateBurgs {
|
|||
width: 24px;
|
||||
}
|
||||
|
||||
div.states > .stateArea {
|
||||
div.states>.stateArea {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
div.states > .statePopulation {
|
||||
div.states>.statePopulation {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
div.states .stateBurgs, div.states .stateBIcon, div.states .icon-trash-empty {
|
||||
div.states .stateBurgs,
|
||||
div.states .stateBIcon,
|
||||
div.states .icon-trash-empty {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.states > [class^="icon-"] {
|
||||
div.states>[class^="icon-"] {
|
||||
color: #6e5e66;
|
||||
padding: 0 1px 0 7px;
|
||||
}
|
||||
|
||||
div.states > .before {
|
||||
div.states>.before {
|
||||
color: #6e5e66;
|
||||
padding: 0 1px 0 0;
|
||||
}
|
||||
|
||||
div.states > .small {
|
||||
div.states>.small {
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
#burgsBody, #countriesBody {
|
||||
#burgsBody,
|
||||
#countriesBody {
|
||||
overflow: auto;
|
||||
max-height: 362px;
|
||||
}
|
||||
|
|
@ -916,7 +973,8 @@ div.states > .small {
|
|||
min-width: 260px;
|
||||
}
|
||||
|
||||
div.states .burgName, div.states .burgCulture {
|
||||
div.states .burgName,
|
||||
div.states .burgCulture {
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
|
|
@ -936,7 +994,7 @@ div.states .enlange {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
#countriesEditor div > .hidden {
|
||||
#countriesEditor div>.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
|
@ -944,7 +1002,7 @@ div.states .enlange {
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
span.ui-dialog-title > input.stateColor {
|
||||
span.ui-dialog-title>input.stateColor {
|
||||
width: 14px;
|
||||
height: 18px;
|
||||
border: 0;
|
||||
|
|
@ -966,31 +1024,31 @@ div.states button.selectCapital {
|
|||
margin-left: 14px;
|
||||
}
|
||||
|
||||
#scaleBody > div > * {
|
||||
#scaleBody>div>* {
|
||||
display: inline-block;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#scaleBody > div > div {
|
||||
#scaleBody>div>div {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
#scaleBody > div > select {
|
||||
#scaleBody>div>select {
|
||||
width: 110px;
|
||||
border: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
#scaleBody > div > input[type="text"] {
|
||||
#scaleBody>div>input[type="text"] {
|
||||
width: 110px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
#scaleBody > div > input[type="range"] {
|
||||
#scaleBody>div>input[type="range"] {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
#scaleBody > div > output {
|
||||
width: 40px;
|
||||
#scaleBody>div>input.output {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.scaleHeader {
|
||||
|
|
@ -1050,10 +1108,17 @@ div.states button.selectCapital {
|
|||
font-family: Georgia;
|
||||
}
|
||||
|
||||
#icon-anchor {
|
||||
fill: white;
|
||||
stroke: #3e3e4b;
|
||||
stroke-width: 1.2;
|
||||
#scaleBottom {
|
||||
margin: 6px 0 0 6px;
|
||||
}
|
||||
|
||||
#barBackColor {
|
||||
width: 24px;
|
||||
height: 16px;
|
||||
padding: 0px;
|
||||
border: 0;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#overlay {
|
||||
|
|
@ -1102,11 +1167,16 @@ div.states button.selectCapital {
|
|||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {transform: translate(50%, 50%) rotate(0deg);}
|
||||
100% {transform: translate(50%, 50%) rotate(359deg);}
|
||||
0% {
|
||||
transform: translate(50%, 50%) rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: translate(50%, 50%) rotate(359deg);
|
||||
}
|
||||
}
|
||||
|
||||
#loading-text span, #uploading-map span {
|
||||
#loading-text span,
|
||||
#uploading-map span {
|
||||
animation-name: blink;
|
||||
animation-duration: 3s;
|
||||
animation-iteration-count: infinite;
|
||||
|
|
@ -1122,19 +1192,25 @@ div.states button.selectCapital {
|
|||
}
|
||||
|
||||
@keyframes blink {
|
||||
0% {opacity: 0;}
|
||||
20% {opacity: 1;}
|
||||
100% {opacity: .1;}
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: .1;
|
||||
}
|
||||
}
|
||||
|
||||
ul.share-buttons li{
|
||||
ul.share-buttons li {
|
||||
display: inline;
|
||||
float: none;
|
||||
padding: 4px;
|
||||
background: 0;
|
||||
}
|
||||
|
||||
ul.share-buttons img{
|
||||
ul.share-buttons img {
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
|
|
@ -1142,26 +1218,27 @@ input[type="checkbox"] {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.checkbox, .checkbox-label {
|
||||
.checkbox,
|
||||
.checkbox-label {
|
||||
margin: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.checkbox + .checkbox-label:before {
|
||||
.checkbox+.checkbox-label:before {
|
||||
content: '';
|
||||
background: #ece6eb;
|
||||
border-radius: 3px;
|
||||
border-radius: 1px;
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
padding: 2px;
|
||||
margin-right: 2px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.checkbox:checked + .checkbox-label:before {
|
||||
background: #b19aa6;
|
||||
transition: .1s;
|
||||
.checkbox:checked+.checkbox-label:before {
|
||||
background: #997c89;
|
||||
transition: .2s;
|
||||
box-shadow: inset 0px 0px 0px 2px #ece6ea;
|
||||
}
|
||||
|
||||
|
|
@ -1192,3 +1269,7 @@ input[type="checkbox"] {
|
|||
vertical-align: middle;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#capital-anchors, #town-anchors {
|
||||
transform: translate(-0.47em, -0.47em);
|
||||
}
|
||||
|
|
|
|||
712
index.html
712
index.html
File diff suppressed because it is too large
Load diff
Loading…
Add table
Add a link
Reference in a new issue