kopia lustrzana https://github.com/iv-org/invidious
Add styling to search bar on empty home page
rodzic
e1af3d9bf3
commit
555108c7fd
|
@ -172,7 +172,7 @@ img.thumbnail {
|
|||
flex: 1;
|
||||
}
|
||||
|
||||
.navbar > .searchbar {
|
||||
.searchbar {
|
||||
flex-grow: 2; /* take double the space of the other items */
|
||||
}
|
||||
|
||||
|
@ -185,7 +185,7 @@ img.thumbnail {
|
|||
display: inline;
|
||||
}
|
||||
|
||||
.navbar > .searchbar .pure-form input[type="search"] {
|
||||
.searchbar .pure-form input[type="search"] {
|
||||
margin-bottom: 1px;
|
||||
|
||||
border-top: 0;
|
||||
|
@ -210,12 +210,12 @@ input[type="search"]::-webkit-search-cancel-button {
|
|||
background-size: 14px;
|
||||
}
|
||||
|
||||
.navbar > .searchbar .pure-form fieldset {
|
||||
.searchbar .pure-form fieldset {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* attract focus to the searchbar by adding a subtle transition */
|
||||
.navbar > .searchbar .pure-form input[type="search"]:focus {
|
||||
.searchbar .pure-form input[type="search"]:focus {
|
||||
margin-bottom: 0px;
|
||||
border-bottom: 2px solid #aaa;
|
||||
}
|
||||
|
@ -586,7 +586,7 @@ body.dark-theme {
|
|||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.dark-theme .navbar > .searchbar input {
|
||||
.dark-theme .searchbar input {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
@ -625,7 +625,7 @@ body.dark-theme {
|
|||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.no-theme .navbar > .searchbar input {
|
||||
.no-theme .searchbar input {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
#search-widget {
|
||||
text-align: center;
|
||||
margin: 50px auto;
|
||||
}
|
||||
|
||||
#logo > h1 {
|
||||
font-size: 3.5em;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
|
@ -3,16 +3,17 @@
|
|||
<title>
|
||||
Invidious
|
||||
</title>
|
||||
<link rel="stylesheet" href="/css/empty.css?v=<%= ASSET_COMMIT %>">
|
||||
<% end %>
|
||||
|
||||
<%= rendered "components/feed_menu" %>
|
||||
|
||||
<div class="pure-g h-box">
|
||||
<div class="pure-u-1">
|
||||
<div class="pure-g h-box" id="search-widget">
|
||||
<div class="pure-u-1" id="logo">
|
||||
<h1 href="/" class="pure-menu-heading">Invidious</h1>
|
||||
</div>
|
||||
<div class="pure-u-1-4"></div>
|
||||
<div class="pure-u-1-2 searchbar">
|
||||
<div class="pure-u-1 pure-u-md-12-24 searchbar">
|
||||
<form class="pure-form" action="/search" method="get">
|
||||
<fieldset>
|
||||
<input type="search" style="width:100%" name="q" placeholder="<%= translate(locale, "search") %>" value="<%= env.get?("search").try {|x| HTML.escape(x.as(String)) } %>">
|
||||
|
|
Ładowanie…
Reference in New Issue