Skip to content

Commit b44ab84

Browse files
stkevintanstkevintan
committed
fix css bugs
1 parent 11a68c8 commit b44ab84

File tree

13 files changed

+12227
-76
lines changed

13 files changed

+12227
-76
lines changed

‎assets/style/_layout.scss

+42-2
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,29 @@ body {
77
body.covered {
88
overflow: hidden;
99
}
10+
.container {
11+
margin: 0 auto; // max-width: 1280px;
12+
width: 100%;
13+
padding: 0 $gutter-width;
14+
}
15+
16+
@media #{$extra-large-and-up} {
17+
.container {
18+
padding: 0 $gutter-width * 1.5;
19+
}
20+
}
21+
22+
@media #{$medium-and-down} {
23+
.container {
24+
padding: 0 $gutter-width/2;
25+
}
26+
}
27+
@media #{$small-and-down} {
28+
.container.container-ex {
29+
padding: 0;
30+
}
31+
}
32+
1033
// main
1134
.main-panel {
1235
min-height: calc(100% - #{$navbar-height});
@@ -24,10 +47,10 @@ body.covered {
2447
display: flex;
2548
flex: 1 1 auto;
2649
justify-content: center;
27-
.container{
50+
.container {
2851
flex: 1 1 auto;
2952
max-width: 100%;
30-
.inner{
53+
.inner {
3154
height: 100%;
3255
}
3356
}
@@ -39,6 +62,23 @@ body.covered {
3962
padding-top: $gutter-width;
4063
color: $footer-font-color;
4164
background-color: $footer-bg-color;
65+
.wrapper {
66+
display: flex;
67+
justify-content: space-between;
68+
flex-wrap: wrap;
69+
}
70+
.group {
71+
flex: 0 0 auto;
72+
&.group-slink {
73+
flex-basis: 66%;
74+
}
75+
&.group-flink {
76+
flex-basis: 34%;
77+
}
78+
@media #{$small-and-down} {
79+
min-width: 100%;
80+
}
81+
}
4282
a {
4383
color: $footer-link-color;
4484
}

‎assets/style/_post.scss

-2
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,8 @@
3131

3232
.post-wrapper {
3333
margin: 0 auto;
34-
height: 100%;
3534
position: relative;
3635
.post {
37-
height: 100%;
3836
.card {
3937
min-height: 100%;
4038
}

‎assets/style/_taxonomy.scss

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
}
1212
.taxonomy-panel {
1313
max-height: calc(100vh - #{$navbar-height});
14+
margin-bottom: 1px; // fix firefox bottom border cut.
1415
background: #fff;
1516
@extend .z-depth-1;
1617
overflow-y: auto;

‎assets/style/_toc.scss

+2-1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
float: right;
55
width: $toc-width;
66
height: 100%;
7+
padding-left: 10px;
78
nav {
89
top: $navbar-height-mobile;
910
padding-top: $navbar-height-mobile;
@@ -37,7 +38,7 @@
3738
padding-left: 1em;
3839
ul > li {
3940
ul {
40-
padding-left: 1em;
41+
padding-left: 1.5em;
4142
}
4243
line-height: $toc-item-height;
4344
a {

‎assets/style/index.scss

+10-5
Original file line numberDiff line numberDiff line change
@@ -100,21 +100,26 @@ a.unstyled {
100100
background-color: $nav-bg-color;
101101

102102
.pagination-item {
103-
@extend .nowrap;
104103
width: 50%;
105104
padding-right: $gutter-width/2;
105+
float:left;
106+
display:flex;
107+
justify-content: flex-start;
108+
align-items: center;
106109
&.next {
110+
justify-content: flex-end;
107111
padding-right: 0;
108112
padding-left: $gutter-width/2;
109113
float: right;
110114
text-align:right;
111115
}
112-
a,
113-
i {
114-
vertical-align: middle;
115-
}
116116
i {
117117
color: $secondary-color;
118+
flex:none;
119+
}
120+
a{
121+
@extend .nowrap;
122+
flex: 1 2 auto;
118123
}
119124
}
120125
}

‎assets/style/materialize/_index.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
@import "components/global";
1414
// @import "components/badges";
1515
@import "components/icons-material-design";
16-
@import "components/grid";
16+
// @import "components/grid";
1717
@import "components/navbar";
1818
@import "components/roboto";
1919
@import "components/typography";

‎assets/style/materialize/components/_color.scss

+30-30
Original file line numberDiff line numberDiff line change
@@ -364,36 +364,36 @@ $colors: (
364364

365365
// Color Classes
366366

367-
@each $color_name, $color in $colors {
368-
@each $color_type, $color_value in $color {
369-
@if $color_type == "base" {
370-
.#{$color_name} {
371-
background-color: $color_value !important;
372-
}
373-
.#{$color_name}-text {
374-
color: $color_value !important;
375-
}
376-
}
377-
@else if $color_name != "shades" {
378-
.#{$color_name}.#{$color_type} {
379-
background-color: $color_value !important;
380-
}
381-
.#{$color_name}-text.text-#{$color_type} {
382-
color: $color_value !important;
383-
}
384-
}
385-
}
386-
}
387-
388-
// Shade classes
389-
@each $color, $color_value in $shades {
390-
.#{$color} {
391-
background-color: $color_value !important;
392-
}
393-
.#{$color}-text {
394-
color: $color_value !important;
395-
}
396-
}
367+
// @each $color_name, $color in $colors {
368+
// @each $color_type, $color_value in $color {
369+
// @if $color_type == "base" {
370+
// .#{$color_name} {
371+
// background-color: $color_value !important;
372+
// }
373+
// .#{$color_name}-text {
374+
// color: $color_value !important;
375+
// }
376+
// }
377+
// @else if $color_name != "shades" {
378+
// .#{$color_name}.#{$color_type} {
379+
// background-color: $color_value !important;
380+
// }
381+
// .#{$color_name}-text.text-#{$color_type} {
382+
// color: $color_value !important;
383+
// }
384+
// }
385+
// }
386+
// }
387+
388+
// // Shade classes
389+
// @each $color, $color_value in $shades {
390+
// .#{$color} {
391+
// background-color: $color_value !important;
392+
// }
393+
// .#{$color}-text {
394+
// color: $color_value !important;
395+
// }
396+
// }
397397

398398

399399
// usage: color("name_of_color", "type_of_color")

‎assets/style/materialize/components/_grid.scss

-22
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,3 @@
1-
.container {
2-
margin: 0 auto; // max-width: 1280px;
3-
width: 100%;
4-
padding: 0 $gutter-width;
5-
}
6-
7-
@media #{$extra-large-and-up} {
8-
.container {
9-
padding: 0 $gutter-width * 1.5;
10-
}
11-
}
12-
13-
@media #{$medium-and-down} {
14-
.container {
15-
padding: 0 $gutter-width/2;
16-
}
17-
}
18-
@media #{$small-and-down} {
19-
.container.container-ex{
20-
padding: 0;
21-
}
22-
}
231

242
// @media #{$medium-and-up} {
253
// .container {

‎assets/style/materialize/components/_variables.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -256,7 +256,7 @@ $footer-font-color: #fff !default;
256256
$footer-bg-color: $primary-color !default;
257257
$footer-copyright-font-color: rgba(255, 255, 255, 0.8) !default;
258258
$footer-copyright-bg-color: rgba(51, 51, 51, 0.08) !default;
259-
$footer-link-color: color("grey", "lighten-1") !default;
259+
$footer-link-color: color("grey", "lighten-3") !default;
260260
// 23. Flow Text
261261
// ==========================================================================
262262
$range: $large-screen - $small-screen !default;

‎layouts/partials/footer.html

+7-9
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
<!-- Footer Section Layout
2-
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
31
<footer class="page-footer">
42
<div class="container">
53
<div class="inner">
6-
<div class="row">
7-
<div class="col l6 s12">
8-
<h5 class="white-text">{{ .Site.Title }}</h5>
9-
<p class="grey-text text-lighten-4">Theme
4+
<div class="wrapper">
5+
<div class="group group-slink">
6+
<h5>{{ .Site.Title }}</h5>
7+
<p>Theme
108
<a href="https://github.com/stkevintan/canoe" target="_blank">canoe</a> designed by
119
<a href="https://github.com/stkevintan" target="_blank">Kevin Tan</a> with ❤</p>
1210
<ul class='slink'>
@@ -19,12 +17,12 @@ <h5 class="white-text">{{ .Site.Title }}</h5>
1917
{{ end }} {{ end }}
2018
</ul>
2119
</div>
22-
<div class="col l4 offset-l2 s12">
23-
<h5 class="white-text">My Friends</h5>
20+
<div class="group group-flink">
21+
<h5>My Friends</h5>
2422
<ul>
2523
{{ with .Site.Menus.friend }}{{ range . }}
2624
<li>
27-
<a class="grey-text text-lighten-3" href="{{ .URL }}" target="_blank">{{ .Name }}</a>
25+
<a href="{{ .URL }}" target="_blank">{{ .Name }}</a>
2826
</li>
2927
{{ end }}{{ end }}
3028
</ul>

‎layouts/partials/header.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -114,9 +114,9 @@
114114
<div class="taxonomy">
115115
<div class="container">
116116
<div class="inner">
117-
<div class="taxonomy-panel row">
117+
<div class="taxonomy-panel">
118118
{{ with .Site.Menus.taxonomy }}{{ range . }}
119-
<div class="col s6">
119+
<div class='group'>
120120
<label>{{ .Name | title }}</label>
121121
<ul>
122122
{{ $key := .Identifier }} {{ $value := (index $.Site.Taxonomies .Identifier) }} {{ range $value.ByCount }}

0 commit comments

Comments
 (0)