Add get-url link to tag headers

This commit is contained in:
Roman Hotsiy 2015-11-29 19:24:46 +02:00
parent d1fa83f018
commit d30a2c5529
5 changed files with 28 additions and 27 deletions

View File

@ -0,0 +1,23 @@
.share-link {
cursor: pointer;
margin-left: -15px;
padding: 0;
line-height: 1;
width: 15px;
display: inline-block;
}
.share-link:before {
content: "";
width: 15px;
height: 15px;
background-size: contain;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMCIgeT0iMCIgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjMDEwMTAxIiBkPSJNNDU5LjcgMjMzLjRsLTkwLjUgOTAuNWMtNTAgNTAtMTMxIDUwLTE4MSAwIC03LjktNy44LTE0LTE2LjctMTkuNC0yNS44bDQyLjEtNDIuMWMyLTIgNC41LTMuMiA2LjgtNC41IDIuOSA5LjkgOCAxOS4zIDE1LjggMjcuMiAyNSAyNSA2NS42IDI0LjkgOTAuNSAwbDkwLjUtOTAuNWMyNS0yNSAyNS02NS42IDAtOTAuNSAtMjQuOS0yNS02NS41LTI1LTkwLjUgMGwtMzIuMiAzMi4yYy0yNi4xLTEwLjItNTQuMi0xMi45LTgxLjYtOC45bDY4LjYtNjguNmM1MC01MCAxMzEtNTAgMTgxIDBDNTA5LjYgMTAyLjMgNTA5LjYgMTgzLjQgNDU5LjcgMjMzLjR6TTIyMC4zIDM4Mi4ybC0zMi4yIDMyLjJjLTI1IDI0LjktNjUuNiAyNC45LTkwLjUgMCAtMjUtMjUtMjUtNjUuNiAwLTkwLjVsOTAuNS05MC41YzI1LTI1IDY1LjUtMjUgOTAuNSAwIDcuOCA3LjggMTIuOSAxNy4yIDE1LjggMjcuMSAyLjQtMS40IDQuOC0yLjUgNi44LTQuNWw0Mi4xLTQyYy01LjQtOS4yLTExLjYtMTgtMTkuNC0yNS44IC01MC01MC0xMzEtNTAtMTgxIDBsLTkwLjUgOTAuNWMtNTAgNTAtNTAgMTMxIDAgMTgxIDUwIDUwIDEzMSA1MCAxODEgMGw2OC42LTY4LjZDMjc0LjYgMzk1LjEgMjQ2LjQgMzkyLjMgMjIwLjMgMzgyLjJ6Ii8+PC9zdmc+Cg==');
opacity: 0.5;
visibility: hidden;
display: inline-block;
vertical-align: middle;
}
.sharable-header:hover .share-link:before, .share-link:hover:before {
visibility: visible;
}

View File

@ -1,7 +1,7 @@
<div class="method">
<div class="method-content">
<h2 class="method-header">
<a class="method-link" href="#{{tag}}{{pointer}}"></a>{{data.methodInfo.summary}}
<h2 class="method-header sharable-header">
<a class="share-link" href="#{{tag}}{{pointer}}"></a>{{data.methodInfo.summary}}
</h2>
<h3 class="method-endpoint">
<span class="http-method" [ng-class]="data.method">{{data.method}}</span>

View File

@ -1,4 +1,5 @@
@import '../../common/styles/variables';
@import '../../common/styles/share-link';
responses-list, params-list {
display: block;
@ -10,30 +11,6 @@ responses-list, params-list {
color: $method-headers-color;
}
.method-link {
cursor: pointer;
margin-left: -15px;
padding: 0;
line-height: 1;
width: 15px;
display: inline-block;
}
.method-link:before {
content: "";
width: 15px;
height: 15px;
background-size: contain;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMCIgeT0iMCIgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cGF0aCBmaWxsPSIjMDEwMTAxIiBkPSJNNDU5LjcgMjMzLjRsLTkwLjUgOTAuNWMtNTAgNTAtMTMxIDUwLTE4MSAwIC03LjktNy44LTE0LTE2LjctMTkuNC0yNS44bDQyLjEtNDIuMWMyLTIgNC41LTMuMiA2LjgtNC41IDIuOSA5LjkgOCAxOS4zIDE1LjggMjcuMiAyNSAyNSA2NS42IDI0LjkgOTAuNSAwbDkwLjUtOTAuNWMyNS0yNSAyNS02NS42IDAtOTAuNSAtMjQuOS0yNS02NS41LTI1LTkwLjUgMGwtMzIuMiAzMi4yYy0yNi4xLTEwLjItNTQuMi0xMi45LTgxLjYtOC45bDY4LjYtNjguNmM1MC01MCAxMzEtNTAgMTgxIDBDNTA5LjYgMTAyLjMgNTA5LjYgMTgzLjQgNDU5LjcgMjMzLjR6TTIyMC4zIDM4Mi4ybC0zMi4yIDMyLjJjLTI1IDI0LjktNjUuNiAyNC45LTkwLjUgMCAtMjUtMjUtMjUtNjUuNiAwLTkwLjVsOTAuNS05MC41YzI1LTI1IDY1LjUtMjUgOTAuNSAwIDcuOCA3LjggMTIuOSAxNy4yIDE1LjggMjcuMSAyLjQtMS40IDQuOC0yLjUgNi44LTQuNWw0Mi4xLTQyYy01LjQtOS4yLTExLjYtMTgtMTkuNC0yNS44IC01MC01MC0xMzEtNTAtMTgxIDBsLTkwLjUgOTAuNWMtNTAgNTAtNTAgMTMxIDAgMTgxIDUwIDUwIDEzMSA1MCAxODEgMGw2OC42LTY4LjZDMjc0LjYgMzk1LjEgMjQ2LjQgMzkyLjMgMjIwLjMgMzgyLjJ6Ii8+PC9zdmc+Cg==');
opacity: 0.5;
visibility: hidden;
display: inline-block;
vertical-align: middle;
}
.method-header:hover .method-link:before, .method-link:hover:before {
visibility: visible;
}
.method-endpoint {
margin: 0;
font-weight: 200;

View File

@ -1,7 +1,7 @@
<div class="methods">
<div class="tag" *ng-for="#tag of data.tags">
<div class="tag-info" [attr.tag]="tag.name">
<h1> {{tag.name}} </h1>
<h1 class="sharable-header"> <a class="share-link" href="#{{tag.name}}"></a>{{tag.name}} </h1>
<p *ng-if="tag.description" inner-html="{{ tag.description | marked }}"> </p>
</div>
<method *ng-for="#method of tag.methods" [pointer]="method.pointer" [attr.pointer]="method.pointer"

View File

@ -1,4 +1,5 @@
@import '../../common/styles/variables';
@import '../../common/styles/share-link';
method {
padding-bottom: 100px;