.l7-control-draw { border-radius: 4px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1); display: flex; } .l7-control-draw button { background-repeat: no-repeat; background-position: center; background-size: 20px 20px; background-color: #fff; width: 30px; height: 30px; display: block; padding: 0; outline: none; border: 0; margin: 1px; box-sizing: border-box; cursor: pointer; } .l7-control-draw button:not(:disabled):hover { background-color: rgba(0, 0, 0, 0.05); } .l7-control-draw button:focus { box-shadow: 0 0 2px 2px #0096ff; } .l7-control-draw .draw-point { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NjYxMTY0NjA0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDExOTQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjI5MzUiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTQ5LjI1IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNjA5LjUzNiA3MDcuMDcyYTE5NS4wNzIgMTk1LjA3MiAwIDEgMSAwLTM5MC4xNDQgMTk1LjA3MiAxOTUuMDcyIDAgMCAxIDAgMzkwLjE0NHoiIGZpbGw9IiMyYzJjMmMiIHAtaWQ9IjI5MzYiPjwvcGF0aD48cGF0aCBkPSJNMTA0OC40MDUzMzMgNDE0LjQ2NGExNDYuMjYxMzMzIDE0Ni4yNjEzMzMgMCAxIDEgMC0yOTIuNTIyNjY3IDE0Ni4yNjEzMzMgMTQ2LjI2MTMzMyAwIDAgMSAwIDI5Mi41MjI2Njd6TTE3MC42NjY2NjcgOTk5LjU5NDY2N2ExNDYuMjYxMzMzIDE0Ni4yNjEzMzMgMCAxIDEgMC0yOTIuNTIyNjY3IDE0Ni4yNjEzMzMgMTQ2LjI2MTMzMyAwIDAgMSAwIDI5Mi41MjI2Njd6IG0wLTY4Mi42NjY2NjdBMTQ2LjI2MTMzMyAxNDYuMjYxMzMzIDAgMSAxIDE3MC42NjY2NjcgMjQuNDA1MzMzYTE0Ni4yNjEzMzMgMTQ2LjI2MTMzMyAwIDAgMSAwIDI5Mi41MjI2Njd6IiBmaWxsPSIjMmMyYzJjIiBwLWlkPSIyOTM3Ij48L3BhdGg+PC9zdmc+); } .l7-control-draw .draw-line { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NjYxMDY5NTk0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjIxOTMiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNOTAwLjkzIDMwMC4yOThjLTQxLjA2NyAwLTc0LjQ3IDMzLjQyOS03NC40NyA3NC40OTEgMCAxMCAxLjk5MiAxOS41MzMgNS41ODEgMjguMjU3bC0yMjAuMjYyIDIwNS4xOGE3My45OSA3My45OSAwIDAgMC00MS4yMzItMTIuNTA0IDc0LjE3IDc0LjE3IDAgMCAwLTIyLjQ1MSAzLjQ1MWwtNzAuMTEzLTEzOS42MzhhNzQuMTM4IDc0LjEzOCAwIDAgMCA4LjE0Ni0zMy45MmMwLTQxLjA2Mi0zMy4zODMtNzQuNDktNzQuNDQ1LTc0LjQ5cy03NC40NDUgMzMuNDI4LTc0LjQ0NSA3NC40OWMwIDMuODI1IDAuMjkyIDcuNjA0IDAuODU1IDExLjMxNkwxNjAuODYgNjI3LjIyYTczLjg4NyA3My44ODcgMCAwIDAtMzkuNzk4LTExLjU5N2MtNDEuMDYyIDAtNzQuNDcgMzMuNDIzLTc0LjQ3IDc0LjQ5IDAgNDEuMDgzIDMzLjQwOCA3NC41MTcgNzQuNDcgNzQuNTE3IDQxLjA0MiAwIDc0LjQyLTMzLjQyOCA3NC40Mi03NC41MTZhNzQuMjMgNzQuMjMgMCAwIDAtMy4yOTMtMjEuODk5bDE3MS40MzMtMTg1LjcxMmE3NC40NTUgNzQuNDU1IDAgMCAwIDc2LjMzNCAxMi4wNzhsNjcuMzkgMTM2LjE5MmE3NC4xNjggNzQuMTY4IDAgMCAwLTExLjIzOCAzOS40NWMwIDQxLjA4MiAzMy4zODIgNzQuNTE2IDc0LjQ0NCA3NC41MTYgNDEuMDY4IDAgNzQuNDQ1LTMzLjQyOSA3NC40NDUtNzQuNTE3YTc0LjM0MiA3NC4zNDIgMCAwIDAtMi43MjQtMTkuOTE2bDIyNC42NzEtMjA5LjI2NWE3My45NjQgNzMuOTY0IDAgMCAwIDMzLjk5MiA4LjI0OGM0MS4wNDIgMCA3NC40MTktMzMuNDI4IDc0LjQxOS03NC40OS0wLjAxLTQxLjA2OC0zMy4zODgtNzQuNTAyLTc0LjQyNC03NC41MDJ6TTEyMS4wNjkgNzEzLjA0MmEyMi45MTcgMjIuOTE3IDAgMCAxIDAtNDUuODMgMjIuOTMyIDIyLjkzMiAwIDAgMSAyMi44NzYgMjIuOTAzYy0wLjAwNSAxMi42NDYtMTAuMjg2IDIyLjkyNy0yMi44NzYgMjIuOTI3eiBtMjc2LjMxLTI2OS41MzdhMjIuODYgMjIuODYgMCAwIDEtOC41OS0xNy44OSAyMi45MzggMjIuOTM4IDAgMCAxIDIyLjkwMS0yMi45MDEgMjIuOTEyIDIyLjkxMiAwIDAgMSAyMi44NzYgMjIuOTAxYzAgNi4wNDctMi4zMiAxMS43MjUtNi41MDcgMTYuMDFsLTAuMiAwLjE4NWMtOS4wNjggOS4wNTItMjUuMDQyIDYuMDc3LTMwLjQ4IDEuNjk1ek01NzAuNTUzIDY5My4xNGEyMi45MjIgMjIuOTIyIDAgMCAxLTIyLjg3Ni0yMi45MjcgMjIuNzMzIDIyLjczMyAwIDAgMSA4LjI4LTE3LjYyM2MwLjMzNy0wLjI0IDAuNjg1LTAuNDgxIDEuMDEzLTAuNzQyIDAuMi0wLjE1OSAwLjM5LTAuMzIzIDAuNTg0LTAuNDkyYTIyLjY0IDIyLjY0IDAgMCAxIDEyLjk5NC00LjA0NSAyMi45MjcgMjIuOTI3IDAgMCAxIDIyLjg4MSAyMi45MDIgMjIuOTM4IDIyLjkzOCAwIDAgMS0yMi44NzYgMjIuOTI3eiBtMzMwLjM3OS0yOTUuNDVjLTEyLjY1MiAwLTIyLjkwMi0xMC4yOC0yMi45MDItMjIuOXMxMC4yNS0yMi45MDMgMjIuOTAyLTIyLjkwM2EyMi45MjcgMjIuOTI3IDAgMCAxIDIyLjg3IDIyLjkwMiAyMi45MjcgMjIuOTI3IDAgMCAxLTIyLjg3IDIyLjkwMnoiIHAtaWQ9IjIxOTQiPjwvcGF0aD48L3N2Zz4=); } .l7-control-draw .draw-polygon { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NjI5MzI3Nzc1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjE3MzkiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNDIxLjE0OSA5OTAuNDA0bC0xNDMuMzE4LTEzNy4xNS00My42NzktNDEuNzY0TDMxLjg0OSA2MTcuODUzbDIzNC4wNzQtNDg1LjQ4OCAxMjUuMTQxIDE3LjAyNiAxMDMuNjE0IDE0LjA0MS04LjA1NyA1OS40NTYtMTAzLjYzLTE0LjA0My04MS45Ni0xMS4xNTEtOTguMTAzIDIwMy40MzItOTguMTA1IDIwMy41MTkgMTcwLjgwNiAxNjMuNDkgNDMuNjgxIDQxLjc2NiAzNi4xNTcgMzQuNjE2IDc1LjY5OCA3Mi40IDM2LjUyOS0xOS42MjEgNTUuNzE4LTI5Ljk3MSA1MS43MDctMjcuNzM2IDUxLjgzNC0yNy45NjcgMTcuMTEtOS4xMTQgMTcuMTg4LTkuMyAzNC40NzYtMTguNDggMTcuMjM5LTkuMyAzNC41NDItMTguNTA1IDE3LjMxNS05LjM4NyAxNy4yNTYtOS4yMDEgNDYuOTgtMjUuMjkzLTQuOTk1LTI3LjM3NS04LjgzNi00OC45NjYtMTUuMzQxLTg0Ljg5MSA1OS4wNDQtMTAuNjcgMTUuMzQyIDg0Ljg5OCA4LjgyNyA0OC45MTggMTIuODMxIDcwLjMyOC0zMy43MTcgMTguMDQ5LTUxLjgyNyAyNy45MDQtMTcuMjM2IDkuMTktMTcuMjcyIDkuMzY1LTM0LjQ5MyAxOC40NzgtMzQuNTMxIDE4LjU3Ni0xNy4yMTMgOS4yMi0xNy4yOTIgOS4zNTYtMTcuMDk3IDkuMTA2LTE3LjIxOCA5LjMzNXoiIGZpbGw9IiMzRTNBMzkiIHAtaWQ9IjE3NDAiPjwvcGF0aD48cGF0aCBkPSJNNzUyLjUyNCA1NS40MzRoNjB2MzcwLjMyM2gtNjB6IiBmaWxsPSIjM0UzQTM5IiBwLWlkPSIxNzQxIj48L3BhdGg+PHBhdGggZD0iTTU5Ny4zODUgMjA1LjY5N2gzNzAuMjc5djYwSDU5Ny4zODV6IiBmaWxsPSIjM0UzQTM5IiBwLWlkPSIxNzQyIj48L3BhdGg+PC9zdmc+); } .l7-control-draw .draw-rect { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NjI5Mjk5NTYxIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjEwMDEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNzY1LjIzNCA2OS40MTdoNjB2MzcwLjYwNWgtNjB6IiBmaWxsPSIjM0UzQTM5IiBwLWlkPSIxMDAyIj48L3BhdGg+PHBhdGggZD0iTTYxNC4xOTMgMjE5LjgwN2gzNjIuMTI4djYwSDYxNC4xOTN6IiBmaWxsPSIjM0UzQTM5IiBwLWlkPSIxMDAzIj48L3BhdGg+PHBhdGggZD0iTTgyNS4yMzQgOTc1LjkzNkg4OS44MTlWMjI0LjcwN2gzNjcuNzA4djYwSDE0OS44MTl2NjMxLjIyOWg2MTUuNDE1VjYwMC4yOTloNjB6IiBmaWxsPSIjM0UzQTM5IiBwLWlkPSIxMDA0Ij48L3BhdGg+PC9zdmc+); } .l7-control-draw .draw-circle { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NjI5MjYwMDI2IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjI3NzYiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNTEyIDg4MS4wNjY2NjdBMzY5LjA2NjY2NyAzNjkuMDY2NjY3IDAgMSAxIDg4MS4wNjY2NjcgNTEyIDM2OS40OTMzMzMgMzY5LjQ5MzMzMyAwIDAgMSA1MTIgODgxLjA2NjY2N3ogbTAtNjgyLjY2NjY2N0EzMTMuNiAzMTMuNiAwIDEgMCA4MjUuNiA1MTIgMzE0LjAyNjY2NyAzMTQuMDI2NjY3IDAgMCAwIDUxMiAxOTguNHoiIGZpbGw9IiIgcC1pZD0iMjc3NyI+PC9wYXRoPjwvc3ZnPg==); } .l7-control-draw .draw-delete { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTg1NzMwNDEyNjU0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQ4MDQiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTI4IiBoZWlnaHQ9IjEyOCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNMjEzLjMzMzMzMyAyODIuODM3MzMzYzAtMjAuNjkzMzMzIDE2LjE3MDY2Ny0zNy40MTg2NjcgMzYuMDk2LTM3LjQxODY2NmgxODAuNDh2LTM3LjM3NmMwLTIwLjY1MDY2NyAxNi4yMTMzMzMtMzcuMzc2IDM2LjEzODY2Ny0zNy4zNzZoNzIuMTkyYzE5Ljk2OCAwIDM2LjEzODY2NyAxNi43MjUzMzMgMzYuMTM4NjY3IDM3LjM3NnYzNy4zNzZoMTgwLjQ4YzE5Ljk2OCAwIDM2LjA5NiAxNi43MjUzMzMgMzYuMDk2IDM3LjQxODY2NnYzNy4zNzZIMjEzLjMzMzMzM3YtMzcuMzc2eiBtNTQxLjUyNTMzNCAxMTIuMTI4djQyMC45OTJjMCAyMC42MDgtMTYuMTI4IDM3LjM3Ni0zNi4wOTYgMzcuMzc2SDI4NS41MjUzMzNjLTE5LjkyNTMzMyAwLTM2LjA5Ni0xNi43NjgtMzYuMDk2LTM3LjM3NlYzNTcuNTQ2NjY3aDUwNS40MjkzMzR2MzcuMzc2ek0zOTMuODU2IDQ2OS43NmMwLTIwLjY1MDY2Ny0xNi4xNzA2NjctMzcuNDE4NjY3LTM2LjA5Ni0zNy40MTg2NjctMTkuOTY4IDAtMzYuMTM4NjY3IDE2Ljc2OC0zNi4xMzg2NjcgMzcuNDE4NjY3djI3MS40MDI2NjdjMCAyMC42NTA2NjcgMTYuMjEzMzMzIDM3LjQxODY2NyAzNi4xMzg2NjcgMzcuNDE4NjY2IDE5LjkyNTMzMyAwIDM2LjA5Ni0xNi43NjggMzYuMDk2LTM3LjQxODY2NlY0NjkuNzZ6IG0xNDQuMzg0IDBjMC0yMC42NTA2NjctMTYuMTI4LTM3LjQxODY2Ny0zNi4wOTYtMzcuNDE4NjY3LTE5LjkyNTMzMyAwLTM2LjA5NiAxNi43NjgtMzYuMDk2IDM3LjQxODY2N3YyNzEuNDAyNjY3YzAgMjAuNjUwNjY3IDE2LjE3MDY2NyAzNy40MTg2NjcgMzYuMDk2IDM3LjQxODY2NiAxOS45NjggMCAzNi4wOTYtMTYuNzY4IDM2LjA5Ni0zNy40MTg2NjZWNDY5Ljc2eiBtMTQ0LjQyNjY2NyAwYzAtMjAuNjUwNjY3LTE2LjE3MDY2Ny0zNy40MTg2NjctMzYuMDk2LTM3LjQxODY2Ny0xOS45NjggMC0zNi4wOTYgMTYuNzY4LTM2LjA5NiAzNy40MTg2Njd2MjcxLjQwMjY2N2MwIDIwLjY1MDY2NyAxNi4xMjggMzcuNDE4NjY3IDM2LjA5NiAzNy40MTg2NjYgMTkuOTI1MzMzIDAgMzYuMDk2LTE2Ljc2OCAzNi4wOTYtMzcuNDE4NjY2VjQ2OS43NnoiIHAtaWQ9IjQ4MDUiPjwvcGF0aD48L3N2Zz4=); } .l7-control-draw .draw-ruler { background-image: url(data:image/svg+xml;base64,PHN2ZyB0PSIxNjI4NTk5MjgwNTYwIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjEyMDMiIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cGF0aCBkPSJNNzI0Ljk5MiAwLjkwMzUyOUwwLjkwMzUyOSA3MjQuOTkybDI5OC4xNjQ3MDYgMjk4LjEwNDQ3MSA3MjQuMDI4MjM2LTcyNC4wMjgyMzYtMjk4LjEwNDQ3MS0yOTguMTY0NzA2ek04Ni4wNzYyMzUgNzI0Ljk5Mmw0MS45MjM3NjUtNDEuOTIzNzY1IDg1LjE3MjcwNiA4NS4xNzI3MDYgNDIuNTg2MzUzLTQyLjU4NjM1My04NS4xNzI3MDYtODUuMTcyNzA2IDQzLjMwOTE3Ni00My4zMDkxNzYgNDIuNTg2MzUzIDQyLjU4NjM1MyA0Mi41ODYzNTMtNDIuNTg2MzUzLTQyLjU4NjM1My00Mi41ODYzNTMgNDIuNTg2MzUzLTQyLjU4NjM1MyA4NS4xNzI3MDYgODUuMTcyNzA2IDQyLjU4NjM1My00Mi41ODYzNTMtODUuMTcyNzA2LTg1LjE3MjcwNiA0MS45MjM3NjUtNDEuOTIzNzY1IDQyLjU4NjM1MyA0Mi41ODYzNTMgNDIuNTg2MzUzLTQyLjU4NjM1My00Mi41ODYzNTMtNDIuNTg2MzUzIDQyLjU4NjM1My00Mi41ODYzNTMgODUuMTcyNzA2IDg1LjE3MjcwNiA0Mi41ODYzNTMtNDIuNTg2MzUzLTg1LjE3MjcwNi04NS4xNzI3MDUgNDMuMjQ4OTQxLTQzLjI0ODk0MiA0Mi41ODYzNTMgNDIuNTg2MzUzIDQyLjU4NjM1My00Mi41ODYzNTMtNDIuNTg2MzUzLTQyLjU4NjM1MyA0Mi41ODYzNTMtNDIuNTg2MzUzIDg1LjIzMjk0MSA4NS4xNzI3MDYgNDIuNTg2MzUzLTQyLjU4NjM1My04NS4yMzI5NDEtODUuMTcyNzA1IDQyLjY0NjU4OC00Mi42NDY1ODkgMjEyLjkzMTc2NSAyMTIuOTkyTDI5OS4wNjgyMzUgOTM3LjkyMzc2NWwtMjEyLjk5Mi0yMTIuOTMxNzY1eiIgcC1pZD0iMTIwNCI+PC9wYXRoPjwvc3ZnPg==); } .l7-control-draw .draw-boxSelect { background-image: url(data:image/svg+xml;base64,PHN2ZyB0PSIxNjI4NTk5NTE4MTg1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjM3NzciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cGF0aCBkPSJNMzQxLjMzMzMzMyAxNzAuNjY2NjY3Vjg1LjMzMzMzM2gxMjh2ODUuMzMzMzM0SDM0MS4zMzMzMzN6IG0yMTMuMzMzMzM0IDBWODUuMzMzMzMzaDEyOHY4NS4zMzMzMzRoLTEyOHpNMzQxLjMzMzMzMyA5MzguNjY2NjY3di04NS4zMzMzMzRoMTI4djg1LjMzMzMzNEgzNDEuMzMzMzMzeiBtMjEzLjMzMzMzNCAwdi04NS4zMzMzMzRoMTI4djg1LjMzMzMzNGgtMTI4ek04NS4zMzMzMzMgNjgyLjY2NjY2N3YtMTI4aDg1LjMzMzMzNHYxMjhIODUuMzMzMzMzeiBtMC0yMTMuMzMzMzM0VjM0MS4zMzMzMzNoODUuMzMzMzM0djEyOEg4NS4zMzMzMzN6IG03NjggMjEzLjMzMzMzNHYtMTI4aDg1LjMzMzMzNHYxMjhoLTg1LjMzMzMzNHogbTAtMjEzLjMzMzMzNFYzNDEuMzMzMzMzaDg1LjMzMzMzNHYxMjhoLTg1LjMzMzMzNHpNODUuMzMzMzMzIDI1NlY4NS4zMzMzMzNoMTcwLjY2NjY2N3Y4NS4zMzMzMzRIMTcwLjY2NjY2N3Y4NS4zMzMzMzNIODUuMzMzMzMzeiBtODUzLjMzMzMzNCAwaC04NS4zMzMzMzRWMTcwLjY2NjY2N2gtODUuMzMzMzMzVjg1LjMzMzMzM2gxNzAuNjY2NjY3djE3MC42NjY2Njd6TTg1LjMzMzMzMyA3NjhoODUuMzMzMzM0djg1LjMzMzMzM2g4NS4zMzMzMzN2ODUuMzMzMzM0SDg1LjMzMzMzM3YtMTcwLjY2NjY2N3ogbTg1My4zMzMzMzQgMHYxNzAuNjY2NjY3aC0xNzAuNjY2NjY3di04NS4zMzMzMzRoODUuMzMzMzMzdi04NS4zMzMzMzNoODUuMzMzMzM0eiIgcC1pZD0iMzc3OCI+PC9wYXRoPjwvc3ZnPg==); } .horizontal { flex-direction: row; } .horizontal button:focus:first-child { border-radius: 4px 0px 0px 4px; } .horizontal button:focus:last-child { border-radius: 0px 4px 4px 4px; } .horizontal button + button { border-left: 1px solid #eee; } .vertical { flex-direction: column; } .vertical button:focus:first-child { border-radius: 4px 4px 0 0; } .vertical button:focus:last-child { border-radius: 0px 0px 4px 4px; } .vertical button + button { border-top: 1px solid #eee; } .gi-l7-botton-container { position: absolute; top: 50px; left: 9px; background: #ffffff; border: 1px solid #d4d8da; border-radius: 4px; } .gi-l7-botton-container .gi-l7-botton { display: block; box-sizing: border-box; width: 30px; height: 30px; margin: 1px; padding: 0; border: 0; outline: none; } .mapboxgl-map { background: var(--background-color) !important; } ul.graphin-components-toolbar-content { background: var(--background-color); color: var(--text-color); width: 100%; padding: 0; text-align: center; list-style: none; box-shadow: var(--box-shadow-base); border-radius: 6px; } .gi-properties-pannel ul { display: block; margin: 0px; padding: 0px; list-style: none; } .gi-properties-pannel ul li { padding: 6px 0px; } .gi-properties-pannel ul li .key { font-size: 12px; opacity: 0.8; } .gi-properties-pannel ul li .value { font-size: 14px; word-break: break-word; } .content { display: flex; flex-direction: column; width: 100%; height: 100%; color: var(--text-color-2); background-color: var(--background-color); border-radius: 8px; } .content .content-header { display: flex; align-items: center; justify-content: space-between; height: 32px; padding: 0 10px; font-weight: 500; font-size: 14px; } .content .content-header > div { flex: 1; } .content .content-header .content-header-field { font-size: 11px; text-align: left; } .content .content-header .content-header-field span { margin-right: 6px; } .content .content-header .content-header-time { color: var(--text-color); font-weight: 500; font-size: 14px; user-select: none; } .content .chart { height: calc(100% - 80px); } .content .content-btn { display: flex; align-items: center; justify-content: center; height: 32px; } .content .content-btn > div { margin: 0 5px; } .content-btn-item { width: 32px; height: 32px; background-color: var(--background-color); border-radius: 4px; cursor: pointer; } .content-btn-item .ant-btn { padding-right: 0; padding-left: 0; color: var(--text-color-2); } .content-btn-item span { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; } .content-btn-item:hover span { color: var(--primary-color); }