kocoded/oqtane.framework
1
0
Fork 0
Code Issues Pull Requests Actions 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
Oqtane.Client/Themes/BlazorTheme/Themes/Default.razor
View File

@ -1,11 +1,6 @@
@namespace Oqtane.Themes.BlazorTheme
@inherits ThemeBase
<div class="breadcrumbs">
<Breadcrumbs />
</div>
<div class="row flex-xl-nowrap gx-0">
<div class="sidebar">
<nav class="navbar">
@ -22,6 +17,9 @@
<Login />
<ControlPanel LanguageDropdownAlignment="right" />
</div>
<div class="breadcrumbs">
<Breadcrumbs />
</div>
</div>
<div class="container">
<div class="row px-4">

59
Oqtane.Client/Themes/Controls/Theme/CookieConsent.razor
View File

@ -12,30 +12,32 @@
@if (_showBanner)
{
<input type="hidden" name="@Constants.RequestVerificationToken" value="@SiteState.AntiForgeryToken" />
<div class="container-fluid d-flex">
<div class="col-10">
@if (PageState.RenderMode == RenderModes.Static)
{
<input type="checkbox" name="cantrack" checked="@_canTrack" value="1" class="form-check-input me-2" />
}
else
{
<input type="checkbox" name="cantrack" @bind="@_canTrack" value="1" class="form-check-input me-2" />
}
@((MarkupString)Convert.ToString(Localizer["ConsentNotice"]))
</div>
<div class="col-2">
<div class="row">
<div class="col-md-6 col-xs-6 text-center">
<button class="btn btn-primary mb-1" type="submit">@((MarkupString)Convert.ToString(Localizer["Confirm"]))</button>
</div>
@if (ShowPrivacyLink)
<div class="container-fluid">
<div class="row">
<div class="col-9 col-xl-10">
@if (PageState.RenderMode == RenderModes.Static)
{
<div class="col-md-6 col-xs-6 text-center">
<a class="btn btn-secondary mb-1 ms-2" href="/privacy" target="_blank">@((MarkupString)Convert.ToString(Localizer["Privacy"]))</a>
</div>
<input type="checkbox" name="cantrack" checked="@_canTrack" value="1" class="form-check-input me-2" />
}
else
{
<input type="checkbox" name="cantrack" @bind="@_canTrack" value="1" class="form-check-input me-2" />
}
@((MarkupString)Convert.ToString(Localizer["ConsentNotice"]))
</div>
<div class="col-3 col-xl-2">
<div class="row">
<div class="col-md-6 col-xs-6 text-center">
<button class="btn btn-primary mb-1 px-0 w-100" type="submit">@((MarkupString)Convert.ToString(Localizer["Confirm"]))</button>
</div>
@if (ShowPrivacyLink)
{
<div class="col-md-6 col-xs-6 text-center">
<a class="btn btn-secondary mb-1 px-0 w-100" href="/privacy" target="_blank">@((MarkupString)Convert.ToString(Localizer["Privacy"]))</a>
</div>
}
</div>
</div>
</div>
</div>
@ -43,7 +45,7 @@
</form>
<form method="post" @formname="CookieConsentToggleForm" @onsubmit="async () => await ToggleBanner()" data-enhance>
<input type="hidden" name="@Constants.RequestVerificationToken" value="@SiteState.AntiForgeryToken" />
@if(_showBanner)
@if (_showBanner)
{
<input type="hidden" name="showbanner" value="false" />
<button type="submit" class="btn btn-light text-dark btn-sm position-absolute btn-hide">
@ -77,8 +79,9 @@
public bool ShowPrivacyLink { get; set; } = true;
[SupplyParameterFromForm(FormName = "CookieConsentToggleForm")]
public string ShowBanner {
get => "";
public string ShowBanner
{
get => "";
set
{
_showBanner = bool.Parse(value);
@ -109,7 +112,7 @@
_canTrack = await CookieConsentService.CanTrackAsync(_optout);
}
if(!_togglePostback)
if (!_togglePostback)
{
_showBanner = !_actioned;
}
@ -118,7 +121,7 @@
private async Task AcceptPolicy()
{
var cookieString = string.Empty;
if(_optout)
if (_optout)
{
cookieString = _canTrack ? await CookieConsentService.WithdrawConsentCookieAsync() : await CookieConsentService.CreateConsentCookieAsync();
}
@ -156,7 +159,7 @@
}
}
if(PageState.RenderMode == RenderModes.Interactive)
if (PageState.RenderMode == RenderModes.Interactive)
{
_showBanner = !_showBanner;
StateHasChanged();

2
Oqtane.Client/Themes/Controls/Theme/Search.razor
View File

@ -56,7 +56,7 @@
private void PerformSearch()
{
if (_searchResultsPage != null)
if (_searchResultsPage != null && !string.IsNullOrEmpty(_keywords))
{
var url = NavigateUrl(_searchResultsPage.Path, $"q={WebUtility.UrlEncode(_keywords)}");
NavigationManager.NavigateTo(url);

17
Oqtane.Server/wwwroot/Themes/Oqtane.Themes.BlazorTheme/Theme.css
View File

@ -30,7 +30,6 @@
.breadcrumbs {
background-color: #e6e6e6;
border-bottom: 1px solid #d6d5d5;
}
.top-row {
@ -120,12 +119,7 @@
.app-logo .navbar-brand {
color: white;
}
@media (max-width: 767.98px) {
.main .top-row {
display: none;
}
@media (max-width: 991.98px) {
.app-search {
border-radius: 6px;
}
@ -141,7 +135,7 @@
.app-search:active, .app-search:hover {
display: block;
position: fixed;
position: absolute;
color: #fff;
top: 0;
min-height: 60px;
@ -149,6 +143,7 @@
left: 0;
z-index: 999;
border-radius: 0;
background-color: #e6e6e6;
}
.app-search:active .app-form-inline, .app-search:hover .app-form-inline {
@ -169,6 +164,11 @@
padding-bottom: 6px;
}
}
@media (max-width: 767.98px) {
.main .top-row {
display: none;
}
}
@media (min-width: 768px) {
app {
@ -257,6 +257,7 @@
width: 100%;
left: 0;
z-index: 4;
border-bottom: 1px solid #d6d5d5;
}
.sidebar {

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;
}
}