Skip to content

Commit 7970c09

Browse files
cryptalitharomanovvamontenegro
authored
PD-5278 (#2799)
* COMMS-1502 draft commit * COMMS-1502 fix library issues: * PD-5278 * PD-5278 * PD-5278 --------- Co-authored-by: andrej romanov <50377758+auumgn@users.noreply.github.com> Co-authored-by: Angel Montenegro <a.montenegro@orcid.org>
1 parent 57a75b3 commit 7970c09

10 files changed

Lines changed: 1041 additions & 2 deletions

File tree

angular.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,11 @@
120120
"ignore": ["fonts/**/*", "**/*.scss"],
121121
"output": "/assets/"
122122
},
123+
{
124+
"glob": "**/*",
125+
"input": "src/assets/print-view/",
126+
"output": "/print-view/"
127+
},
123128
{
124129
"glob": "src/favicon.ico",
125130
"input": "src/",

src/app/layout/layout.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import { MatDividerModule } from '@angular/material/divider'
2323
import { A11yLinkModule } from '../cdk/a11y-link/a11y-link.module'
2424
import { MatTooltipModule } from '@angular/material/tooltip'
2525
import { RecordHeaderComponent } from '../record/components/record-header/record-header.component'
26+
import { MatFormFieldModule } from '@angular/material/form-field'
2627

2728
@NgModule({
2829
imports: [
@@ -34,6 +35,7 @@ import { RecordHeaderComponent } from '../record/components/record-header/record
3435
MatIconModule,
3536
FormsModule,
3637
ReactiveFormsModule,
38+
MatFormFieldModule,
3739
MatRippleModule,
3840
MatIconModule,
3941
BannerModule,

src/app/layout/search/search.component.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,9 @@
1212
(submit)="search(whereToSearchSelected, whatToSearch)"
1313
*ngIf="!hideForm"
1414
>
15+
<mat-label class="orc-ui-font-small-print text-right mr-4 w-30"
16+
>Search the ORCID registry</mat-label
17+
>
1518
<div id="ariaLabelWhere" hidden>Search on</div>
1619
<div class="input-box-new-info">
1720
<input

src/assets/print-view/cv-style.css

Lines changed: 273 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,273 @@
1+
:root {
2+
--page-bg: #f3f3f3;
3+
--paper-bg: #ffffff;
4+
--text: #000000;
5+
--muted: #333333;
6+
--link: #0000ee;
7+
--status-info: #1565c0;
8+
--status-success: #1b5e20;
9+
--status-error: #b71c1c;
10+
}
11+
12+
* {
13+
box-sizing: border-box;
14+
}
15+
16+
body {
17+
margin: 0;
18+
padding: 24px;
19+
background: var(--page-bg);
20+
color: var(--text);
21+
font-family: Arial, sans-serif;
22+
line-height: 1.5;
23+
}
24+
25+
.app-controls {
26+
max-width: 1024px;
27+
margin: 0 auto 12px;
28+
display: flex;
29+
gap: 8px;
30+
align-items: center;
31+
justify-content: flex-end;
32+
flex-wrap: wrap;
33+
}
34+
35+
button {
36+
border: 1px solid #616161;
37+
background: #fafafa;
38+
color: #111111;
39+
font-size: 14px;
40+
padding: 10px 14px;
41+
border-radius: 4px;
42+
cursor: pointer;
43+
}
44+
45+
button:hover {
46+
background: #eeeeee;
47+
}
48+
49+
.status {
50+
max-width: 1024px;
51+
margin: 0 auto 16px;
52+
font-size: 14px;
53+
}
54+
55+
.status:empty {
56+
display: none;
57+
}
58+
59+
.status.info {
60+
color: var(--status-info);
61+
}
62+
63+
.status.success {
64+
color: var(--status-success);
65+
}
66+
67+
.status.error {
68+
color: var(--status-error);
69+
}
70+
71+
.loading,
72+
.error {
73+
max-width: 1024px;
74+
margin: 0 auto;
75+
}
76+
77+
.orcid-prompt {
78+
max-width: 720px;
79+
margin: 0 auto;
80+
background: var(--paper-bg);
81+
padding: 24px;
82+
border: 1px solid #d9d9d9;
83+
border-radius: 8px;
84+
}
85+
86+
.orcid-prompt h2 {
87+
margin: 0 0 8px;
88+
font-size: 24px;
89+
}
90+
91+
.orcid-prompt p {
92+
margin: 0 0 16px;
93+
}
94+
95+
.orcid-prompt-form {
96+
display: flex;
97+
gap: 8px;
98+
align-items: center;
99+
flex-wrap: wrap;
100+
}
101+
102+
.orcid-prompt-form input {
103+
flex: 1 1 320px;
104+
min-width: 280px;
105+
border: 1px solid #bdbdbd;
106+
border-radius: 4px;
107+
font-size: 16px;
108+
padding: 10px 12px;
109+
}
110+
111+
.orcid-prompt-error {
112+
width: 100%;
113+
margin: 8px 0 0;
114+
color: var(--status-error);
115+
}
116+
117+
.cv-container {
118+
max-width: 1024px;
119+
margin: 0 auto;
120+
background: var(--paper-bg);
121+
padding: 32px;
122+
display: flex;
123+
flex-direction: column;
124+
gap: 32px;
125+
}
126+
127+
.cv-container > header h1 {
128+
margin: 0;
129+
font-size: 32px;
130+
font-weight: 700;
131+
line-height: normal;
132+
}
133+
134+
.other-names {
135+
margin: 8px 0 0;
136+
font-size: 16px;
137+
}
138+
139+
.orcid-id {
140+
margin-top: 8px;
141+
display: flex;
142+
align-items: center;
143+
gap: 8px;
144+
}
145+
146+
.orcid-id img {
147+
width: 24px;
148+
height: 24px;
149+
}
150+
151+
a {
152+
color: var(--link);
153+
text-decoration: underline;
154+
overflow-wrap: anywhere;
155+
}
156+
157+
.cv-section h2 {
158+
margin: 0 0 16px;
159+
font-size: 24px;
160+
line-height: 24px;
161+
}
162+
163+
.cv-section h3 {
164+
margin: 0 0 8px;
165+
font-size: 19px;
166+
line-height: 24px;
167+
font-weight: 400;
168+
}
169+
170+
.cv-section p {
171+
margin: 0;
172+
font-size: 16px;
173+
}
174+
175+
.cv-section > div + div {
176+
margin-top: 24px;
177+
}
178+
179+
.activity-group {
180+
display: flex;
181+
flex-direction: column;
182+
gap: 16px;
183+
}
184+
185+
ul {
186+
margin: 0;
187+
padding-left: 24px;
188+
}
189+
190+
li {
191+
margin: 0 0 8px;
192+
}
193+
194+
.activity-item {
195+
display: flex;
196+
flex-direction: column;
197+
gap: 2px;
198+
}
199+
200+
.activity-item .line {
201+
display: block;
202+
font-size: 16px;
203+
line-height: 1.45;
204+
margin: 0;
205+
}
206+
207+
.activity-item .line-label {
208+
font-weight: 400;
209+
}
210+
211+
.activity-item > strong {
212+
font-size: 16px;
213+
line-height: 1.45;
214+
font-weight: 700;
215+
}
216+
217+
.raw-xml {
218+
margin: 12px 0 0;
219+
max-height: 520px;
220+
overflow: auto;
221+
border: 1px solid #cfcfcf;
222+
padding: 12px;
223+
background: #fafafa;
224+
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
225+
font-size: 12px;
226+
line-height: 1.35;
227+
white-space: pre-wrap;
228+
word-break: break-word;
229+
}
230+
231+
details > summary {
232+
cursor: pointer;
233+
color: var(--status-info);
234+
}
235+
236+
@media (max-width: 760px) {
237+
body {
238+
padding: 12px;
239+
}
240+
241+
.cv-container {
242+
padding: 18px;
243+
gap: 24px;
244+
}
245+
}
246+
247+
@media print {
248+
@page {
249+
margin: 0.6in;
250+
}
251+
252+
body {
253+
background: #ffffff;
254+
padding: 0;
255+
}
256+
257+
.no-print {
258+
display: none !important;
259+
}
260+
261+
.cv-container {
262+
max-width: none;
263+
margin: 0;
264+
padding: 0;
265+
gap: 20px;
266+
}
267+
268+
.raw-xml {
269+
max-height: none;
270+
border: 0;
271+
padding: 0;
272+
}
273+
}

0 commit comments

Comments
 (0)