mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-11-12 01:50:52 +01:00
Added icons for GitHub, GitLab and BitBucket integrations
This commit is contained in:
parent
37310eb52d
commit
0111478b65
1
material/assets/stylesheets/application-07c02d33cc.css
Normal file
1
material/assets/stylesheets/application-07c02d33cc.css
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -24,7 +24,7 @@
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Mono:500">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-6e34e5e667.css">
|
||||
<link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-07c02d33cc.css">
|
||||
{% for path in extra_css %}
|
||||
<link rel="stylesheet" href="{{ path }}">
|
||||
{% endfor %}
|
||||
|
@ -34,12 +34,21 @@
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if "github." in repo_url %}
|
||||
{% set platform = "md-source--github" %}
|
||||
{% elif "gitlab." in repo_url %}
|
||||
{% set platform = "md-source--gitlab" %}
|
||||
{% elif "bitbucket." in repo_url %}
|
||||
{% set platform = "md-source--bitbucket" %}
|
||||
{% else %}
|
||||
{% set platform = "" %}
|
||||
{% endif %}
|
||||
<div class="md-flex__cell md-flex__cell--shrink">
|
||||
<a href="{{ repo_url }}" title="GitHub" class="md-header-source">
|
||||
<div class="md-header-source__inner">
|
||||
<div class="title">squidfunk/mkdocs-material</div>
|
||||
<div class="count">0.2.4 – 177 Stars – 46 Forks</div>
|
||||
<a href="{{ repo_url }}" title="Go to repository" class="md-source {{ platform }}">
|
||||
<div class="md-source__repository">{{ repo_name }}</div>
|
||||
<div class="md-source__stats">
|
||||
0.2.4 · 177 Stars · 46 Forks
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
@ -67,71 +67,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// .md-icon--github {
|
||||
// &::before {
|
||||
// content: " ";
|
||||
// display: block;
|
||||
// background-image: url("../images/icons/github-white.svg"); // TODO: user default source icon otherwise
|
||||
// background-size: 2.4rem 2.4rem;
|
||||
// background-repeat: no-repeat;
|
||||
// width: 2.4rem;
|
||||
// height: 2.4rem;
|
||||
// }
|
||||
// }
|
||||
|
||||
// override locally
|
||||
|
||||
.md-header-source {
|
||||
position: relative;
|
||||
display: table-cell;
|
||||
// background: black;
|
||||
white-space: nowrap;
|
||||
min-width: 23.0rem;
|
||||
max-width: 23.0rem;
|
||||
height: 4.8rem;
|
||||
font-size: 1.3rem;
|
||||
vertical-align: middle;
|
||||
padding-right: 0.8rem;
|
||||
padding-left: 4.0rem;
|
||||
transition: opacity .25s;
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
background-image: url("../images/icons/github-white.svg"); // TODO: user default source icon otherwise
|
||||
background-size: 2.4rem 2.4rem;
|
||||
background-repeat: no-repeat;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
position: absolute;
|
||||
left: 0.8rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: 700;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.count {
|
||||
color: $md-color-white--light;
|
||||
// display: none;
|
||||
// text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.checklist {
|
||||
|
||||
li {
|
||||
|
@ -48,6 +48,7 @@
|
||||
@import "layout/nav";
|
||||
@import "layout/search";
|
||||
@import "layout/sidebar";
|
||||
@import "layout/source";
|
||||
|
||||
@import "extensions/admonition";
|
||||
@import "extensions/codehilite";
|
||||
|
@ -52,7 +52,7 @@
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
|
||||
// Pushed/clicked icon
|
||||
// Hovered icon
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
95
src/assets/stylesheets/layout/_source.scss
Normal file
95
src/assets/stylesheets/layout/_source.scss
Normal file
@ -0,0 +1,95 @@
|
||||
////
|
||||
/// Copyright (c) 2016 Martin Donath <martin.donath@squidfunk.com>
|
||||
///
|
||||
/// Permission is hereby granted, free of charge, to any person obtaining a
|
||||
/// copy of this software and associated documentation files (the "Software"),
|
||||
/// to deal in the Software without restriction, including without limitation
|
||||
/// the rights to use, copy, modify, merge, publish, distribute, sublicense,
|
||||
/// and/or sell copies of the Software, and to permit persons to whom the
|
||||
/// Software is furnished to do so, subject to the following conditions:
|
||||
///
|
||||
/// The above copyright notice and this permission notice shall be included in
|
||||
/// all copies or substantial portions of the Software.
|
||||
///
|
||||
/// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL
|
||||
/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
|
||||
/// DEALINGS
|
||||
////
|
||||
|
||||
// ----------------------------------------------------------------------------
|
||||
// Source
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
// Repository containing source
|
||||
.md-source {
|
||||
display: table-cell;
|
||||
position: relative;
|
||||
min-width: 23.0rem;
|
||||
max-width: 23.0rem;
|
||||
height: 4.8rem;
|
||||
padding: 0 1.2rem;
|
||||
transition: opacity 0.25s;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.4;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
|
||||
// Hovered source information
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
// Repository is hosted on platform
|
||||
&--bitbucket,
|
||||
&--github,
|
||||
&--gitlab {
|
||||
padding-left: 4.0rem;
|
||||
|
||||
// Platform icon
|
||||
&::before {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0.8rem;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
transform: translateY(-50%);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 2.4rem 2.4rem;
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
|
||||
// Code is hosted on BitBucket
|
||||
&--bitbucket::before {
|
||||
background-image: url("../images/icons/bitbucket-white.svg");
|
||||
}
|
||||
|
||||
// Code is hosted on GitHub
|
||||
&--github::before {
|
||||
background-image: url("../images/icons/github-white.svg");
|
||||
}
|
||||
|
||||
// Code is hosted on GitLab
|
||||
&--gitlab::before {
|
||||
background-image: url("../images/icons/gitlab-white.svg");
|
||||
}
|
||||
|
||||
// Repository name
|
||||
&__repository {
|
||||
font-weight: 700;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// Repository statistics
|
||||
&__stats {
|
||||
color: $md-color-white--light;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
@ -70,14 +70,29 @@
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
Check whether the repository is hosted on one of the supported code
|
||||
hosting platforms: Github, Gitlab or Bitbucket.
|
||||
-->
|
||||
{% if "github." in repo_url %}
|
||||
{% set platform = "md-source--github" %}
|
||||
{% elif "gitlab." in repo_url %}
|
||||
{% set platform = "md-source--gitlab" %}
|
||||
{% elif "bitbucket." in repo_url %}
|
||||
{% set platform = "md-source--bitbucket" %}
|
||||
{% else %}
|
||||
{% set platform = "" %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Link to repository -->
|
||||
<div class="md-flex__cell md-flex__cell--shrink">
|
||||
<a href="{{ repo_url }}" title="GitHub" class="md-header-source">
|
||||
<div class="md-header-source__inner">
|
||||
<div class="title">squidfunk/mkdocs-material</div>
|
||||
<div class="count">0.2.4 – 177 Stars – 46 Forks</div>
|
||||
<a href="{{ repo_url }}" title="Go to repository"
|
||||
class="md-source {{ platform }}">
|
||||
<div class="md-source__repository">{{ repo_name }}</div>
|
||||
<div class="md-source__stats">
|
||||
0.2.4 · 177 Stars · 46 Forks
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@ -88,9 +103,4 @@
|
||||
<nav class="md-header-search">
|
||||
|
||||
</nav>
|
||||
|
||||
<!--
|
||||
FOO
|
||||
|
||||
-->
|
||||
</header>
|
Loading…
Reference in New Issue
Block a user