Diplomarbeit-Absolventenverein/oqtane.framework
10
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

improve the styles in middle screen size.

Browse Source
This commit is contained in:
Ben
2025-03-04 23:31:21 +08:00
parent d136f8ac91
commit 5e2092c6d4
5 changed files with 87 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
Oqtane.Server/wwwroot/Themes/Oqtane.Themes.OqtaneTheme/Theme.css
View File

@ -99,7 +99,49 @@ div.app-moduleactions a.dropdown-toggle, div.app-moduleactions div.dropdown-menu
color: #ffffff;
z-index: 1000;
}
@media (max-width: 991.98px) {
.app-search {
border-radius: 6px;
}
.app-search input{
display: none !important;
}
.app-search input + button {
position: initial;
padding-top: 7px;
padding-bottom: 7px;
}
.app-search:active, .app-search:hover {
display: block;
position: fixed;
top: 0;
min-height: 96px;
width: 100%;
left: 0;
z-index: 999;
border-radius: 0;
}
.app-search:active .app-form-inline, .app-search:hover .app-form-inline {
margin: 10px auto;
position: relative;
display: block;
max-width: 80%;
}
.app-search:active .app-form-inline input, .app-search:hover .app-form-inline input {
width: 100%;
display: block !important;
}
.app-search:active .app-form-inline input + button, .app-search:hover .app-form-inline input + button {
position: absolute;
color: rgb(42, 159, 214);
padding-top: 6px;
padding-bottom: 6px;
}
}
@media (max-width: 767.98px) {
.app-menu {
@ -130,45 +172,7 @@ div.app-moduleactions a.dropdown-toggle, div.app-moduleactions div.dropdown-menu
position: relative;
top: 60px;
}
.app-search {
border-radius: 6px;
}
.app-search input{
display: none !important;
}
.app-search input + button {
position: initial;
padding-top: 7px;
padding-bottom: 7px;
}
.app-search:active, .app-search:hover {
display: block;
position: fixed;
top: 0;
.app-search:active, .app-search:hover{
min-height: 60px;
width: 100%;
left: 0;
z-index: 999;
border-radius: 0;
}
.app-search:active .app-form-inline, .app-search:hover .app-form-inline {
margin: 10px auto;
position: relative;
display: block;
max-width: 80%;
}
.app-search:active .app-form-inline input, .app-search:hover .app-form-inline input {
width: 100%;
display: block !important;
}
.app-search:active .app-form-inline input + button, .app-search:hover .app-form-inline input + button {
position: absolute;
color: rgb(42, 159, 214);
padding-top: 6px;
padding-bottom: 6px;
}
}