whentimeslows/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #23029 from sftim/20200808_improve_callout_styling

Browse Source 
Improve styling for callouts
This commit is contained in:
Kubernetes Prow Robot
2020-08-31 11:06:21 -07:00
committed by GitHub
parent b29e66f357 4febf7471d
commit aa855d5988
7 changed files with 30 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/scss/_custom.scss
+22 -10
View File
@@ -268,22 +268,34 @@ main {
// blockquotes and callouts // blockquotes and callouts
blockquote { .td-content, body {
padding: 0.4rem 0.4rem 0.4rem 1rem !important; blockquote.callout {
padding: 0.4rem 0.4rem 0.4rem 1rem;
border: 1px solid #eee;
border-left-width: 0.5em;
background: #fff;
color: #000;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
blockquote.callout {
border-radius: calc(1em/3);
}
.callout.caution {
border-left-color: #f0ad4e;
} }
// callouts are contained in static CSS as well. these require override. .callout.note {
border-left-color: #428bca;
.caution {
border-left-color: #f0ad4e !important;
} }
.note { .callout.warning {
border-left-color: #428bca !important; border-left-color: #d9534f;
} }
.warning { h1:first-of-type + blockquote.callout {
border-left-color: #d9534f !important; margin-top: 1.5em;
}
} }
.deprecation-warning { .deprecation-warning {
layouts/partials/css.html
+1 -1
View File
@@ -16,7 +16,7 @@
{{- end }} {{- end }}
<link rel="stylesheet" href="{{ "css/jquery-ui.min.css" | relURL }}"> <link rel="stylesheet" href="{{ "css/jquery-ui.min.css" | relURL }}">
<link rel="stylesheet" href="{{ "css/callouts.css" | relURL }}"> <link rel="stylesheet" href="{{ "css/feature-states.css" | relURL }}">
<link rel="stylesheet" href="{{ "css/custom-jekyll/tags.css" | relURL }}"> <link rel="stylesheet" href="{{ "css/custom-jekyll/tags.css" | relURL }}">
{{- if .Site.Params.announcement }} {{- if .Site.Params.announcement }}
<link rel="stylesheet" href="{{ "css/announcement.css" | relURL }}"> <link rel="stylesheet" href="{{ "css/announcement.css" | relURL }}">
layouts/shortcodes/caution.html
+1 -1
View File
@@ -1,3 +1,3 @@
<blockquote class="caution"> <blockquote class="caution callout">
<div><strong>{{ T "caution" }}</strong> {{ trim .Inner " \n" | markdownify }}</div> <div><strong>{{ T "caution" }}</strong> {{ trim .Inner " \n" | markdownify }}</div>
</blockquote> </blockquote>
layouts/shortcodes/deprecationfilewarning.html
+1 -1
View File
@@ -1,3 +1,3 @@
<blockquote class="deprecation_file_warning"> <blockquote class="deprecation_file_warning callout">
<div><h4>{{ T "deprecation_file_warning" }}</h4> {{ .Inner | markdownify }}</div> <div><h4>{{ T "deprecation_file_warning" }}</h4> {{ .Inner | markdownify }}</div>
</blockquote> </blockquote>
layouts/shortcodes/note.html
+1 -1
View File
@@ -1,3 +1,3 @@
<blockquote class="note"> <blockquote class="note callout">
<div><strong>{{ T "note" }}</strong> {{ trim .Inner " \n" | markdownify }}</div> <div><strong>{{ T "note" }}</strong> {{ trim .Inner " \n" | markdownify }}</div>
</blockquote> </blockquote>
layouts/shortcodes/warning.html
+1 -1
View File
@@ -1,3 +1,3 @@
<blockquote class="warning"> <blockquote class="warning callout">
<div><strong>{{ T "warning" }}</strong> {{ trim .Inner " \n" | markdownify }}</div> <div><strong>{{ T "warning" }}</strong> {{ trim .Inner " \n" | markdownify }}</div>
</blockquote> </blockquote>
static/css/callouts.css → static/css/feature-states.css
-21
View File
@@ -1,24 +1,3 @@
/* Callouts */
.caution, .note, .warning {
padding: 20px;
margin: 20px 0;
border: 1px solid #eee;
border-left-width: 5px;
border-radius: 3px;
}
.caution {
border-left-color: #f0ad4e;
}
.note {
border-left-color: #428bca;
}
.warning {
border-left-color: #d9534f;
}
/* Feature States */ /* Feature States */
.beta, .stable, .alpha, .deprecated { .beta, .stable, .alpha, .deprecated {