Making the close button more visually consistent on the menu popup forms

This commit is contained in:
Jay Sitter 2014-10-30 16:00:18 -04:00
parent 06e7e7ff7b
commit cd271fc485
3 changed files with 25 additions and 29 deletions

View file

@ -1,7 +1,7 @@
<div id="bagit-form" class="messages info"> <div id="bagit-form" class="messages info">
<form method="get" action="index.php" target="_blank" id="bagit-form-form"> <form method="get" action="index.php" target="_blank" id="bagit-form-form">
<h2><a href="javascript: void(null);" id="bagit-form-close">X</a> <h2>{% trans "Save a link" %}</h2>
{% trans "Save a link" %}</h2> <a href="javascript: void(null);" id="bagit-form-close" class="popup-close">&times;</a>
<input type="hidden" name="autoclose" value="1" /> <input type="hidden" name="autoclose" value="1" />
<input required placeholder="example.com/article" class="addurl" id="plainurl" name="plainurl" type="url" /> <input required placeholder="example.com/article" class="addurl" id="plainurl" name="plainurl" type="url" />
<span id="add-link-result"></span> <span id="add-link-result"></span>

View file

@ -1,7 +1,8 @@
<div id="search-form" class="messages info"> <div id="search-form" class="messages info">
<form method="get" action="index.php"> <form method="get" action="index.php">
<a href="javascript: void(null);" id="search-form-close" class="popup-close">&times;</a>
<input type="hidden" name="view" value="search"></input> <input type="hidden" name="view" value="search"></input>
<label><a href="javascript: void(null);" id="search-form-close">X</a>{% trans "Search" %}</label> : <input required placeholder="{% trans "Enter your search here" %}" type="text" name="search" id="searchfield" /> <label>{% trans "Search" %}</label>: <input required placeholder="{% trans "Enter your search here" %}" type="text" name="search" id="searchfield" />
<input id="submit-search" type="submit" value="{% trans "Search" %} !"></input> <input id="submit-search" type="submit" value="{% trans "Search" %} !"></input>
</form> </form>
</div> </div>

View file

@ -192,7 +192,7 @@ h2:after {
padding-bottom: 1em; padding-bottom: 1em;
} }
#links a { #links > li > a {
display: block; display: block;
padding: 0.5em 2em 0.5em 1em; padding: 0.5em 2em 0.5em 1em;
color: #FFF; color: #FFF;
@ -208,7 +208,7 @@ h2:after {
transition: all 0.5s ease; transition: all 0.5s ease;
} }
#links a:hover, #links a:focus { #links > li > a:hover, #links > li > a:focus {
background: #999; background: #999;
color: #000; color: #000;
} }
@ -569,19 +569,28 @@ footer a {
padding: 2em; padding: 2em;
} }
a#bagit-form-close, a#search-form-close { #bagit-form-form .addurl {
margin-left: 0;
}
.popup-close {
background: #000; background: #000;
color: #FFF; color: #FFF;
padding: 0.2em 0.5em; font-size: 1.4em;
line-height: 1.6em;
width: 1.6em;
height: 1.6em;
text-align: center;
text-decoration: none; text-decoration: none;
display: inline-block; display: inline-block;
float: right; position: absolute;
font-size: 0.6em; top: 0;
right: 0;
} }
a#bagit-form-close:hover, a#search-form-close:hover { .popup-close:hover {
background: #999; background: #999;
color: #000; color: #000;
} }
.active-current { .active-current {
background-color: #999; background-color: #999;
@ -665,20 +674,6 @@ a.add-to-wallabag-link-after:after {
padding: 2em; padding: 2em;
} }
a#search-form-close {
background: #000;
color: #FFF;
padding: 0.2em 0.5em;
text-decoration: none;
display: inline-block;
float: right;
font-size: 1.2em;
}
a#search-form-close:hover {
background: #999;
color: #000;
}
#submit-search{ #submit-search{
margin-left: 4em; margin-left: 4em;
margin-top:1em; margin-top:1em;