Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fixes #22086: Transform tabs of the directives into real tabs #4572

Merged
merged 1 commit into from
Nov 16, 2022
Merged

Fixes #22086: Transform tabs of the directives into real tabs #4572

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 3 additions & 4 deletions ...der/rudder-web/src/main/scala/com/normation/rudder/web/components/DirectiveEditForm.scala
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@ class DirectiveEditForm(
}
} &
"#techniqueID *" #> technique.id.name.value &
"#showTechniqueDescription *" #> <button type="button" class="btn btn-technical-details btn-sm btn-primary" onclick="$('#techniqueDescriptionPanel').toggle(400);$(this).toggleClass('opened');">Technique description</button> &
"#showTechniqueDescription *" #> <button type="button" class="btn btn-technical-details btn-primary" onclick="$('#techniqueDescriptionPanel').toggle(400);$(this).toggleClass('opened');">Technique description</button> &
"#techniqueDescription *" #> technique.description &
"#isDisabled" #> {
if (!activeTechnique.isEnabled || !directive.isEnabled) {
Expand Down Expand Up @@ -334,7 +334,7 @@ class DirectiveEditForm(
"#directiveRulesTab *" #> ruleDisplayer &
"#save" #> { SHtml.ajaxSubmit("Save", onSubmitSave _) % ("id" -> htmlId_save) % ("class" -> "btn btn-success") } &
"#notifications" #> updateAndDisplayNotifications() &
"#showTechnical *" #> <button type="button" class="btn btn-technical-details btn-sm btn-primary" onclick="$('#technicalDetails').toggle(400);$(this).toggleClass('opened');">Technical details</button> &
"#showTechnical *" #> <button type="button" class="btn btn-technical-details btn-primary" onclick="$('#technicalDetails').toggle(400);$(this).toggleClass('opened');">Technical details</button> &
"#isSingle *" #> showIsSingle() &
displayDeprecationWarning
)(crForm) ++
Expand All @@ -350,8 +350,7 @@ class DirectiveEditForm(
|checkMigrationButton("${currentVersion}","${versionSelectId}");
|$$('#${directiveVersion.uniqueFieldId.getOrElse("id_not_found")}').change( function () {
| checkMigrationButton("${currentVersion}","${versionSelectId}")
|} );
|$$(document).ready(function(){$$('.main-details').bsScrollSpy({ target: '#navbar-scrollspy' })});""".stripMargin)
|} );""".stripMargin)
)
)
}
Expand Down
2 changes: 1 addition & 1 deletion .../rudder/rudder-web/src/main/scala/com/normation/rudder/web/components/RuleDisplayer.scala
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,7 @@ class RuleDisplayer(
<div class="row">
<div class="col-xs-12">
<div id="showFiltersRules" ng-controller="filterTagCtrl" ng-init="initRule()" class="filters" ng-cloak="">
<div class="filters-container">
<div>
<div class="filterTag">
<div class="input-group search-addon">
<label for="searchStr" class="input-group-addon search-addon"><span class="ion ion-search"></span></label>
Expand Down
8 changes: 2 additions & 6 deletions webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder-directives.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,10 +108,10 @@
min-height: calc(100vh - 200px);
}
#directiveRulesTab .box {
border: 1px solid #ddd;
border: 1px solid #d6deef;
}
#directiveRulesTab .box-header.with-border {
background-color: #f4f4f4;
background-color: #f8f9fc;
}
#directiveRulesTab .rudder-form input[type=checkbox] + .label-radio + .check-icon{
right: 7px;
Expand Down Expand Up @@ -297,10 +297,6 @@
#notifications.main-alert + #isDisabled{
display: none !important;
}
.rudder-template .template-sidebar + .template-main .main-details,
.rudder-template .template-sidebar + .template-main .main-details .checkbox-group input + span > span{
font-size : 12px;
}
.rudder-template .template-sidebar + .template-main .main-details .input-group-sm .form-control,
.rudder-template .template-sidebar + .template-main .main-details .checkbox-group input + span > span{
min-height: initial !important;
Expand Down
6 changes: 3 additions & 3 deletions webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder-menu.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2871,10 +2871,10 @@ h3.box-title {
margin-bottom:6px;
}
.box-header>.fa, .box-header>.glyphicon, .box-header>.ion, .box-header .box-title{
color:#555;
color:#041922;
}
.box .box-title .fa{
color: #999;
color: #748195;
margin-right:10px;
}
.box-header.with-border.spacing{
Expand Down Expand Up @@ -2928,7 +2928,7 @@ h3.box-title {
}
.toggleTabFilter.updateTable{
padding: 5px 10px !important;
border-bottom:none !important;
background-color: #fff !important;
}
.box-tools > .btn > .fa,.box-tools > .btn > .glyphicon,.box-tools > .btn > .ion{
margin-left: 6px;
Expand Down
1 change: 0 additions & 1 deletion webapp/sources/rudder/rudder-web/src/main/webapp/style/rudder/rudder.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -296,7 +296,6 @@ fieldset.groupFieldset {
.foldableSection div.section-title{
font-size: 20px;
border-bottom: 2px solid #d6deef;
color: #0419228a;
}
.foldableSection.foldedSection div.section-title{
border-bottom-color: transparent;
Expand Down
172 changes: 84 additions & 88 deletions ...er/rudder-web/src/main/webapp/templates-hidden/components/ComponentDirectiveEditForm.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,22 +51,16 @@ <h1>
<div class="header-description" id="shortDescription">
</div>
</div>
<div class="main-navbar" id="navbar-scrollspy">
<ul class="ui-tabs-nav nav nav-tabs">
<li class="ui-tabs-tab" role="presentation">
<a href="#directiveInfo" onclick="navScroll(event, '#directiveInfo', '.main-details')">
Information
</a>
<div class="main-navbar">
<ul class="ui-tabs-nav" role="tablist">
<li role="presentation" class="ui-tabs-tab ui-tab active">
<a href="#directiveInfo" aria-controls="directiveInfo" role="tab" data-toggle="tab">Information</a>
</li>
<li class="ui-tabs-tab" role="presentation">
<a href="#parametersTitle" onclick="navScroll(event, '#parametersTitle', '.main-details')">
Parameters
</a>
<li role="presentation" class="ui-tabs-tab ui-tab">
<a href="#parametersTab" aria-controls="parametersTab" role="tab" data-toggle="tab">Parameters</a>
</li>
<li class="ui-tabs-tab" role="presentation">
<a href="#directiveRulesTabTitle" onclick="navScroll(event, '#directiveRulesTabTitle', '.main-details')">
Target rules
</a>
<li role="presentation" class="ui-tabs-tab ui-tab">
<a href="#rulesTab" aria-controls="rulesTab" role="tab" data-toggle="tab">Target rules</a>
</li>
</ul>
</div>
Expand Down Expand Up @@ -94,91 +88,93 @@ <h4>Pending change requests</h4>
<ul id="changeRequestList"></ul>
</div>
</lift:authz>

<div id="directiveInfo">
<div id="nameField">
Here comes the name field
</div>
<div id="tagField">
Here comes the tag field
</div>
<div id="shortDescriptionField">
Here comes the shortDescription field
</div>
<div id="longDescriptionFieldMarkdownContainer">
<label class="wbBaseFieldLabel"><span class="text-fit">Description</span>
<i class="fa fa-pencil text-primary cursorPointer half-opacity edit-description-icon" onmouseenter="toggleOpacity(this)" title="Edit description" onmouseout="toggleOpacity(this)" onclick="toggleMarkdownEditor('longDescriptionField')"></i>
</label>
<div class="markdown">
<div id="longDescriptionFieldMarkdown"></div>
<p id="longDescriptionFieldMarkdownEmpty" class="nodisplay half-opacity">No description defined, click on <i class="fa fa-pencil text-primary cursorPointer half-opacity" onmouseenter="toggleOpacity(this)" onmouseout="toggleOpacity(this)" onclick="toggleMarkdownEditor('longDescriptionField')"></i> to edit </p>
<div class="tab-content">
<div id="directiveInfo" class="tab-pane active">
<div id="nameField">
Here comes the name field
</div>
</div>
<div id="longDescriptionFieldContainer" class="nodisplay">
<div id="longDescriptionField">
Here comes the longDescription field
<div id="tagField">
Here comes the tag field
</div>
<div id="longDescriptionFieldMarkdownPreviewContainer" class="wbBaseField col-xs-6 row">
<label class="col-xs-12 row wbBaseFieldLabel"><span class="text-fit">Preview</span></label>
<div id="longDescriptionFieldPreviewMarkdown" class=" col-xs-12 row markdown"></div>
<div id="shortDescriptionField">
Here comes the shortDescription field
</div>
<div id="longDescriptionFieldMarkdownContainer">
<label class="wbBaseFieldLabel"><span class="text-fit">Description</span>
<i class="fa fa-pencil text-primary cursorPointer half-opacity edit-description-icon" onmouseenter="toggleOpacity(this)" title="Edit description" onmouseout="toggleOpacity(this)" onclick="toggleMarkdownEditor('longDescriptionField')"></i>
</label>
<div class="markdown">
<div id="longDescriptionFieldMarkdown"></div>
<p id="longDescriptionFieldMarkdownEmpty" class="nodisplay half-opacity">No description defined, click on <i class="fa fa-pencil text-primary cursorPointer half-opacity" onmouseenter="toggleOpacity(this)" onmouseout="toggleOpacity(this)" onclick="toggleMarkdownEditor('longDescriptionField')"></i> to edit </p>
</div>
</div>
<div id="longDescriptionFieldContainer" class="nodisplay">
<div id="longDescriptionField">
Here comes the longDescription field
</div>
<div id="longDescriptionFieldMarkdownPreviewContainer" class="wbBaseField col-xs-6 row">
<label class="col-xs-12 row wbBaseFieldLabel"><span class="text-fit">Preview</span></label>
<div id="longDescriptionFieldPreviewMarkdown" class=" col-xs-12 row markdown"></div>
</div>
</div>
</div>

<div class="directiveTechnicalInfo" id="showTechniqueDescription"></div>
<div style="display:none" id="techniqueDescriptionPanel" class="markdown">
<div id="techniqueDescription"></div>
</div>
<div class="directiveTechnicalInfo" id="showTechniqueDescription"></div>
<div style="display:none" id="techniqueDescriptionPanel" class="markdown">
<div id="techniqueDescription"></div>
</div>

<div id="priority">
Here come the priority field
</div>
<div class="wbBaseField form-group">
<div id="policyModesLabel">
Here come the policy mode label
<div id="priority">
Here come the priority field
</div>
<div class="wbBaseField form-group">
<div id="policyModesLabel">
Here come the policy mode label
</div>
<div id="policyModes">
Here come the policy mode field
</div>
</div>
<div id="policyModes">
Here come the policy mode field
<div id="version">
Here come the version field
</div>
<div class="directiveTechnicalInfo" id="showTechnical"></div>
<div id="technicalDetails" style="display:none" class="well">

<table>
<tr>
<td><label>Directive ID:</label></td>
<td id="directiveID">
Directive ID:
</td>
</tr>
<tr>
<td><label>Technique ID:</label></td>
<td id="techniqueID">
Technique ID
</td>
</tr>
<tr>
<td><label>Technique name:</label></td>
<td id="techniqueName">
Technique name
</td>
</tr>
<tr>
<td><label>Technique unicity:</label></td>
<td id="isSingle">
Technique unicity
</td>
</tr>
</table>
</div>
</div>
<div id="version">
Here come the version field
<div id="parametersTab" class="tab-pane">
<div id="parameters">Here goes the list of parameters</div>
</div>
<div class="directiveTechnicalInfo" id="showTechnical"></div>
<div id="technicalDetails" style="display:none" class="well">

<table>
<tr>
<td><label>Directive ID:</label></td>
<td id="directiveID">
Directive ID:
</td>
</tr>
<tr>
<td><label>Technique ID:</label></td>
<td id="techniqueID">
Technique ID
</td>
</tr>
<tr>
<td><label>Technique name:</label></td>
<td id="techniqueName">
Technique name
</td>
</tr>
<tr>
<td><label>Technique unicity:</label></td>
<td id="isSingle">
Technique unicity
</td>
</tr>
</table>
<div id="rulesTab" class="tab-pane">
<div id="directiveRulesTab"></div>
</div>
</div>

<h2 id="parametersTitle" class="title-tab">Parameters</h2>
<div id="parameters">Here goes the list of parameters</div>
<h2 id="directiveRulesTabTitle" class="title-tab">Target rules</h2>
<div id="directiveRulesTab"></div>
</div>
</div>
<lift:ignore>
Expand Down