mirror of
https://github.com/maputnik/editor.git
synced 2026-08-30 00:47:25 +00:00
Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 dependabot[bot]
|
84aa662d8f |
@@ -1,70 +0,0 @@
|
|||||||
# For most projects, this workflow file will not need changing; you simply need
|
|
||||||
# to commit it to your repository.
|
|
||||||
#
|
|
||||||
# You may wish to alter this file to override the set of languages analyzed,
|
|
||||||
# or to provide custom queries or build logic.
|
|
||||||
#
|
|
||||||
# ******** NOTE ********
|
|
||||||
# We have attempted to detect the languages in your repository. Please check
|
|
||||||
# the `language` matrix defined below to confirm you have the correct set of
|
|
||||||
# supported CodeQL languages.
|
|
||||||
#
|
|
||||||
name: "CodeQL"
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches: [ main ]
|
|
||||||
pull_request:
|
|
||||||
# The branches below must be a subset of the branches above
|
|
||||||
branches: [ main ]
|
|
||||||
schedule:
|
|
||||||
- cron: '17 0 * * 6'
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
analyze:
|
|
||||||
name: Analyze
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
permissions:
|
|
||||||
actions: read
|
|
||||||
contents: read
|
|
||||||
security-events: write
|
|
||||||
|
|
||||||
strategy:
|
|
||||||
fail-fast: false
|
|
||||||
matrix:
|
|
||||||
language: [ 'javascript' ]
|
|
||||||
# CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
|
|
||||||
# Learn more about CodeQL language support at https://git.io/codeql-language-support
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout repository
|
|
||||||
uses: actions/checkout@v4
|
|
||||||
|
|
||||||
# Initializes the CodeQL tools for scanning.
|
|
||||||
- name: Initialize CodeQL
|
|
||||||
uses: github/codeql-action/init@v3
|
|
||||||
with:
|
|
||||||
languages: ${{ matrix.language }}
|
|
||||||
# If you wish to specify custom queries, you can do so here or in a config file.
|
|
||||||
# By default, queries listed here will override any specified in a config file.
|
|
||||||
# Prefix the list here with "+" to use these queries and those in the config file.
|
|
||||||
# queries: ./path/to/local/query, your-org/your-repo/queries@main
|
|
||||||
|
|
||||||
# Autobuild attempts to build any compiled languages (C/C++, C#, or Java).
|
|
||||||
# If this step fails, then you should remove it and run the build manually (see below)
|
|
||||||
- name: Autobuild
|
|
||||||
uses: github/codeql-action/autobuild@v3
|
|
||||||
|
|
||||||
# ℹ️ Command-line programs to run using the OS shell.
|
|
||||||
# 📚 https://git.io/JvXDl
|
|
||||||
|
|
||||||
# ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
|
|
||||||
# and modify them (or add more) to build your code if your project
|
|
||||||
# uses a compiled language
|
|
||||||
|
|
||||||
#- run: |
|
|
||||||
# make bootstrap
|
|
||||||
# make release
|
|
||||||
|
|
||||||
- name: Perform CodeQL Analysis
|
|
||||||
uses: github/codeql-action/analyze@v3
|
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
@use '../styles/vars';
|
@import '../styles/vars';
|
||||||
|
|
||||||
.SmallError {
|
.SmallError {
|
||||||
color: #E57373;
|
color: #E57373;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
margin-top: vars.$margin-2
|
margin-top: $margin-2
|
||||||
}
|
}
|
||||||
|
|||||||
+16
-18
@@ -1,5 +1,3 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'Roboto';
|
font-family: 'Roboto';
|
||||||
src: url('../fonts/Roboto-Regular.ttf') format('truetype');
|
src: url('../fonts/Roboto-Regular.ttf') format('truetype');
|
||||||
@@ -17,8 +15,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -34,34 +32,34 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
margin-top: vars.$margin-2;
|
margin-top: $margin-2;
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: vars.$font-size-2;
|
font-size: $font-size-2;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: vars.$font-size-3;
|
font-size: $font-size-3;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
font-size: vars.$font-size-4;
|
font-size: $font-size-4;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
h4 {
|
h4 {
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
input:focus,
|
input:focus,
|
||||||
@@ -70,12 +68,12 @@ textarea:focus,
|
|||||||
button:focus,
|
button:focus,
|
||||||
.maputnik-toolbar-link:focus,
|
.maputnik-toolbar-link:focus,
|
||||||
select:focus {
|
select:focus {
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
outline: #8e8e8e auto 1px;
|
outline: #8e8e8e auto 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label:hover {
|
label:hover {
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.clearfix {
|
.clearfix {
|
||||||
|
|||||||
@@ -1,5 +1,3 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
.CodeMirror-lint-tooltip {
|
.CodeMirror-lint-tooltip {
|
||||||
z-index: 2000 !important;
|
z-index: 2000 !important;
|
||||||
}
|
}
|
||||||
@@ -57,7 +55,7 @@
|
|||||||
|
|
||||||
.cm-s-maputnik .CodeMirror-matchingbracket {
|
.cm-s-maputnik .CodeMirror-matchingbracket {
|
||||||
background: hsla(223, 12%, 35%, 1);
|
background: hsla(223, 12%, 35%, 1);
|
||||||
color: vars.$color-white !important;
|
color: $color-white !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cm-s-maputnik .CodeMirror-nonmatchingbracket {
|
.cm-s-maputnik .CodeMirror-nonmatchingbracket {
|
||||||
@@ -81,7 +79,7 @@
|
|||||||
z-index: 99999;
|
z-index: 99999;
|
||||||
padding: 0.3em 0.5em;
|
padding: 0.3em 0.5em;
|
||||||
background: hsla(0, 0%, 0%, 0.3);
|
background: hsla(0, 0%, 0%, 0.3);
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
border-bottom-left-radius: 2px;
|
border-bottom-left-radius: 2px;
|
||||||
transition: opacity 320ms ease;
|
transition: opacity 320ms ease;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
|||||||
+42
-45
@@ -1,12 +1,9 @@
|
|||||||
@use "mixins";
|
|
||||||
@use "vars";
|
|
||||||
|
|
||||||
@use 'sass:color';
|
@use 'sass:color';
|
||||||
// MAP
|
// MAP
|
||||||
.maputnik-map__container {
|
.maputnik-map__container {
|
||||||
background: white;
|
background: white;
|
||||||
display: flex;
|
display: flex;
|
||||||
width: vars.$layout-map-width;
|
width: $layout-map-width;
|
||||||
|
|
||||||
&--error {
|
&--error {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -39,7 +36,7 @@
|
|||||||
&-wrapper {
|
&-wrapper {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
position: relative;
|
position: relative;
|
||||||
@@ -48,9 +45,9 @@
|
|||||||
|
|
||||||
&-popup {
|
&-popup {
|
||||||
display: none;
|
display: none;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
@@ -63,7 +60,7 @@
|
|||||||
&-button {
|
&-button {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
color: white;
|
color: white;
|
||||||
border: none;
|
border: none;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
@@ -80,11 +77,11 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-doc-inline {
|
.maputnik-doc-inline {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
flex: 1 0;
|
flex: 1 0;
|
||||||
}
|
}
|
||||||
@@ -98,10 +95,10 @@
|
|||||||
.maputnik-button {
|
.maputnik-button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
background-color: vars.$color-midgray;
|
background-color: $color-midgray;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
border-width: 0;
|
border-width: 0;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@@ -109,36 +106,36 @@
|
|||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: 12%);
|
background-color: color.adjust($color-midgray, $lightness: 12%);
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:disabled {
|
&:disabled {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: -5%);
|
background-color: color.adjust($color-midgray, $lightness: -5%);
|
||||||
color: vars.$color-midgray;
|
color: $color-midgray;
|
||||||
cursor: not-allowed;
|
cursor: not-allowed;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-big-button {
|
.maputnik-big-button {
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-wide-button {
|
.maputnik-wide-button {
|
||||||
padding: vars.$margin-2 vars.$margin-3;
|
padding: $margin-2 $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-green-button {
|
.maputnik-green-button {
|
||||||
background-color: vars.$color-green;
|
background-color: $color-green;
|
||||||
color: vars.$color-black;
|
color: $color-black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-white-button {
|
.maputnik-white-button {
|
||||||
background-color: vars.$color-white;
|
background-color: $color-white;
|
||||||
color: vars.$color-black;
|
color: $color-black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-icon-button {
|
.maputnik-icon-button {
|
||||||
@@ -153,19 +150,19 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: vars.$color-white;
|
fill: $color-white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// INPUT BLOCK
|
// INPUT BLOCK
|
||||||
.maputnik-input-block {
|
.maputnik-input-block {
|
||||||
margin: vars.$margin-3;
|
margin: $margin-3;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|
||||||
&-label {
|
&-label {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
width: 32%;
|
width: 32%;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
@@ -173,7 +170,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-action {
|
&-action {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
width: 18%;
|
width: 18%;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
@@ -190,7 +187,7 @@
|
|||||||
.maputnik-input-block-label {
|
.maputnik-input-block-label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 32%;
|
width: 32%;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-input-block-action {
|
.maputnik-input-block-action {
|
||||||
@@ -214,15 +211,15 @@
|
|||||||
|
|
||||||
// SPACE HELPER
|
// SPACE HELPER
|
||||||
.maputnik-space {
|
.maputnik-space {
|
||||||
@include mixins.vendor-prefix(flex-grow, 1);
|
@include vendor-prefix(flex-grow, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
// MESSAGE PANEL
|
// MESSAGE PANEL
|
||||||
.maputnik-message-panel {
|
.maputnik-message-panel {
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
|
|
||||||
&-error {
|
&-error {
|
||||||
color: vars.$color-red;
|
color: $color-red;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__switch-button {
|
&__switch-button {
|
||||||
@@ -244,7 +241,7 @@
|
|||||||
&__menu {
|
&__menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 999999;
|
z-index: 999999;
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-content: stretch;
|
align-content: stretch;
|
||||||
@@ -265,13 +262,13 @@
|
|||||||
color: #a4a4a4;
|
color: #a4a4a4;
|
||||||
padding: 0.4em 0.4em;
|
padding: 0.4em 0.4em;
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
border: solid 1px vars.$color-red;
|
border: solid 1px $color-red;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
margin: vars.$margin-2 0px;
|
margin: $margin-2 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-expression-editor {
|
.maputnik-expression-editor {
|
||||||
border: solid 1px vars.$color-gray;
|
border: solid 1px $color-gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-input-block--wide {
|
.maputnik-input-block--wide {
|
||||||
@@ -291,13 +288,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-expr-infobox {
|
.maputnik-expr-infobox {
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
background: vars.$color-midgray;
|
background: $color-midgray;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
border-top-right-radius: 0px;
|
border-top-right-radius: 0px;
|
||||||
border-top-left-radius: 0px;
|
border-top-left-radius: 0px;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-expr-infobox__button {
|
.maputnik-expr-infobox__button {
|
||||||
|
|||||||
@@ -1,7 +1,5 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
.maputnik-filter-editor-wrapper {
|
.maputnik-filter-editor-wrapper {
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.maputnik-input-block {
|
.maputnik-input-block {
|
||||||
@@ -10,8 +8,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-filter-editor {
|
.maputnik-filter-editor {
|
||||||
@extend .clearfix !optional; /* stylelint-disable-line */
|
@extend .clearfix; /* stylelint-disable-line */
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-filter-editor-property {
|
.maputnik-filter-editor-property {
|
||||||
@@ -41,7 +39,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-filter-editor-compound-select {
|
.maputnik-filter-editor-compound-select {
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
|
|
||||||
.maputnik-doc-wrapper {
|
.maputnik-doc-wrapper {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
@@ -54,22 +52,22 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-filter-editor-unsupported {
|
.maputnik-filter-editor-unsupported {
|
||||||
color: vars.$color-midgray;
|
color: $color-midgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-filter {
|
.maputnik-add-filter {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
float: right;
|
float: right;
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-delete-filter {
|
.maputnik-delete-filter {
|
||||||
@extend .maputnik-icon-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-icon-button; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-filter-editor-block-action {
|
.maputnik-filter-editor-block-action {
|
||||||
margin-top: vars.$margin-2;
|
margin-top: $margin-2;
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 6%;
|
width: 6%;
|
||||||
margin-right: 1.5%;
|
margin-right: 1.5%;
|
||||||
@@ -81,12 +79,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-radio-as-button {
|
.maputnik-radio-as-button {
|
||||||
@extend .maputnik-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-button; /* stylelint-disable-line */
|
||||||
|
|
||||||
border: solid 1px transparent;
|
border: solid 1px transparent;
|
||||||
|
|
||||||
&:focus-within {
|
&:focus-within {
|
||||||
border: solid 1px vars.$color-white;
|
border: solid 1px $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
input {
|
input {
|
||||||
|
|||||||
+32
-35
@@ -1,6 +1,3 @@
|
|||||||
@use "mixins";
|
|
||||||
@use "vars";
|
|
||||||
|
|
||||||
@use 'sass:color';
|
@use 'sass:color';
|
||||||
//INPUT
|
//INPUT
|
||||||
.maputnik-input {
|
.maputnik-input {
|
||||||
@@ -8,13 +5,13 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
display: block;
|
display: block;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
padding-left: vars.$margin-2;
|
padding-left: $margin-2;
|
||||||
padding-right: vars.$margin-2;
|
padding-right: $margin-2;
|
||||||
border: none;
|
border: none;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
color: color.adjust(vars.$color-lowgray, $lightness: 12%);
|
color: color.adjust($color-lowgray, $lightness: 12%);
|
||||||
|
|
||||||
&:invalid {
|
&:invalid {
|
||||||
border: solid 1px #B71C1C;
|
border: solid 1px #B71C1C;
|
||||||
@@ -23,7 +20,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-string {
|
.maputnik-string {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input; /* stylelint-disable-line */
|
||||||
|
|
||||||
&--multi {
|
&--multi {
|
||||||
resize: vertical;
|
resize: vertical;
|
||||||
@@ -47,12 +44,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-number {
|
.maputnik-number {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
//COLOR PICKER
|
//COLOR PICKER
|
||||||
.maputnik-color {
|
.maputnik-color {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input; /* stylelint-disable-line */
|
||||||
|
|
||||||
height: 26px;
|
height: 26px;
|
||||||
}
|
}
|
||||||
@@ -60,7 +57,7 @@
|
|||||||
.maputnik-color-wrapper {
|
.maputnik-color-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-color-swatch {
|
.maputnik-color-swatch {
|
||||||
@@ -74,7 +71,7 @@
|
|||||||
|
|
||||||
.maputnik-array {
|
.maputnik-array {
|
||||||
> * {
|
> * {
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-array-block {
|
.maputnik-array-block {
|
||||||
@@ -99,19 +96,19 @@
|
|||||||
|
|
||||||
// SELECT
|
// SELECT
|
||||||
.maputnik-select {
|
.maputnik-select {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input; /* stylelint-disable-line */
|
||||||
|
|
||||||
-moz-appearance: none;
|
-moz-appearance: none;
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
background: vars.$color-gray url("#{vars.$icon-down-arrow}") right center no-repeat;
|
background: $color-gray url("#{$icon-down-arrow}") right center no-repeat;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
background-position: calc(100% - 2px) center;
|
background-position: calc(100% - 2px) center;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
|
|
||||||
height: 24px;
|
height: 24px;
|
||||||
}
|
}
|
||||||
[dir="rtl"] .maputnik-select {
|
[dir="rtl"] .maputnik-select {
|
||||||
background: vars.$color-gray url("#{vars.$icon-down-arrow}") left center no-repeat;
|
background: $color-gray url("#{$icon-down-arrow}") left center no-repeat;
|
||||||
}
|
}
|
||||||
|
|
||||||
// MULTIBUTTON
|
// MULTIBUTTON
|
||||||
@@ -119,12 +116,12 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
.maputnik-button {
|
.maputnik-button {
|
||||||
margin-right: vars.$margin-1;
|
margin-right: $margin-1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-button-selected {
|
.maputnik-button-selected {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: 12%);
|
background-color: color.adjust($color-midgray, $lightness: 12%);
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -140,7 +137,7 @@
|
|||||||
outline: none;
|
outline: none;
|
||||||
|
|
||||||
&-wrapper {
|
&-wrapper {
|
||||||
@extend .maputnik-input !optional; /* stylelint-disable-line */
|
@extend .maputnik-input; /* stylelint-disable-line */
|
||||||
|
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
@@ -157,12 +154,12 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
margin-right: vars.$margin-2;
|
margin-right: $margin-2;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-width: 2px;
|
border-width: 2px;
|
||||||
border-color: vars.$color-gray;
|
border-color: $color-gray;
|
||||||
transition: background-color 0.1s ease-out;
|
transition: background-color 0.1s ease-out;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
@@ -188,7 +185,7 @@
|
|||||||
width: 50%;
|
width: 50%;
|
||||||
height: 50%;
|
height: 50%;
|
||||||
margin-top: 1px;
|
margin-top: 1px;
|
||||||
fill: vars.$color-lowgray;
|
fill: $color-lowgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -201,29 +198,29 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
max-height: 50%;
|
max-height: 50%;
|
||||||
background: vars.$color-gray;
|
background: $color-gray;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-menu-item {
|
&-menu-item {
|
||||||
user-select: none;
|
user-select: none;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
padding: vars.$margin-1;
|
padding: $margin-1;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
background: vars.$color-gray;
|
background: $color-gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-menu-item-selected {
|
&-menu-item-selected {
|
||||||
background: vars.$color-midgray;
|
background: $color-midgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// FONT
|
// FONT
|
||||||
.maputnik-font {
|
.maputnik-font {
|
||||||
.maputnik-autocomplete:not(:last-child) {
|
.maputnik-autocomplete:not(:last-child) {
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -239,21 +236,21 @@
|
|||||||
|
|
||||||
.SpecDoc__sdk-support__table {
|
.SpecDoc__sdk-support__table {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
|
|
||||||
td, th {
|
td, th {
|
||||||
border: solid 1px vars.$color-midgray;
|
border: solid 1px $color-midgray;
|
||||||
padding: 4px 6px;
|
padding: 4px 6px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.SpecDoc__values li {
|
.SpecDoc__values li {
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.SpecDoc__values code {
|
.SpecDoc__values code {
|
||||||
background: vars.$color-midgray;
|
background: $color-midgray;
|
||||||
padding: 0.1em 0.3em;
|
padding: 0.1em 0.3em;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|||||||
+44
-50
@@ -1,6 +1,3 @@
|
|||||||
@use "mixins";
|
|
||||||
@use "vars";
|
|
||||||
|
|
||||||
@use 'sass:color';
|
@use 'sass:color';
|
||||||
// LAYER LIST
|
// LAYER LIST
|
||||||
.maputnik-layer-list {
|
.maputnik-layer-list {
|
||||||
@@ -10,9 +7,9 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
&-header {
|
&-header {
|
||||||
padding: vars.$margin-2 vars.$margin-2 vars.$margin-3;
|
padding: $margin-2 $margin-2 $margin-3;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
flex: 0 0;
|
flex: 0 0;
|
||||||
|
|
||||||
> * {
|
> * {
|
||||||
@@ -22,8 +19,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-header-title {
|
&-header-title {
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
@@ -31,7 +28,7 @@
|
|||||||
&-container {
|
&-container {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-bottom: vars.$margin-5;
|
padding-bottom: $margin-5;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
@@ -50,9 +47,9 @@
|
|||||||
&-item {
|
&-item {
|
||||||
border: solid 1px transparent;
|
border: solid 1px transparent;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
border-bottom-color: color.adjust(vars.$color-black, $lightness: 0.1%);
|
border-bottom-color: color.adjust($color-black, $lightness: 0.1%);
|
||||||
user-select: none;
|
user-select: none;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
z-index: 2000;
|
z-index: 2000;
|
||||||
@@ -66,22 +63,21 @@
|
|||||||
transition: opacity 600ms, visibility 600ms;
|
transition: opacity 600ms, visibility 600ms;
|
||||||
|
|
||||||
&:focus-within {
|
&:focus-within {
|
||||||
border: solid 1px vars.$color-lowgray;
|
border: solid 1px $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include mixins.flex-row;
|
|
||||||
|
|
||||||
@media screen and (prefers-reduced-motion: reduce) {
|
@media screen and (prefers-reduced-motion: reduce) {
|
||||||
transition-duration: 0;
|
transition-duration: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-icon-action {
|
&-icon-action {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: vars.$color-black;
|
fill: $color-black;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -92,10 +88,10 @@
|
|||||||
height: 15px;
|
height: 15px;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: color.adjust(vars.$color-lowgray, $lightness: -20%);
|
fill: color.adjust($color-lowgray, $lightness: -20%);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
fill: vars.$color-white;
|
fill: $color-white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -106,24 +102,24 @@
|
|||||||
|
|
||||||
.maputnik-layer-list-item:hover,
|
.maputnik-layer-list-item:hover,
|
||||||
.maputnik-layer-list-item-selected {
|
.maputnik-layer-list-item-selected {
|
||||||
background-color: color.adjust(vars.$color-black, $lightness: 2%);
|
background-color: color.adjust($color-black, $lightness: 2%);
|
||||||
|
|
||||||
.maputnik-layer-list-icon-action {
|
.maputnik-layer-list-icon-action {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: color.adjust(vars.$color-lowgray, $lightness: -0.5%);
|
fill: color.adjust($color-lowgray, $lightness: -0.5%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.maputnik-layer-list-item--error {
|
.maputnik-layer-list-item--error {
|
||||||
color: vars.$color-red;
|
color: $color-red;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-item-selected {
|
&-item-selected {
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-item-collapsed {
|
&-item-collapsed {
|
||||||
@@ -136,7 +132,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-item-group-last {
|
&-item-group-last {
|
||||||
border-bottom: 2px solid vars.$color-gray;
|
border-bottom: 2px solid $color-gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-item-id {
|
&-item-id {
|
||||||
@@ -154,14 +150,14 @@
|
|||||||
|
|
||||||
&-group-header {
|
&-group-header {
|
||||||
border: solid 1px transparent;
|
border: solid 1px transparent;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
background-color: color.adjust(vars.$color-black, $lightness: 2%);
|
background-color: color.adjust($color-black, $lightness: 2%);
|
||||||
user-select: none;
|
user-select: none;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
|
|
||||||
&:focus-within {
|
&:focus-within {
|
||||||
border: solid 1px vars.$color-lowgray;
|
border: solid 1px $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
@@ -169,7 +165,7 @@
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
width: 14px;
|
width: 14px;
|
||||||
@@ -182,27 +178,25 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-group-content {
|
&-group-content {
|
||||||
margin: 0 vars.$margin-3;
|
margin: 0 $margin-3;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// FILTER EDITOR
|
// FILTER EDITOR
|
||||||
.maputnik-layer-editor-group {
|
.maputnik-layer-editor-group {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
background-color: color.adjust(vars.$color-black, $lightness: 2%);
|
background-color: color.adjust($color-black, $lightness: 2%);
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
border-top: solid 1px #36383e;
|
border-top: solid 1px #36383e;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
|
||||||
|
|
||||||
&__button {
|
&__button {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
|
|
||||||
&__icon {
|
&__icon {
|
||||||
fill: white;
|
fill: white;
|
||||||
@@ -229,17 +223,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@include flex-row;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// PROPERTY
|
// PROPERTY
|
||||||
.maputnik-default-property {
|
.maputnik-default-property {
|
||||||
.maputnik-input-block-label {
|
.maputnik-input-block-label {
|
||||||
color: color.adjust(vars.$color-lowgray, $lightness: -20%);
|
color: color.adjust($color-lowgray, $lightness: -20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-string,
|
.maputnik-string,
|
||||||
@@ -247,8 +241,8 @@
|
|||||||
.maputnik-color,
|
.maputnik-color,
|
||||||
.maputnik-select,
|
.maputnik-select,
|
||||||
.maputnik-checkbox-wrapper {
|
.maputnik-checkbox-wrapper {
|
||||||
background-color: color.adjust(vars.$color-gray, $lightness: -2%);
|
background-color: color.adjust($color-gray, $lightness: -2%);
|
||||||
color: color.adjust(vars.$color-lowgray, $lightness: -20%);
|
color: color.adjust($color-lowgray, $lightness: -20%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-make-zoom-function svg {
|
.maputnik-make-zoom-function svg {
|
||||||
@@ -256,18 +250,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-multibutton .maputnik-button {
|
.maputnik-multibutton .maputnik-button {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: -10%);
|
background-color: color.adjust($color-midgray, $lightness: -10%);
|
||||||
color: color.adjust(vars.$color-lowgray, $lightness: -20%);
|
color: color.adjust($color-lowgray, $lightness: -20%);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: 12%);
|
background-color: color.adjust($color-midgray, $lightness: 12%);
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-multibutton .maputnik-button-selected {
|
.maputnik-multibutton .maputnik-button-selected {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: -2%);
|
background-color: color.adjust($color-midgray, $lightness: -2%);
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -282,8 +276,8 @@
|
|||||||
&__menu {
|
&__menu {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 9999;
|
z-index: 9999;
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
border: solid 1px vars.$color-midgray;
|
border: solid 1px $color-midgray;
|
||||||
right: 0;
|
right: 0;
|
||||||
min-width: 120px;
|
min-width: 120px;
|
||||||
}
|
}
|
||||||
@@ -301,7 +295,7 @@
|
|||||||
.layer-header {
|
.layer-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
|
|
||||||
&__title {
|
&__title {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@@ -316,7 +310,7 @@
|
|||||||
|
|
||||||
// Clone of the element which is sorted
|
// Clone of the element which is sorted
|
||||||
.sortableHelper {
|
.sortableHelper {
|
||||||
font-family: vars.$font-family;
|
font-family: $font-family;
|
||||||
z-index: 9999;
|
z-index: 9999;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|||||||
+8
-10
@@ -1,5 +1,3 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
//SCROLLING
|
//SCROLLING
|
||||||
.maputnik-scroll-container {
|
.maputnik-scroll-container {
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
@@ -13,14 +11,14 @@
|
|||||||
|
|
||||||
//APP LAYOUT
|
//APP LAYOUT
|
||||||
.maputnik-layout {
|
.maputnik-layout {
|
||||||
font-family: vars.$font-family;
|
font-family: $font-family;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
|
|
||||||
&-main {
|
&-main {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: calc(100% - #{vars.$toolbar-height + vars.$toolbar-offset});
|
height: calc(100% - #{$toolbar-height + $toolbar-offset});
|
||||||
top: vars.$toolbar-height + vars.$toolbar-offset;
|
top: $toolbar-height + $toolbar-offset;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
@@ -30,12 +28,12 @@
|
|||||||
|
|
||||||
&-list {
|
&-list {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-drawer {
|
&-drawer {
|
||||||
width: 370px;
|
width: 370px;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
// scroll-container is position: absolute
|
// scroll-container is position: absolute
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
@@ -45,7 +43,7 @@
|
|||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
width: vars.$layout-map-width;
|
width: $layout-map-width;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,3 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
//OPENLAYERS
|
//OPENLAYERS
|
||||||
.maputnik-layout {
|
.maputnik-layout {
|
||||||
.ol-zoom {
|
.ol-zoom {
|
||||||
@@ -41,7 +39,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-ol-popup {
|
.maputnik-ol-popup {
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -76,7 +74,7 @@
|
|||||||
background: #1c1f24;
|
background: #1c1f24;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding: 6px 8px;
|
padding: 6px 8px;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
z-index: 9999;
|
z-index: 9999;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|||||||
+48
-51
@@ -1,43 +1,40 @@
|
|||||||
@use "mixins";
|
|
||||||
@use "vars";
|
|
||||||
|
|
||||||
//MODAL
|
//MODAL
|
||||||
.maputnik-modal {
|
.maputnik-modal {
|
||||||
min-width: 350px;
|
min-width: 350px;
|
||||||
max-width: 600px;
|
max-width: 600px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
|
box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
position: relative;
|
position: relative;
|
||||||
font-family: vars.$font-family;
|
font-family: $font-family;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-section {
|
.maputnik-modal-section {
|
||||||
padding-top: vars.$margin-3;
|
padding-top: $margin-3;
|
||||||
padding-bottom: vars.$margin-3;
|
padding-bottom: $margin-3;
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: vars.$font-size-4;
|
font-size: $font-size-4;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Bug fix: <http://stackoverflow.com/questions/28636832/firefox-overflow-y-not-working-with-nested-flexbox> */
|
/* Bug fix: <http://stackoverflow.com/questions/28636832/firefox-overflow-y-not-working-with-nested-flexbox> */
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
|
|
||||||
@include mixins.flex-column;
|
@include flex-column;
|
||||||
|
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-sub-section {
|
.maputnik-modal-sub-section {
|
||||||
margin-top: vars.$margin-1;
|
margin-top: $margin-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-section--shrink {
|
.maputnik-modal-section--shrink {
|
||||||
@@ -45,14 +42,14 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-header {
|
.maputnik-modal-header {
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-header-title {
|
.maputnik-modal-header-title {
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -69,18 +66,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-content {
|
.maputnik-modal-content {
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
|
|
||||||
@include mixins.flex-column;
|
@include flex-column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-modal-header-space {
|
.maputnik-modal-header-space {
|
||||||
@extend .maputnik-space !optional; /* stylelint-disable-line */
|
@extend .maputnik-space; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
//OPEN MODAL
|
//OPEN MODAL
|
||||||
.maputnik-upload-button {
|
.maputnik-upload-button {
|
||||||
@extend .maputnik-big-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-big-button; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-style-gallery-container {
|
.maputnik-style-gallery-container {
|
||||||
@@ -91,35 +88,35 @@
|
|||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 180px;
|
width: 180px;
|
||||||
font-size: vars.$font-size-2;
|
font-size: $font-size-2;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-public-style-button {
|
.maputnik-public-style-button {
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: vars.$color-midgray;
|
background-color: $color-midgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-public-style-header {
|
.maputnik-public-style-header {
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-public-style-thumbnail {
|
.maputnik-public-style-thumbnail {
|
||||||
display: block;
|
display: block;
|
||||||
margin-top: vars.$margin-2;
|
margin-top: $margin-2;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-top: calc(400 / 600 * 100%);
|
padding-top: calc(400 / 600 * 100%);
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-color: vars.$color-midgray;
|
background-color: $color-midgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-modal {
|
.maputnik-add-modal {
|
||||||
@@ -142,18 +139,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-layer {
|
.maputnik-add-layer {
|
||||||
@extend .clearfix !optional; /* stylelint-disable-line */
|
@extend .clearfix; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
//ADD MODAL
|
//ADD MODAL
|
||||||
.maputnik-add-layer-button {
|
.maputnik-add-layer-button {
|
||||||
@extend .maputnik-big-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-big-button; /* stylelint-disable-line */
|
||||||
|
|
||||||
margin-right: vars.$margin-3;
|
margin-right: $margin-3;
|
||||||
float: right;
|
float: right;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-top: 3;
|
margin-top: 3;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -166,19 +163,19 @@
|
|||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
margin-top: 1.5%;
|
margin-top: 1.5%;
|
||||||
margin-right: 1.5%;
|
margin-right: 1.5%;
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
width: 48.5%;
|
width: 48.5%;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-public-source-select {
|
.maputnik-public-source-select {
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-public-source-name {
|
.maputnik-public-source-name {
|
||||||
@@ -195,24 +192,24 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-active-source-type-editor-header {
|
.maputnik-active-source-type-editor-header {
|
||||||
background-color: vars.$color-gray;
|
background-color: $color-gray;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
|
|
||||||
@include mixins.flex-row;
|
@include flex-row;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-active-source-type-editor-header-id {
|
.maputnik-active-source-type-editor-header-id {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-active-source-type-editor-content {
|
.maputnik-active-source-type-editor-content {
|
||||||
border-color: vars.$color-gray;
|
border-color: $color-gray;
|
||||||
border-width: 2px;
|
border-width: 2px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
|
|
||||||
.maputnik-input-block-label {
|
.maputnik-input-block-label {
|
||||||
width: 30%;
|
width: 30%;
|
||||||
@@ -224,7 +221,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-source {
|
.maputnik-add-source {
|
||||||
@extend .clearfix !optional; /* stylelint-disable-line */
|
@extend .clearfix; /* stylelint-disable-line */
|
||||||
|
|
||||||
.maputnik-input-block-label {
|
.maputnik-input-block-label {
|
||||||
width: 30%;
|
width: 30%;
|
||||||
@@ -236,17 +233,17 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-source-button {
|
.maputnik-add-source-button {
|
||||||
@extend .maputnik-big-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-big-button; /* stylelint-disable-line */
|
||||||
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-right: vars.$margin-3;
|
margin-right: $margin-3;
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
//EXPORT MODAL
|
//EXPORT MODAL
|
||||||
.maputnik-export-gist {
|
.maputnik-export-gist {
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
|
|
||||||
.maputnik-input-block {
|
.maputnik-input-block {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
@@ -258,7 +255,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -294,12 +291,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&__shortcut {
|
&__shortcut {
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
dt {
|
dt {
|
||||||
display: inline;
|
display: inline;
|
||||||
margin-right: vars.$margin-2;
|
margin-right: $margin-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
dd {
|
dd {
|
||||||
|
|||||||
+14
-16
@@ -1,5 +1,3 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
.maputnik-popup-layer {
|
.maputnik-popup-layer {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
@@ -13,20 +11,20 @@
|
|||||||
|
|
||||||
.maputnik-popup-layer__label {
|
.maputnik-popup-layer__label {
|
||||||
display: block;
|
display: block;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
padding-top: vars.$margin-1;
|
padding-top: $margin-1;
|
||||||
padding-bottom: vars.$margin-1;
|
padding-bottom: $margin-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-popup-layer-id {
|
.maputnik-popup-layer-id {
|
||||||
padding-left: vars.$margin-2;
|
padding-left: $margin-2;
|
||||||
padding-right: vars.$margin-2;
|
padding-right: $margin-2;
|
||||||
background-color: vars.$color-midgray;
|
background-color: $color-midgray;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-feature-property-popup {
|
.maputnik-feature-property-popup {
|
||||||
@@ -34,9 +32,9 @@
|
|||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
.maputnik-input-block {
|
.maputnik-input-block {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-left: vars.$margin-2;
|
margin-left: $margin-2;
|
||||||
margin-right: vars.$margin-2;
|
margin-right: $margin-2;
|
||||||
margin-top: vars.$margin-2;
|
margin-top: $margin-2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -45,7 +43,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-popup-table-cell {
|
.maputnik-popup-table-cell {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
padding-left: vars.$margin-2;
|
padding-left: $margin-2;
|
||||||
padding-right: vars.$margin-2;
|
padding-right: $margin-2;
|
||||||
}
|
}
|
||||||
|
|||||||
+27
-29
@@ -1,15 +1,13 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
@use 'sass:color';
|
@use 'sass:color';
|
||||||
// TOOLBAR
|
// TOOLBAR
|
||||||
.maputnik-toolbar {
|
.maputnik-toolbar {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
height: vars.$toolbar-height;
|
height: $toolbar-height;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: vars.$toolbar-offset;
|
top: $toolbar-offset;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbar-logo-container {
|
.maputnik-toolbar-logo-container {
|
||||||
@@ -22,9 +20,9 @@
|
|||||||
flex: 0 0 190px;
|
flex: 0 0 190px;
|
||||||
width: 200px;
|
width: 200px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
height: vars.$toolbar-height;
|
height: $toolbar-height;
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
@@ -35,19 +33,19 @@
|
|||||||
|
|
||||||
img {
|
img {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
padding-right: vars.$margin-2;
|
padding-right: $margin-2;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbar-link {
|
.maputnik-toolbar-link {
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
height: vars.$toolbar-height;
|
height: $toolbar-height;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: vars.$margin-3;
|
padding: $margin-3;
|
||||||
font-size: vars.$font-size-5;
|
font-size: $font-size-5;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
|
|
||||||
@@ -56,30 +54,30 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: vars.$color-midgray;
|
background-color: $color-midgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbar-link--highlighted {
|
.maputnik-toolbar-link--highlighted {
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
padding: vars.$margin-2 vars.$margin-3;
|
padding: $margin-2 $margin-3;
|
||||||
|
|
||||||
.maputnik-toolbar-link-wrapper {
|
.maputnik-toolbar-link-wrapper {
|
||||||
background-color: vars.$color-white;
|
background-color: $color-white;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding: vars.$margin-2;
|
padding: $margin-2;
|
||||||
margin-top: vars.$margin-1;
|
margin-top: $margin-1;
|
||||||
color: vars.$color-black;
|
color: $color-black;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover .maputnik-toolbar-link-wrapper {
|
&:hover .maputnik-toolbar-link-wrapper {
|
||||||
background-color: color.adjust(vars.$color-midgray, $lightness: 12%);
|
background-color: color.adjust($color-midgray, $lightness: 12%);
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -96,31 +94,31 @@
|
|||||||
.maputnik-toolbar-action {
|
.maputnik-toolbar-action {
|
||||||
background: inherit;
|
background: inherit;
|
||||||
border-width: 0;
|
border-width: 0;
|
||||||
@extend .maputnik-toolbar-link !optional; /* stylelint-disable-line */
|
@extend .maputnik-toolbar-link; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbar-select {
|
.maputnik-toolbar-select {
|
||||||
background: inherit;
|
background: inherit;
|
||||||
border-width: 0;
|
border-width: 0;
|
||||||
@extend .maputnik-toolbar-link !optional; /* stylelint-disable-line */
|
@extend .maputnik-toolbar-link; /* stylelint-disable-line */
|
||||||
|
|
||||||
select {
|
select {
|
||||||
margin: 0 6px;
|
margin: 0 6px;
|
||||||
display: inline;
|
display: inline;
|
||||||
width: auto;
|
width: auto;
|
||||||
border: solid 1px vars.$color-midgray;
|
border: solid 1px $color-midgray;
|
||||||
vertical-align: inherit;
|
vertical-align: inherit;
|
||||||
margin-top: -2px;
|
margin-top: -2px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-icon-text {
|
.maputnik-icon-text {
|
||||||
padding: 0 vars.$margin-1;
|
padding: 0 $margin-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-icon-action {
|
.maputnik-icon-action {
|
||||||
display: inline;
|
display: inline;
|
||||||
margin: 0 vars.$margin-1;
|
margin: 0 $margin-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbar__inner {
|
.maputnik-toolbar__inner {
|
||||||
@@ -142,7 +140,7 @@
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
display: block;
|
display: block;
|
||||||
background-color: vars.$color-black;
|
background-color: $color-black;
|
||||||
z-index: 999;
|
z-index: 999;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
left: 0;
|
left: 0;
|
||||||
@@ -151,7 +149,7 @@
|
|||||||
&:active,
|
&:active,
|
||||||
&:focus {
|
&:focus {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-color: vars.$color-lowgray;
|
border-color: $color-lowgray;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,18 +1,16 @@
|
|||||||
@use "vars";
|
|
||||||
|
|
||||||
// ZOOM FUNC
|
// ZOOM FUNC
|
||||||
.maputnik-make-zoom-function {
|
.maputnik-make-zoom-function {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
padding: 0 vars.$margin-2 0 0;
|
padding: 0 $margin-2 0 0;
|
||||||
|
|
||||||
@extend .maputnik-icon-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-icon-button; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
// ZOOM PROPERTY
|
// ZOOM PROPERTY
|
||||||
.maputnik-zoom-spec-property {
|
.maputnik-zoom-spec-property {
|
||||||
@extend .clearfix !optional; /* stylelint-disable-line */
|
@extend .clearfix; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-zoom-spec-property-label {
|
.maputnik-zoom-spec-property-label {
|
||||||
@@ -21,8 +19,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-zoom-spec-property-stop-item {
|
.maputnik-zoom-spec-property-stop-item {
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
margin-top: vars.$margin-2;
|
margin-top: $margin-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-zoom-spec-property-stop-edit {
|
.maputnik-zoom-spec-property-stop-edit {
|
||||||
@@ -51,12 +49,13 @@
|
|||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
|
||||||
@extend .maputnik-icon-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-icon-button; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-stop {
|
.maputnik-add-stop {
|
||||||
|
display: inline-block;
|
||||||
float: right;
|
float: right;
|
||||||
margin-right: vars.$margin-3;
|
margin-right: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
// DATA FUNC
|
// DATA FUNC
|
||||||
@@ -64,9 +63,9 @@
|
|||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
padding: 0 vars.$margin-2 0 0;
|
padding: 0 $margin-2 0 0;
|
||||||
|
|
||||||
@extend .maputnik-icon-button !optional; /* stylelint-disable-line */
|
@extend .maputnik-icon-button; /* stylelint-disable-line */
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-data-spec-property {
|
.maputnik-data-spec-property {
|
||||||
@@ -87,7 +86,7 @@
|
|||||||
|
|
||||||
.maputnik-doc-wrapper {
|
.maputnik-doc-wrapper {
|
||||||
width: 25%;
|
width: 25%;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-doc-wrapper:hover {
|
.maputnik-doc-wrapper:hover {
|
||||||
|
|||||||
+40
-40
@@ -1,22 +1,22 @@
|
|||||||
@use 'vars';
|
@import 'vars';
|
||||||
@use 'mixins';
|
@import 'mixins';
|
||||||
@use 'reset';
|
@import 'reset';
|
||||||
@use 'base';
|
@import 'base';
|
||||||
@use 'components';
|
@import 'components';
|
||||||
@use 'scrollbar';
|
@import 'scrollbar';
|
||||||
@use 'picker';
|
@import 'picker';
|
||||||
@use 'toolbar';
|
@import 'toolbar';
|
||||||
@use 'modal';
|
@import 'modal';
|
||||||
@use 'export';
|
@import 'export';
|
||||||
@use 'layout';
|
@import 'layout';
|
||||||
@use 'layer';
|
@import 'layer';
|
||||||
@use 'input';
|
@import 'input';
|
||||||
@use 'filtereditor';
|
@import 'filtereditor';
|
||||||
@use 'zoomproperty';
|
@import 'zoomproperty';
|
||||||
@use 'popup';
|
@import 'popup';
|
||||||
@use 'map';
|
@import 'map';
|
||||||
@use 'codemirror';
|
@import 'codemirror';
|
||||||
@use 'react-collapse';
|
@import 'react-collapse';
|
||||||
|
|
||||||
.maputnik-layout {
|
.maputnik-layout {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
@@ -29,14 +29,14 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-data-fieldset-inner {
|
.maputnik-data-fieldset-inner {
|
||||||
background: vars.$color-black;
|
background: $color-black;
|
||||||
border: solid 1px vars.$color-midgray;
|
border: solid 1px $color-midgray;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
// HACK: Overide
|
// HACK: Overide
|
||||||
.maputnik-input-block {
|
.maputnik-input-block {
|
||||||
margin: vars.$margin-2;
|
margin: $margin-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-add-stop {
|
.maputnik-add-stop {
|
||||||
@@ -49,8 +49,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-toolbox {
|
.maputnik-toolbox {
|
||||||
margin: vars.$margin-3;
|
margin: $margin-3;
|
||||||
margin-top: vars.$margin-3;
|
margin-top: $margin-3;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -58,40 +58,40 @@
|
|||||||
|
|
||||||
.maputnik-data-spec-property {
|
.maputnik-data-spec-property {
|
||||||
legend {
|
legend {
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
margin-bottom: vars.$margin-3;
|
margin-bottom: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-data-spec-property-group {
|
.maputnik-data-spec-property-group {
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-data-spec-block {
|
.maputnik-data-spec-block {
|
||||||
margin: vars.$margin-3;
|
margin: $margin-3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-function-stop {
|
.maputnik-function-stop {
|
||||||
padding-left: vars.$margin-2;
|
padding-left: $margin-2;
|
||||||
padding-right: vars.$margin-2;
|
padding-right: $margin-2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.maputnik-function-stop-table {
|
.maputnik-function-stop-table {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
margin-bottom: vars.$margin-2;
|
margin-bottom: $margin-2;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
thead th {
|
thead th {
|
||||||
padding: vars.$margin-1 vars.$margin-2;
|
padding: $margin-1 $margin-2;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
td, th {
|
td, th {
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
color: vars.$color-white;
|
color: $color-white;
|
||||||
|
|
||||||
// HACK
|
// HACK
|
||||||
> * {
|
> * {
|
||||||
@@ -102,7 +102,7 @@
|
|||||||
|
|
||||||
&:not(:first-child)
|
&:not(:first-child)
|
||||||
{
|
{
|
||||||
padding: vars.$margin-1;
|
padding: $margin-1;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:nth-child(1) {
|
&:nth-child(1) {
|
||||||
@@ -147,10 +147,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
caption {
|
caption {
|
||||||
color: vars.$color-lowgray;
|
color: $color-lowgray;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
border-top: solid 1px vars.$color-black;
|
border-top: solid 1px $color-black;
|
||||||
font-size: vars.$font-size-6;
|
font-size: $font-size-6;
|
||||||
height: 0px;
|
height: 0px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user