ol-ext/control/GeoBookmark.css

A set of cool extensions for OpenLayers (ol) in node modules structure

.ol-control.ol-bookmark 
{	top: 0.5em;
	left: 3em;
}
.ol-control.ol-bookmark button
{	position: relative;
}
.ol-control.ol-bookmark > button::before
{	content: "";
	position: absolute;
	border-width: 10px 5px 4px;
	border-style: solid;
	border-color: #fff;
	border-bottom-color: transparent;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	height: 0;
}

.ol-control.ol-bookmark > div
{	display: none;
	min-width: 5em;
}
.ol-control.ol-bookmark input
{	font-size: 0.9em;
	margin: 0.1em 0 ;
	padding: 0 0.5em;
}
.ol-control.ol-bookmark ul
{	margin:0;
	padding: 0;
	list-style: none;
	min-width: 10em;
}
.ol-control.ol-bookmark li
{	color: rgba(0,60,136,0.8);
	font-size: 0.9em;
	padding: 0 0.2em 0 0.5em;
	cursor: default;
	clear:both;
}

.ol-control.ol-bookmark li:hover
{	background-color: rgba(0,60,136,.5);
	color: #fff;
}

.ol-control.ol-bookmark > div button
{	width: 1em;
	height: 0.8em;
	float: right;
	background-color: transparent;
	cursor: pointer;
	border-radius: 0;
}
.ol-control.ol-bookmark > div button:before
{	content: "\2A2F";
    color: #936;
	font-size: 1.2em;
	line-height: 1em;
	border-radius: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.ol-bookmark ul li button,
.ol-bookmark input
{	display: none;
}
.ol-bookmark.ol-editable ul li button,
.ol-bookmark.ol-editable input
{	display: block;
}