Skip to content

Commit ab9506a

Browse files
brianbrixbrianbrix
committed
Change importer styles
1 parent 7cd358f commit ab9506a

2 files changed

Lines changed: 109 additions & 558 deletions

File tree

‎amp/src/main/webapp/WEB-INF/jsp/aim/view/dataImporter.jsp‎

Lines changed: 67 additions & 316 deletions
Original file line numberDiff line numberDiff line change
@@ -6,28 +6,74 @@
66
<html:html>
77
<head>
88
<title><digi:trn>Data Importer</digi:trn></title>
9-
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0/css/select2.min.css" rel="stylesheet" />
10-
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
11-
12-
<%
13-
// Prepare fields info as JSON for JavaScript
14-
java.util.Map<String, String> fieldsInfo = (java.util.Map<String, String>) request.getAttribute("fieldsInfo");
15-
String fieldsInfoJson = new com.fasterxml.jackson.databind.ObjectMapper().writeValueAsString(fieldsInfo);
16-
String fieldsInfoJsonEscaped = fieldsInfoJson
17-
.replace("\\", "\\\\")
18-
.replace("'", "\\'")
19-
.replace("\r", "\\r")
20-
.replace("\n", "\\n")
21-
.replace("</", "<\\/");
22-
request.setAttribute("fieldsInfoJsonEscaped", fieldsInfoJsonEscaped);
23-
%>
9+
<!-- Report Generation Styles (no tabs) -->
10+
<link rel="stylesheet" type="text/css" href="/static/aim/view/css/filters/filters2.css">
11+
<link rel="stylesheet" type="text/css" href="/TEMPLATE/ampTemplate/js_2/yui/container/assets/container.css">
12+
<link rel="stylesheet" type="text/css" href="/TEMPLATE/ampTemplate/css/yui/tabview.css"/>
13+
<digi:ref href="css_2/report_html2_view.css" type="text/css" rel="stylesheet"/>
14+
<style>
15+
.paging {
16+
font-size: 11px;
17+
color: #CCCCCC;
18+
margin-top: 10px;
19+
margin-bottom: 10px;
20+
font-family: Arial, Helvetica, sans-serif;
21+
}
2422
25-
<script>
26-
// Store the field translations for JavaScript use
27-
var fieldsInfoMap = JSON.parse('${fieldsInfoJsonEscaped}');
23+
.paging_sel {
24+
color: #FFFFFF;
25+
background-color: #FF6000;
26+
padding: 2px 2px 2px 4px;
27+
text-align: center;
28+
}
29+
30+
.l_sm {
31+
font-size: 11px;
32+
color: #376091;
33+
}
34+
35+
.tab_opt {
36+
background-color: #F2F2F2;
37+
}
38+
39+
.tab_opt_box {
40+
border: 1px solid #EBEBEB;
41+
max-height: 100px;
42+
overflow: auto;
43+
}
44+
45+
.tab_opt_box_cont {
46+
padding: 5px;
47+
font-size: 11px;
48+
background-color: #FAFAFA;
49+
}
50+
51+
.tab_opt_cont {
52+
padding: 5px;
53+
font-size: 11px;
54+
color: #CCCCCC;
55+
}
56+
57+
.show_hide_setting {
58+
float: right;
59+
font-size: 11px;
60+
padding: 5px;
61+
width: 200px;
62+
font-family: Arial, Helvetica, sans-serif;
63+
}
64+
65+
<%if ("print".equals(request.getParameter("viewFormat"))) {%>
66+
html {
67+
background: none !important;
68+
}
69+
70+
body {
71+
background: none !important;
72+
}
2873
29-
function initializeSelectControls() {
30-
if (!window.jQuery || !$.fn || !$.fn.select2) {
74+
<%}%>
75+
</style>
76+
<!-- End Report Generation Styles -->
3177
return;
3278
}
3379

@@ -644,302 +690,7 @@
644690
xhr.send(formData);
645691
}
646692
</script>
647-
<style>
648-
:root {
649-
--page-bg: #f4f5f7;
650-
--panel-bg: #ffffff;
651-
--panel-border: #d7dde3;
652-
--text-strong: #22313a;
653-
--text-soft: #667784;
654-
--accent: #40606f;
655-
--accent-deep: #314b57;
656-
--accent-warm: #8a6f56;
657-
--surface-muted: #f0f2f4;
658-
--row-alt: #f8f9fa;
659-
--shadow: 0 4px 12px rgba(25, 39, 52, 0.05);
660-
--radius-lg: 14px;
661-
--radius-md: 10px;
662-
--radius-sm: 6px;
663-
}
664-
665-
html {
666-
scroll-behavior: smooth;
667-
}
668-
669-
body {
670-
margin: 0;
671-
font-family: Arial, Helvetica, sans-serif;
672-
font-size: 12px;
673-
line-height: 1.4;
674-
color: var(--text-strong);
675-
background: var(--page-bg);
676-
}
677-
678-
input,
679-
select,
680-
textarea,
681-
button {
682-
font-family: inherit;
683-
}
684-
685-
.importer-page {
686-
max-width: 1180px;
687-
margin: 0 auto;
688-
padding: 22px 16px 34px;
689-
}
690-
691-
.hero-card,
692-
.panel-card,
693-
.workspace-card,
694-
.upload-stage {
695-
background: var(--panel-bg);
696-
border: 1px solid var(--panel-border);
697-
box-shadow: var(--shadow);
698-
}
699-
700-
.hero-card {
701-
border-radius: 16px;
702-
padding: 20px;
703-
margin-bottom: 14px;
704-
background: var(--panel-bg);
705-
}
706-
707-
.hero-card h1,
708-
.workspace-card h2,
709-
.upload-stage h3 {
710-
margin: 0 0 8px;
711-
font-size: 18px;
712-
font-weight: 700;
713-
letter-spacing: 0;
714-
}
715-
716-
.hero-card p,
717-
.section-copy,
718-
.helper-note {
719-
color: var(--text-soft);
720-
line-height: 1.45;
721-
margin: 0;
722-
font-size: 12px;
723-
}
724-
725-
.panel-grid {
726-
display: grid;
727-
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
728-
gap: 14px;
729-
margin-bottom: 14px;
730-
}
731-
732-
.panel-card,
733-
.workspace-card,
734-
.upload-stage {
735-
border-radius: var(--radius-lg);
736-
padding: 16px;
737-
}
738-
739-
.workspace-card {
740-
margin-top: 14px;
741-
}
742-
743-
.section-label {
744-
display: inline-block;
745-
margin-bottom: 6px;
746-
font-size: 11px;
747-
letter-spacing: 0.12em;
748-
text-transform: uppercase;
749-
color: var(--accent);
750-
font-weight: 700;
751-
}
752-
753-
label {
754-
display: inline-block;
755-
margin-bottom: 4px;
756-
font-size: 12px;
757-
font-weight: 700;
758-
color: var(--text-strong);
759-
}
760-
761-
input[type="text"],
762-
input[type="file"],
763-
select {
764-
width: 100%;
765-
max-width: 100%;
766-
box-sizing: border-box;
767-
padding: 8px 10px;
768-
border-radius: var(--radius-sm);
769-
border: 1px solid rgba(22, 53, 67, 0.18);
770-
background: #fff;
771-
color: var(--text-strong);
772-
font-size: 12px;
773-
}
774-
775-
input[type="file"] {
776-
padding: 7px 9px;
777-
background: var(--surface-muted);
778-
}
779-
780-
input[type="button"],
781-
button {
782-
border: 1px solid #506673;
783-
border-radius: 999px;
784-
padding: 8px 14px;
785-
font-weight: 700;
786-
cursor: pointer;
787-
color: #fff;
788-
background: var(--accent);
789-
font-size: 12px;
790-
box-shadow: none;
791-
transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
792-
}
793-
794-
input[type="button"]:hover,
795-
button:hover {
796-
background: var(--accent-deep);
797-
border-color: var(--accent-deep);
798-
}
799-
800-
.remove-row {
801-
background: #6f5a5a;
802-
border-color: #6f5a5a;
803-
}
804-
805-
.inline-field,
806-
.toggle-grid,
807-
.sheet-choice-card {
808-
margin-top: 12px;
809-
}
810-
811-
.toggle-grid {
812-
display: grid;
813-
gap: 8px;
814-
margin-top: 14px;
815-
padding: 12px;
816-
border-radius: var(--radius-md);
817-
background: var(--surface-muted);
818-
border: 1px solid var(--panel-border);
819-
}
820-
821-
.toggle-item {
822-
display: flex;
823-
align-items: center;
824-
gap: 10px;
825-
color: var(--text-strong);
826-
}
827-
828-
.toggle-item input {
829-
width: auto;
830-
margin: 0;
831-
}
832-
833-
.fields-table,
834-
#import-projects-table,
835-
.records-table {
836-
width: 100%;
837-
border-collapse: separate;
838-
border-spacing: 0;
839-
overflow: hidden;
840-
border-radius: 18px;
841-
background: #fff;
842-
border: 1px solid rgba(22, 53, 67, 0.1);
843-
}
844-
845-
table th,
846-
table td {
847-
text-align: left;
848-
padding: 10px 12px;
849-
font-size: 12px;
850-
border-bottom: 1px solid rgba(22, 53, 67, 0.08);
851-
}
852-
853-
table th {
854-
background: #eef1f3;
855-
color: var(--text-strong);
856-
font-size: 11px;
857-
letter-spacing: 0.08em;
858-
text-transform: uppercase;
859-
}
860-
861-
table tr:nth-child(even) {
862-
background: var(--row-alt);
863-
}
864-
865-
table tr:hover {
866-
background: #f2f5f6;
867-
}
868-
869-
.mapping-toolbar {
870-
display: grid;
871-
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
872-
gap: 12px;
873-
align-items: end;
874-
margin-bottom: 12px;
875-
}
876-
877-
.mapping-actions {
878-
display: flex;
879-
gap: 8px;
880-
flex-wrap: wrap;
881-
margin-top: 10px;
882-
}
883-
884-
.upload-stage {
885-
margin-top: 14px;
886-
}
887-
888-
#config-empty-note {
889-
margin-top: 12px;
890-
padding: 10px 12px;
891-
border-radius: var(--radius-md);
892-
background: #f3efe9;
893-
color: #6a5a48;
894-
border: 1px solid #dfd6cb;
895-
}
896-
897-
.select2-container--default .select2-selection--single {
898-
height: 34px;
899-
border-radius: var(--radius-sm);
900-
border: 1px solid rgba(22, 53, 67, 0.18);
901-
padding: 3px 8px;
902-
display: flex;
903-
align-items: center;
904-
background: #fff;
905-
}
906-
907-
.select2-container--default .select2-selection--single .select2-selection__rendered {
908-
color: var(--text-strong);
909-
font-size: 12px;
910-
line-height: 24px;
911-
padding-left: 0;
912-
}
913-
914-
.select2-dropdown {
915-
border-radius: 8px;
916-
border-color: rgba(22, 53, 67, 0.18);
917-
overflow: hidden;
918-
}
919-
920-
.select2-search__field {
921-
border-radius: 6px;
922-
padding: 6px 8px;
923-
}
924-
925-
@media (max-width: 768px) {
926-
.importer-page {
927-
padding: 24px 14px 40px;
928-
}
929-
930-
.hero-card,
931-
.panel-card,
932-
.workspace-card,
933-
.upload-stage {
934-
padding: 18px;
935-
border-radius: 18px;
936-
}
937-
938-
.mapping-toolbar {
939-
grid-template-columns: 1fr;
940-
}
941-
}
942-
</style>
693+
<!-- ...existing code... -->
943694
</head>
944695
<body>
945696
<div class="importer-page">

0 commit comments

Comments
 (0)