arcHIVE-tech/arc-hive-wordpress-theme
arcHIVE-tech
/
arc-hive-wordpress-theme
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

search form as in omeka style

This commit is contained in:
jorge 2022-04-08 01:10:36 +02:00
parent 0583982e49
commit 04fedfcda2
7 changed files with 181 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/assets/css/app.css vendored
View File

File diff suppressed because one or more lines are too long

2
dist/assets/scss/_settings.scss vendored
View File

@ -461,7 +461,7 @@ $select-background: $white;
$select-triangle-color: $dark-gray;
$select-radius: $global-radius;
$input-color: $black;
$input-placeholder-color: $medium-gray;
$input-placeholder-color: scale-color($primary-color, $lightness: 35%);//$medium-gray;
$input-font-family: inherit;
$input-font-size: rem-calc(16);
$input-font-weight: $global-weight-normal;

76
dist/assets/scss/components/_forms.scss vendored
View File

@ -1,5 +1,5 @@
// search elements
.search{
.search {
.input-group {
position: relative;
border-radius: 4rem;
@ -16,14 +16,14 @@
.input-group * {
margin: 0;
}
.button{
.button {
border-color: $primary-color;
}
.appear{
.appear {
display:none;
}
input{
&:active{
input {
&:active {
border-color: $primary-color;
background-color: $input-background-focus;
}
@ -51,9 +51,9 @@
.hollow {
border-color: $primary-color;
color: $primary-color;
&::after {
&:after {
}
&::placeholder {
&:placeholder {
color: scale-color($primary-color, $lightness: -20%);
}
&:hover {
@ -87,7 +87,67 @@ article,.omekas-entry-content {
}
}
}
// wordpress
.search-form {
display: flex;
justify-content: center;
align-content: center;
.search-field {
margin-bottom: 0;
}
label {
width: 40vw;
max-width: 30rem;
}
input[type="search"] {
padding-left: $global-padding;
padding-right: $global-padding;
border: $input-border;
background-color: $input-background-focus;
border-radius: $global-radius-archive;
}
input[type="submit"]{
@extend button;
width:0px;
min-width: unset !important;
height:0px;
background-color: $input-background-focus;
border-radius: $global-radius-archive;
}
&:active,&:focus,&:focus-within{
label {
width: calc(40vw + 10rem);
margin-right: -10rem;
}
input[type="submit"] {
width:auto;
min-width: 10rem !important;
height:auto;
background-color: scale-color($input-background-focus, $lightness: -20%);
}
input[type="search"] {
padding-right: 11rem;
border-color: $primary-color;
background-color: $input-background-focus;
&:not(:placeholder-shown) {
border:none;
background-color: $input-background-focus;
color: $primary-color;
//position: relative;
//padding-right: $global-padding * 9;
//+ .appear {
// display: block;
// background-color: scale-color($input-background-focus, $lightness: -20%);
// z-index: 2;
// &:hover {
// color: $white;
// background-color: $primary-color;
// }
//}
}
}
}
}
// contact form 7
//

25
dist/assets/scss/modules/_content.scss vendored
View File

@ -323,6 +323,23 @@ main {
}
}
}
//&.announcement.top {
&.announcement {
.slide {
width: 100%;
}
.widget_nav_menu,.widget_tag_cloud {
width: auto;
}
.widget_tag_cloud {
h6 {
display:none;
}
a{
display: inline;
}
}
}
&.top.secondary {
align-content: center;
justify-content: center;
@ -330,10 +347,10 @@ main {
margin: 2rem 0;
}
a {
border: 1px solid black;
border-radius: 2rem;
padding: 1rem;
color:blue;
//border: 1px solid black;
//border-radius: 2rem;
//padding: 1rem;
//color:blue;
}
}
}

2
src/assets/scss/_settings.scss
View File

@ -461,7 +461,7 @@ $select-background: $white;
$select-triangle-color: $dark-gray;
$select-radius: $global-radius;
$input-color: $black;
$input-placeholder-color: $medium-gray;
$input-placeholder-color: scale-color($primary-color, $lightness: 35%);//$medium-gray;
$input-font-family: inherit;
$input-font-size: rem-calc(16);
$input-font-weight: $global-weight-normal;

76
src/assets/scss/components/_forms.scss
View File

@ -1,5 +1,5 @@
// search elements
.search{
.search {
.input-group {
position: relative;
border-radius: 4rem;
@ -16,14 +16,14 @@
.input-group * {
margin: 0;
}
.button{
.button {
border-color: $primary-color;
}
.appear{
.appear {
display:none;
}
input{
&:active{
input {
&:active {
border-color: $primary-color;
background-color: $input-background-focus;
}
@ -51,9 +51,9 @@
.hollow {
border-color: $primary-color;
color: $primary-color;
&::after {
&:after {
}
&::placeholder {
&:placeholder {
color: scale-color($primary-color, $lightness: -20%);
}
&:hover {
@ -87,7 +87,67 @@ article,.omekas-entry-content {
}
}
}
// wordpress
.search-form {
display: flex;
justify-content: center;
align-content: center;
.search-field {
margin-bottom: 0;
}
label {
width: 40vw;
max-width: 30rem;
}
input[type="search"] {
padding-left: $global-padding;
padding-right: $global-padding;
border: $input-border;
background-color: $input-background-focus;
border-radius: $global-radius-archive;
}
input[type="submit"]{
@extend button;
width:0px;
min-width: unset !important;
height:0px;
background-color: $input-background-focus;
border-radius: $global-radius-archive;
}
&:active,&:focus,&:focus-within{
label {
width: calc(40vw + 10rem);
margin-right: -10rem;
}
input[type="submit"] {
width:auto;
min-width: 10rem !important;
height:auto;
background-color: scale-color($input-background-focus, $lightness: -20%);
}
input[type="search"] {
padding-right: 11rem;
border-color: $primary-color;
background-color: $input-background-focus;
&:not(:placeholder-shown) {
border:none;
background-color: $input-background-focus;
color: $primary-color;
//position: relative;
//padding-right: $global-padding * 9;
//+ .appear {
// display: block;
// background-color: scale-color($input-background-focus, $lightness: -20%);
// z-index: 2;
// &:hover {
// color: $white;
// background-color: $primary-color;
// }
//}
}
}
}
}
// contact form 7
//

25
src/assets/scss/modules/_content.scss
View File

@ -323,6 +323,23 @@ main {
}
}
}
//&.announcement.top {
&.announcement {
.slide {
width: 100%;
}
.widget_nav_menu,.widget_tag_cloud {
width: auto;
}
.widget_tag_cloud {
h6 {
display:none;
}
a{
display: inline;
}
}
}
&.top.secondary {
align-content: center;
justify-content: center;
@ -330,10 +347,10 @@ main {
margin: 2rem 0;
}
a {
border: 1px solid black;
border-radius: 2rem;
padding: 1rem;
color:blue;
//border: 1px solid black;
//border-radius: 2rem;
//padding: 1rem;
//color:blue;
}
}
}