Skip to content

Commit 52bf800

Browse files
committed
Added aside for progress logo, changed logo images to provided .svg-s, fixed margins and paddings in header, removed logo from introduction page, fixed wrong hex for material main brush, made side nav at least 300px wide for better mobile visualization.
1 parent fcec4d5 commit 52bf800

File tree

5 files changed

+187
-29
lines changed

5 files changed

+187
-29
lines changed

_assets/stylesheets/styles.css

Lines changed: 83 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -26,11 +26,72 @@ a img {
2626
border-width: 0;
2727
}
2828

29+
.TK-Hat {
30+
padding-left: 15px;
31+
padding-right: 15px;
32+
border-bottom: 1px solid #eff0f1;
33+
color: #4d4f52;
34+
background: #ffffff;
35+
position: fixed;
36+
top: 0;
37+
left: 0;
38+
right: 0;
39+
z-index: 42042;
40+
}
41+
.TK-Hat::after {
42+
content: "";
43+
clear: both;
44+
display: block;
45+
}
46+
.TK-Hat *,
47+
.TK-Hat:after,
48+
.TK-Hat:before {
49+
box-sizing: border-box;
50+
}
51+
.TK-Hat-Brand {
52+
float: left;
53+
width: 150px;
54+
margin: 0;
55+
}
56+
.TK-PRGS-Logo {
57+
display: block;
58+
outline: none!important;
59+
text-decoration: none!important;
60+
transition: color .1s linear, background .1s linear, opacity .1s linear;
61+
}
62+
.TK-PRGS-Logo:focus,
63+
.TK-PRGS-Logo:hover {
64+
opacity: .75;
65+
}
66+
.TK-PRGS-Logo svg {
67+
position: relative;
68+
display: inline-block;
69+
vertical-align: middle;
70+
}
71+
@media only screen and (max-width: 1100px) and (min-width: 880px) {
72+
.TK-Hat-Brand {
73+
width: 120px;
74+
min-width: 120px;
75+
}
76+
}
77+
@media only screen and (max-width: 880px) {
78+
.TK-Hat-Brand {
79+
width: 100px;
80+
min-width: 100px;
81+
}
82+
}
83+
2984
/* Header */
3085

3186
#page-header {
3287
background-color: #2a2d33;
3388
font-size: 12px;
89+
padding: 20px 0 20px 15px;
90+
width: 100%;
91+
box-sizing: border-box;
92+
position: fixed;
93+
top: 41px;
94+
z-index: 100;
3495
}
3596

3697
#page-header:after {
@@ -47,16 +108,18 @@ a img {
47108
#logo-bar-sl {
48109
font-size: 14px;
49110
float: left;
50-
margin-left: 1.833em;
51-
margin-top: 1em;
52-
margin-bottom: 1.6em;
53111
width: 404px;
54112
}
55113

56114
#logo-bar-sl {
57115
width: 334px;
58116
}
59117

118+
#logo-bar a,
119+
#logo-bar-sl a{
120+
display: inline-block;
121+
}
122+
60123
#logo-bar a img,
61124
#logo-bar-sl a img {
62125
height: auto;
@@ -68,6 +131,7 @@ a img {
68131
}
69132

70133
.nav-buttons {
134+
margin-top: 2px;
71135
float: right;
72136
}
73137

@@ -81,9 +145,9 @@ a img {
81145
display: inline-block;
82146
font-size: 15px;
83147
font-weight: bold;
84-
line-height: 0.933em;
85-
margin: 1.467em 0.267em;
86-
padding: 0.667em 2em;
148+
line-height: 1.33334;
149+
margin: 0 4px;
150+
padding: 6px 30px;
87151
position: relative;
88152
text-align: center;
89153
transition-duration: 0.2s;
@@ -148,8 +212,9 @@ a img {
148212
background: transparent;
149213
display: none;
150214
position: relative;
151-
margin-left: 1.833em;
152215
cursor: pointer;
216+
vertical-align: top;
217+
margin: 8px 0 0 0;
153218
}
154219

155220
#page-search {
@@ -456,6 +521,7 @@ a img {
456521
overflow: hidden;
457522
margin: 0;
458523
clear: both;
524+
top: 120px;
459525
}
460526

461527
#page-inner-content:after {
@@ -674,8 +740,10 @@ a.footer-links:hover {
674740
}
675741

676742
.logo {
677-
font-size: 14px;
678-
margin-left: 29px;
743+
font-size: 14px;
744+
height: 30px;
745+
display: inline-block;
746+
vertical-align: top;
679747
}
680748

681749
.logo em {
@@ -798,6 +866,10 @@ header, nav, section, article, aside, footer {
798866
}
799867

800868
@media (max-width: 1200px) {
869+
#page-edit-link{
870+
display: none;
871+
}
872+
801873
#logo-bar,
802874
#logo-bar-sl{
803875
float: none;
@@ -806,7 +878,7 @@ header, nav, section, article, aside, footer {
806878
}
807879

808880
#page-nav {
809-
width: 30%;
881+
min-width: 300px;
810882
}
811883

812884
#markdown-toc,
@@ -1409,29 +1481,17 @@ header, nav, section, article, aside, footer {
14091481

14101482
@media (max-width: 520px) {
14111483
header {
1412-
height: 85px;
1484+
height: 80px;
14131485
}
14141486

14151487
#logo-bar,
14161488
#logo-bar-sl {
14171489
position: absolute;
14181490
}
14191491

1420-
#logo-bar a img {
1421-
width: 404px;
1422-
}
1423-
1424-
#logo-bar-sl a img{
1425-
width: 334px;
1426-
}
1427-
14281492
#page-header .show-search {
14291493
display:none;
14301494
}
1431-
1432-
.toggle-nav {
1433-
top: 31px;
1434-
}
14351495
}
14361496

14371497

_assets/stylesheets/theme.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@
7575
#page-inner-content {
7676
bottom: 44px;
7777
position: absolute;
78-
top: 80px;
78+
top: 120px;
7979
width: 100%;
8080
overflow: hidden !important;
8181
}

_includes/header.html

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,19 @@
1+
<aside class="TK-Hat">
2+
<figure class="TK-Hat-Brand">
3+
<a href="https://www.progress.com" class="TK-PRGS-Logo">
4+
<svg xmlns="http://www.w3.org/2000/svg" width="94" height="40" viewBox="0 0 512 120">
5+
<path fill="#5ce500" d="M95.52 29.33v51a3.93 3.93 0 0 1-1.78 3.08l-1.67 1-12.72 7.35-8.59 5-1.78 1V42.6L21.23 15 43.91 1.93 46 .74a3.94 3.94 0 0 1 3.56 0L81 18.9l14.51 8.38v2.05zM58.36 48.72l-9.79-5.66-22.91-13.23a4 4 0 0 0-3.56 0L1.77 41.57 0 42.6l34.49 19.91v39.83l20.3-11.73 1.79-1a3.94 3.94 0 0 0 1.78-3.08V48.72zM0 82.43l23.86 13.78V68.63z"></path>
6+
<path fill="#4b4e52" d="M148.09 27.28h-26v70.48h11.55V70.1h14.57c15.77 0 24.45-7.7 24.45-21.69 0-6.35-2.4-21.12-24.55-21.12m12.78 21.31c0 7.95-4.12 11.19-14.24 11.19h-13v-22.1h14.57c8.56 0 12.71 3.57 12.71 10.91M207 46.41l.87.42-2 10.42-1.35-.42a11.32 11.32 0 0 0-3.34-.51c-10.79 0-11.67 8.59-11.67 19v22.44h-10.64V46h10v6.24c2.73-4.2 6-6.37 10.37-6.9a14.55 14.55 0 0 1 7.76 1.07M233.29 45c-8.42 0-15.16 3.2-19.5 9.27-4.56 6.37-5.23 13.85-5.23 17.74 0 16.36 9.7 26.92 24.73 26.92 18.26 0 24.73-14.71 24.73-27.3 0-7.25-2.15-13.82-6-18.51-4.41-5.31-10.87-8.12-18.7-8.12m0 44.38c-8.37 0-13.57-6.66-13.57-17.37s5.2-17.55 13.57-17.55S247 61.23 247 71.78c0 10.83-5.24 17.56-13.66 17.56m114.55-42.93l.87.42-2 10.42-1.35-.42a11.26 11.26 0 0 0-3.33-.51c-10.78 0-11.66 8.59-11.66 19v22.44h-10.66V46h10v6.24c2.73-4.2 6-6.37 10.37-6.9a14.54 14.54 0 0 1 7.73 1.06m38.4 34.76l-.2.57c-2.23 6.36-7.57 7.7-11.65 7.7-8.09 0-13.3-5.37-13.81-14.09h36.59l.13-1a31.26 31.26 0 0 0 .12-4.12v-.93C396.93 54.78 387.48 45 374 45c-7.9 0-14.37 3.1-18.73 9a30.85 30.85 0 0 0-5.54 18c0 16 9.95 26.74 24.74 26.74 11.45 0 19.33-5.82 22.2-16.38l.33-1.2h-10.7zM361 66.05c.9-7.17 5.81-11.73 12.79-11.73 5.33 0 11.64 3.1 12.52 11.73H361zm-60.7-15.71c-3.45-3.58-8.06-5.39-13.76-5.39-15.69 0-22.83 13.81-22.83 26.63 0 13.16 7.06 26.44 22.83 26.44a18.33 18.33 0 0 0 13.35-5.42c0 2.28-.1 4.45-.16 5.38-.58 8.54-4.68 12.51-12.91 12.51-4.47 0-9.61-1.59-10.6-6l-.22-1h-10.54l.17 1.41c1.1 9.12 9.11 14.79 20.9 14.79 10.34 0 17.7-3.9 21.28-11.26 1.73-3.55 2.6-8.72 2.6-15.37V46h-10.13v4.34zm-13.11 38.15c-3.74 0-12.43-1.69-12.43-17.37 0-10.3 4.87-16.7 12.71-16.7 6.06 0 12.52 4.39 12.52 16.7 0 10.87-4.79 17.37-12.81 17.37m159.67-6.31c0 8.23-6.83 16.53-22.09 16.53-13.5 0-21.53-5.85-22.61-16.45l-.15-1.1h10.52l.21.84c1.29 6.38 7.37 7.72 12.24 7.72 5.34 0 11-1.72 11-6.54 0-2.44-1.59-4.18-4.73-5.16-1.86-.55-4.15-1.2-6.56-1.87-4.16-1.16-8.47-2.38-11.12-3.29-6.56-2.35-10.33-6.93-10.33-12.56 0-10.43 10.16-15.11 20.22-15.11 13.46 0 20.42 5.07 21.3 15.49l.09 1.07H434.5l-.14-.82c-1-6-7-6.9-10.48-6.9-3 0-10 .53-10 5.5 0 2.25 1.93 3.91 5.89 5.06 1.18.33 2.94.78 5 1.31 4.22 1.09 9.48 2.46 12.13 3.37 6.59 2.32 9.93 6.67 9.93 13m49.39 0c0 8.23-6.83 16.53-22.09 16.53-13.5 0-21.53-5.85-22.61-16.45l-.11-1.09H462l.12.74c1.29 6.38 7.37 7.72 12.24 7.72 5.34 0 11-1.72 11-6.54 0-2.44-1.59-4.18-4.72-5.16-1.86-.55-4.15-1.2-6.57-1.87-4.16-1.16-8.46-2.38-11.11-3.29-6.57-2.35-10.33-6.93-10.33-12.56 0-10.43 10.16-15.11 20.22-15.11 13.46 0 20.42 5.07 21.29 15.49l.09 1.07H483.9l-.14-.82c-1-6-7-6.9-10.48-6.9-3 0-9.95.53-9.95 5.5 0 2.25 1.93 3.91 5.89 5.06 1.18.33 2.94.78 5 1.31 4.22 1.09 9.48 2.46 12.13 3.37 6.58 2.32 9.93 6.67 9.93 13m8.43-30.78a7.37 7.37 0 1 1 7.29-7.37 7.23 7.23 0 0 1-7.29 7.37m0-13.49a6.12 6.12 0 1 0 6 6.12 5.91 5.91 0 0 0-6-6.12m-.85 7.49v2.46h-2.17v-7.74h3.62a2.58 2.58 0 0 1 2.86 2.7 2.26 2.26 0 0 1-1.49 2.34l1.77 2.7H506l-1.49-2.46h-.68zm1.21-3.49h-1.21v1.73h1.21a.86.86 0 0 0 1-.85.88.88 0 0 0-1-.89"></path>
7+
</svg>
8+
</a>
9+
</figure>
10+
</aside>
11+
12+
<header id="page-header">
13+
<span class="toggle-nav"><span></span></span>
114
<div id="logo-bar">
215
<a href="/devtools/document-processing/introduction" title="Document Processing">
3-
<image src="/devtools/document-processing/images/telerik_logo_dp.png" alt="Document Processing" />
16+
<image src="/devtools/document-processing/images/document-processing-logo.svg" alt="Document Processing" />
417
</a>
518
</div>
619
<div id="page-search">
@@ -17,6 +30,7 @@
1730
<a href="http://www.telerik.com/purchase.aspx" title="Pricing" target="_blank" class="btn pricing-btn">Pricing</a>
1831
<a href="http://www.telerik.com/download" title="Try now" target="_blank" class="btn btn-primary">Try now</a>
1932
</div>
33+
</header>
2034

2135

2236

_layouts/index.html

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,10 +42,7 @@
4242
</noscript>
4343
<script>(function(w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = '//www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', '{{site.google_tag_manager}}');</script>
4444
<!-- End Google Tag Manager -->
45-
<header id="page-header">
46-
<span class="toggle-nav"><span></span></span>
47-
{% include header.html %}
48-
</header>
45+
{% include header.html %}
4946

5047
{{ content }}
5148
</body>
Lines changed: 87 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)