You are here

Home » API reference » Geolocation Field 8

geolocation-widget-html5.css in Geolocation Field 8

Same filename and directory in other branches
  1. 8.3 css/geolocation-widget-html5.css
  2. 8.2 css/geolocation-widget-html5.css

CSS for Google Map widget of Geolocation field.

File

css/geolocation-widget-html5.css
View source 
  1. /**

  2.  * @file

  3.  * CSS for Google Map widget of Geolocation field.

  4.  */

  5. 

  6. .geolocation-html5-button {

  7.   padding: 0 0.75em 0 3.5em;

  8.   position: relative;

  9.   background-color: #eee;

  10.   width: 100%;

  11.   min-height: 34px;

  12.   line-height: 34px;

  13.   cursor: pointer;

  14.   border: 0;

  15.   border-radius: 2px;

  16.   -webkit-box-sizing: border-box;

  17.   -moz-box-sizing: border-box;

  18.   box-sizing: border-box;

  19. }

  20. 

  21. .geolocation-html5-button.disabled {

  22.   cursor: default;

  23. }

  24. 

  25. /**

  26.  * Location icon by: http://jxnblk.github.io/

  27.  */

  28. .geolocation-html5-button::before {

  29.   background: url(data:image/png;base64,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) no-repeat scroll center center transparent;

  30.   background-size: 20px;

  31.   height: 20px;

  32.   width: 20px;

  33.   content: "";

  34.   display: block;

  35.   position: absolute;

  36.   top: 0.55em;

  37.   left: 1em;

  38.   opacity: 0.4;

  39. }

  40. 

  41. .geolocation-html5-button .clear,

  42. .geolocation-html5-button .search {

  43.   border-radius: 0 2px 2px 0;

  44.   height: 100%;

  45.   width: 40px;

  46.   position: absolute;

  47.   top: 0;

  48.   right: 0;

  49.   cursor: pointer;

  50. }

  51. 

  52. .geolocation-html5-button .clear {

  53.   display: none;

  54.   background: #736648 -webkit-linear-gradient(top, #736648, #685C41);

  55.   z-index: 10;

  56. }

  57. 

  58. .geolocation-html5-button .clear::after {

  59.   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADcAAAA3CAYAAACo29JGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo3MEEyNTM1QjBBMjA2ODExODA4MzkzODI3MjczQzA3MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyNzhDRDg3QTQ5MEExMUU0QTdGMkM1NzMyMDlBMjJBNSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyNzhDRDg3OTQ5MEExMUU0QTdGMkM1NzMyMDlBMjJBNSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzBBMjUzNUIwQTIwNjgxMTgwODM5MzgyNzI3M0MwNzAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NzBBMjUzNUIwQTIwNjgxMTgwODM5MzgyNzI3M0MwNzAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5jChSGAAAB2UlEQVR42tTaS07DQAwG4JANCSu4AuIstN3BJWFJyYaUy3ACRFclrAYPZKRplMfMxPbYln5VSh3JX9W6UZTCGFN42UL2kGpwXHou+7m3/vEh7Nv8V6sIaGFv/dydD3QNGw9mFAF9mBkCp2AagGOwM6BtejXzJRE4B3PV2MYaclAEDIFZz5U7QQuwCoUNt6V0YBRsiHPAViAwGjaGkwhMgk3hJAGTYXM4CcBVsCVcDLCWBgvB5QCiwEJxnEA0WAyOA4gKi8VRAtFhKTgKIAksFYcJJIOtwWEASWFrcWuA5DAMXAqQBYaFiwHecMEwcaHALy6YzcWfEK8qyB6ySTj3HfIIOWENUxa41UEeIIfcMApcCpAEZgv7a+nXNeSjf52qI+QO8kkxQEkEs7+95wWY+wCeILUWnIW9QLaB/ff9Eqql42JhpMCSGXbkBJaMMLsVbxe2KC6Q8Z6Hf23ZRvRnu/yKhRWcwBwwNmAuGAswJ4wcmBtGCpQAIwNKgZEAJcHQgdJgqMBsa5oDKBWGModk2Op5pMNWzaUBljyfFljSnJpg0cCQp/YkwWKAjXtCtlMECwFaz8417kaAkmFzwK73nG1LH6gBNgb8cbCx/zn7RqMI5gMbH2bzK8AAUThtyVYr9bAAAAAASUVORK5CYII=) no-repeat center center transparent;

  60.   background-size: 12px;

  61.   content: "";

  62.   display: block;

  63.   height: 100%;

  64. }

  65. 

  66. .geolocation-html5-button .search {

  67.   background: #4d90fe -webkit-linear-gradient(top, #4d90fe, #4787ed);

  68. }

  69. 

  70. .geolocation-html5-button .search::before {

  71.   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAABVUlEQVRYw+2YQRGEMAxFkVAJlYAEJCABCUhAQiWshJWABCRUAg7+XsrMTkibNDBdDvtnek0fSfqToQPQPeE8AuK5IDkBGAC8AESctQEIAHxXKTUIgB7ACr0CAHcrCIAJNm0A+ltALkAc2jWlKoKkcnCKCdCR0i3p4lNmroJwPRGEgC6VhGo2gaTXUQUhwEQryKsmUOaZU40WEOoTk8Eb3iTGYgGhcgaQmcRYL4N0BjHl+RnIeDuI1iFJ8EBivC0gm7bRCsGj1ktKIIGx6pohNjNZ9RYQnxliTgHRM1a/XrH4kIEZhEzstT0mgeTmBpJZzemJjgk65naTO9aAPvOFtavAWMqKdjHyhcxIW9quGRVVO2uh/lTr8fWMqbEw1cvzV/AlXXico2c884IgwZhADMY2STBNQDQwzUAkmKYgAoxvClKAGZqDMDBb89IwRjlI0/f/W+ID3tQLQPib2qQAAAAASUVORK5CYII=) no-repeat center center transparent;

  72.   background-size: 17px;

  73.   content: "";

  74.   display: block;

  75.   height: 100%;

  76. }