You are here

geolocation-widget-googlegeocoder.css in Geolocation Field 8

CSS for Google Map widget of Geolocation field.

File

css/geolocation-widget-googlegeocoder.css
View source
  1. /**
  2. * @file
  3. * CSS for Google Map widget of Geolocation field.
  4. */
  5. .geolocation-map {
  6. /* Clear floated elements */
  7. overflow: auto;
  8. }
  9. .geolocation-map-canvas {
  10. height: 350px;
  11. width: 100%;
  12. }
  13. /* Fix Google Maps v3 controls */
  14. .geolocation-map-canvas .gmnoprint img {
  15. max-width: none;
  16. }
  17. .geocode-controls-wrapper {
  18. display: block;
  19. margin: 1em 0 0 1em;
  20. }
  21. .geocode-controls-wrapper input.location,
  22. .geocode-controls-wrapper button {
  23. position: relative;
  24. padding: 0;
  25. height: 32px;
  26. outline: none;
  27. vertical-align: top;
  28. box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  29. text-overflow: ellipsis;
  30. border: 1px solid transparent;
  31. box-sizing: content-box;
  32. font-size: 14px;
  33. margin: 0;
  34. }
  35. .geocode-controls-wrapper input.location {
  36. padding: 0 1em;
  37. border-radius: 2px 0 0 2px;
  38. background-color: #fff;
  39. width: 200px;
  40. max-width: 350px;
  41. z-index: 3;
  42. border: 0;
  43. }
  44. .geocode-controls-wrapper input.location:focus {
  45. border-color: #4d90fe;
  46. }
  47. .geocode-controls-wrapper button {
  48. color: #fff;
  49. cursor: pointer;
  50. height: 32px;
  51. text-align: center;
  52. z-index: 2;
  53. margin: 0 0.1em;
  54. border-radius: 2px;
  55. border-width: 0 2px 0 2px;
  56. width: 36px;
  57. }
  58. .geocode-controls-wrapper button::before {
  59. background-size: 13px;
  60. height: 13px;
  61. width: 13px;
  62. content: "";
  63. display: block;
  64. margin: 0 auto;
  65. }
  66. .geocode-controls-wrapper button.search {
  67. background: #4d90fe;
  68. background: linear-gradient(#4d90fe, #4787ed);
  69. border-radius: 0 2px 2px 0;
  70. margin-left: -3px;
  71. z-index: 4;
  72. }
  73. .geocode-controls-wrapper button.search::before {
  74. background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAABVUlEQVRYw+2YQRGEMAxFkVAJlYAEJCABCUhAQiWshJWABCRUAg7+XsrMTkibNDBdDvtnek0fSfqToQPQPeE8AuK5IDkBGAC8AESctQEIAHxXKTUIgB7ACr0CAHcrCIAJNm0A+ltALkAc2jWlKoKkcnCKCdCR0i3p4lNmroJwPRGEgC6VhGo2gaTXUQUhwEQryKsmUOaZU40WEOoTk8Eb3iTGYgGhcgaQmcRYL4N0BjHl+RnIeDuI1iFJ8EBivC0gm7bRCsGj1ktKIIGx6pohNjNZ9RYQnxliTgHRM1a/XrH4kIEZhEzstT0mgeTmBpJZzemJjgk65naTO9aAPvOFtavAWMqKdjHyhcxIW9quGRVVO2uh/lTr8fWMqbEw1cvzV/AlXXico2c884IgwZhADMY2STBNQDQwzUAkmKYgAoxvClKAGZqDMDBb89IwRjlI0/f/W+ID3tQLQPib2qQAAAAASUVORK5CYII=);
  75. background-size: 17px;
  76. content: "";
  77. display: block;
  78. height: 17px;
  79. margin: 0 auto;
  80. width: 17px;
  81. }
  82. .geocode-controls-wrapper button.locate {
  83. background: #4d90fe;
  84. background: linear-gradient(#4d90fe, #4787ed);
  85. }
  86. .geocode-controls-wrapper button.locate::before {
  87. background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4AcVCg45w2bqzwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAHjSURBVEjHxdY7aFZBEAXg75qIhTEaBU2tpBC7IBgfTSoxQiy0EcFCsRKfRcBCopWSgAgWNmIjdlaiSECwUMHGRtRGErSSCPGBIKKRscj+sFnun9xA0APL3T27s7PMnJ29IkLDNhgRUxExGRH9Te1WaI416VthbVOjKiIWml+Ng9iLbehO/Be8wkPcx6+lOujAYZxDzyKH/IgreNDUwUpcxz5Lw+3k6E9OljmoMFaz+Swms/G7ciMcw6XSa+ngKA4U3B3sxI2Mu4o9KQc5jmConYPuFPMcIxjFTE1IpnEqhTPHhZTDOWSaPZF03mqjhaZ7ImJ3al0ZX0XEzcJ2f2s+T/I99Kf+b+zA14YJ7sNENn6Ek9CZErou6byF99iFwDN8b7Pxegyk/gw2pP72JPPpKiKmFjndcTxpMzdck4MFVbTsqCJiIGX9FlYl/m26NFJJWChEW1N/HL3Z7R7Bz068SOSbLMl9abxYkj/jeVrfm/EvEz8vRI+LcnGm5rRDqXUVt/98sXai7h5sjIjXhZ4PZfPDGT+Y8acLm6cR0VH3HnyqUcQYLmfyy7EplY+zBT+v4JXVtMK1mno0iw/YkhW7zfNKwhzu4uI/Ldf/5cFZ1ifTEv4q2qlo2f4qfrTOhG9Njf4C0EWk9x5z6KYAAAAASUVORK5CYII=);
  88. }
  89. .geocode-controls-wrapper button.clear {
  90. background: #999999;
  91. background: linear-gradient(#999999,#666666);
  92. }
  93. .geocode-controls-wrapper button.clear.disabled {
  94. background: #bbbbbb;
  95. background: linear-gradient(#dddddd,#bbbbbb);
  96. }
  97. .geocode-controls-wrapper button.clear::before {
  98. background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADcAAAA3CAYAAACo29JGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo3MEEyNTM1QjBBMjA2ODExODA4MzkzODI3MjczQzA3MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyNzhDRDg3QTQ5MEExMUU0QTdGMkM1NzMyMDlBMjJBNSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyNzhDRDg3OTQ5MEExMUU0QTdGMkM1NzMyMDlBMjJBNSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzBBMjUzNUIwQTIwNjgxMTgwODM5MzgyNzI3M0MwNzAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NzBBMjUzNUIwQTIwNjgxMTgwODM5MzgyNzI3M0MwNzAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5jChSGAAAB2UlEQVR42tTaS07DQAwG4JANCSu4AuIstN3BJWFJyYaUy3ACRFclrAYPZKRplMfMxPbYln5VSh3JX9W6UZTCGFN42UL2kGpwXHou+7m3/vEh7Nv8V6sIaGFv/dydD3QNGw9mFAF9mBkCp2AagGOwM6BtejXzJRE4B3PV2MYaclAEDIFZz5U7QQuwCoUNt6V0YBRsiHPAViAwGjaGkwhMgk3hJAGTYXM4CcBVsCVcDLCWBgvB5QCiwEJxnEA0WAyOA4gKi8VRAtFhKTgKIAksFYcJJIOtwWEASWFrcWuA5DAMXAqQBYaFiwHecMEwcaHALy6YzcWfEK8qyB6ySTj3HfIIOWENUxa41UEeIIfcMApcCpAEZgv7a+nXNeSjf52qI+QO8kkxQEkEs7+95wWY+wCeILUWnIW9QLaB/ff9Eqql42JhpMCSGXbkBJaMMLsVbxe2KC6Q8Z6Hf23ZRvRnu/yKhRWcwBwwNmAuGAswJ4wcmBtGCpQAIwNKgZEAJcHQgdJgqMBsa5oDKBWGModk2Op5pMNWzaUBljyfFljSnJpg0cCQp/YkwWKAjXtCtlMECwFaz8417kaAkmFzwK73nG1LH6gBNgb8cbCx/zn7RqMI5gMbH2bzK8AAUThtyVYr9bAAAAAASUVORK5CYII=);
  99. }
  100. .geocode-controls-wrapper button.address-button {
  101. background: #999999;
  102. background: linear-gradient(#999999,#666666);
  103. width: auto;
  104. padding: 0 8px;
  105. }
  106. .geocode-controls-wrapper button.address-button:before {
  107. content: none;
  108. }