tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Add no image placeholder for invalid thumb image URLs

pull/1013/head
Alper Ebicoglu 8 years ago
parent
67ce2994a5
commit
0b4f895a59
9 changed files with 83 additions and 48 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.css
  2. 1
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.min.css
  3. 10
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.scss
  4. 8
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.css
  5. 2
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.min.css
  6. 92
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.scss
  7. 8
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/blog.css
  8. 2
      modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/blog.min.css
  9. 4
      modules/blogging/src/Volo.Blogging.Web/compilerconfig.json

4
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.css
View File

@ -0,0 +1,4 @@
.vs-blog .hero-section .hero-article-img {
min-height: 480px;
background: center center no-repeat;
background-size: cover; }

1
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.min.css
View File

@ -0,0 +1 @@
.vs-blog .hero-section .hero-article-img{min-height:480px;background:center center no-repeat;background-size:cover;}

10
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Posts/Index.scss
View File

@ -0,0 +1,10 @@
.vs-blog {
.hero-section {
.hero-article-img {
min-height: 480px;
background: center center no-repeat;
background-size: cover;
}
}
}

8
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.css
View File

@ -43,7 +43,7 @@
display: inline-block; display: inline-block;
border-radius: 50%; } border-radius: 50%; }
.hero-section .hero-articles .img-container { .hero-section .hero-articles .img-container {
background: black; } min-height: 320px; }
.hero-section .hero-articles .img-container img { .hero-section .hero-articles .img-container img {
filter: grayscale(10%); } filter: grayscale(10%); }
.hero-section .hero-articles .img-container::after { .hero-section .hero-articles .img-container::after {
@ -54,7 +54,7 @@
bottom: 0px; bottom: 0px;
width: 100%; width: 100%;
top: 1% !important; top: 1% !important;
background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.91) 89%, rgba(0, 0, 0, 0.93) 93%) !important; background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.75) 89%, rgba(0, 0, 0, 0.78) 93%) !important;
transition: .2s all ease-in-out; transition: .2s all ease-in-out;
opacity: .9; } opacity: .9; }
.hero-section .hero-articles:hover .img-container::after { .hero-section .hero-articles:hover .img-container::after {
@ -136,5 +136,5 @@
.img-container { .img-container {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border-radius: 4px; } border-radius: 4px;
background: gainsboro; }

2
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.min.css
View File

@ -1 +1 @@
.hero-section{padding:0;}.hero-section .hero-articles{position:relative;overflow:hidden;}.hero-section .hero-articles .hero-content{position:absolute;left:12%;right:12%;bottom:80px;z-index:4;text-align:center;}.hero-section .hero-articles .hero-content h2{margin-top:0;font-size:2.5em;font-weight:bold;}.hero-section .hero-articles .hero-content a{color:#fff;text-shadow:0 0 20px rgba(0,0,0,.5);}.hero-section .hero-articles .hero-content p{color:#fff;}.hero-section .hero-articles .tags .tag{background:rgba(208,208,208,.3);color:#fff !important;}.hero-section .hero-articles .tags .tag:hover{background:#fff;color:#000 !important;}.hero-section .hero-articles .article-owner{text-align:center;position:relative;z-index:12;}.hero-section .hero-articles .article-owner .article-infos{color:#000;}.hero-section .hero-articles .article-owner .article-infos a{color:#000;}.hero-section .hero-articles .article-owner .article-infos .seperator{margin:0 4px;color:rgba(255,255,255,.2);}.hero-section .hero-articles .article-owner .article-infos img.article-avatar{width:64px;margin:-25px 10px 0 0;border:3px solid #fff;display:inline-block;border-radius:50%;}.hero-section .hero-articles .img-container{background:#000;}.hero-section .hero-articles .img-container img{filter:grayscale(10%);}.hero-section .hero-articles .img-container::after{content:"";display:block;position:absolute;z-index:1;bottom:0;width:100%;top:1% !important;background:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.91) 89%,rgba(0,0,0,.93) 93%) !important;transition:.2s all ease-in-out;opacity:.9;}.hero-section .hero-articles:hover .img-container::after{opacity:1;}.article-owner .article-infos{color:#000;}.article-owner .article-infos a{color:rgba(0,0,0,.6);}.article-owner .article-infos .seperator{margin:0 4px;color:rgba(0,0,0,.2);}.article-owner .article-infos img.article-avatar{width:30px;margin:-1px 4px 0 0;display:inline-block;border-radius:50%;}.card-articles .card-content{padding:10px 0 10px;}.card-articles .card-content h3{margin:10px 0;}.card-articles .card-content h3 a{font-weight:700;}.card-articles .article-owner{text-align:left;}.card-articles .article-owner .article-infos{color:#000;}.card-articles .article-owner .article-infos a{color:rgba(0,0,0,.6);}.card-articles .article-owner .article-infos .seperator{margin:0 4px;color:rgba(0,0,0,.2);}.card-articles .article-owner .article-infos img.article-avatar{width:30px;margin:-1px 4px 0 0;display:inline-block;border-radius:50%;}.article-owner{font-size:.85em;}.user-link-icons{position:absolute;right:18px;top:15px;z-index:3;}.user-link-icons a{display:inline-block;color:#eee;margin-left:12px;font-size:1.25em;}.user-link-icons a:hover{color:#fff;}.tags .tag{display:inline-block;padding:2px 8px;background:rgba(208,208,208,.3);border-radius:30px;margin:0 1px 3px 0;color:#b1b1b1 !important;font-size:.7em;line-height:1.6em;text-transform:uppercase;}.tags .tag:hover{background:#000;color:#fff !important;}.popular-tags a{display:block;font-size:.9em;}.popular-tags a span{float:right;opacity:.3;font-size:.9em;}.img-container{position:relative;overflow:hidden;border-radius:4px;} .hero-section{padding:0;}.hero-section .hero-articles{position:relative;overflow:hidden;}.hero-section .hero-articles .hero-content{position:absolute;left:12%;right:12%;bottom:80px;z-index:4;text-align:center;}.hero-section .hero-articles .hero-content h2{margin-top:0;font-size:2.5em;font-weight:bold;}.hero-section .hero-articles .hero-content a{color:#fff;text-shadow:0 0 20px rgba(0,0,0,.5);}.hero-section .hero-articles .hero-content p{color:#fff;}.hero-section .hero-articles .tags .tag{background:rgba(208,208,208,.3);color:#fff !important;}.hero-section .hero-articles .tags .tag:hover{background:#fff;color:#000 !important;}.hero-section .hero-articles .article-owner{text-align:center;position:relative;z-index:12;}.hero-section .hero-articles .article-owner .article-infos{color:#000;}.hero-section .hero-articles .article-owner .article-infos a{color:#000;}.hero-section .hero-articles .article-owner .article-infos .seperator{margin:0 4px;color:rgba(255,255,255,.2);}.hero-section .hero-articles .article-owner .article-infos img.article-avatar{width:64px;margin:-25px 10px 0 0;border:3px solid #fff;display:inline-block;border-radius:50%;}.hero-section .hero-articles .img-container{min-height:320px;}.hero-section .hero-articles .img-container img{filter:grayscale(10%);}.hero-section .hero-articles .img-container::after{content:"";display:block;position:absolute;z-index:1;bottom:0;width:100%;top:1% !important;background:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.75) 89%,rgba(0,0,0,.78) 93%) !important;transition:.2s all ease-in-out;opacity:.9;}.hero-section .hero-articles:hover .img-container::after{opacity:1;}.article-owner .article-infos{color:#000;}.article-owner .article-infos a{color:rgba(0,0,0,.6);}.article-owner .article-infos .seperator{margin:0 4px;color:rgba(0,0,0,.2);}.article-owner .article-infos img.article-avatar{width:30px;margin:-1px 4px 0 0;display:inline-block;border-radius:50%;}.card-articles .card-content{padding:10px 0 10px;}.card-articles .card-content h3{margin:10px 0;}.card-articles .card-content h3 a{font-weight:700;}.card-articles .article-owner{text-align:left;}.card-articles .article-owner .article-infos{color:#000;}.card-articles .article-owner .article-infos a{color:rgba(0,0,0,.6);}.card-articles .article-owner .article-infos .seperator{margin:0 4px;color:rgba(0,0,0,.2);}.card-articles .article-owner .article-infos img.article-avatar{width:30px;margin:-1px 4px 0 0;display:inline-block;border-radius:50%;}.article-owner{font-size:.85em;}.user-link-icons{position:absolute;right:18px;top:15px;z-index:3;}.user-link-icons a{display:inline-block;color:#eee;margin-left:12px;font-size:1.25em;}.user-link-icons a:hover{color:#fff;}.tags .tag{display:inline-block;padding:2px 8px;background:rgba(208,208,208,.3);border-radius:30px;margin:0 1px 3px 0;color:#b1b1b1 !important;font-size:.7em;line-height:1.6em;text-transform:uppercase;}.tags .tag:hover{background:#000;color:#fff !important;}.popular-tags a{display:block;font-size:.9em;}.popular-tags a span{float:right;opacity:.3;font-size:.9em;}.img-container{position:relative;overflow:hidden;border-radius:4px;background:#dcdcdc;}

92
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/_home.scss
View File

@ -1,66 +1,80 @@
.hero-section { .hero-section {
padding: 0; padding: 0;
.hero-articles {
position: relative; .hero-articles {
overflow: hidden; position: relative;
.hero-content { overflow: hidden;
.hero-content {
position: absolute; position: absolute;
left: 12%; left: 12%;
right: 12%; right: 12%;
bottom: 80px; bottom: 80px;
z-index: 4; z-index: 4;
text-align: center; text-align: center;
h2 { h2 {
margin-top: 0; margin-top: 0;
font-size: 2.5em; font-size: 2.5em;
font-weight: bold; font-weight: bold;
} }
a {
a {
color: white; color: white;
text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5); text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
} }
p {
p {
color: white; color: white;
} }
} }
.tags {
.tag { .tags {
background: rgba(208, 208, 208, 0.3); .tag {
color: #fff !important; background: rgba(208, 208, 208, 0.3);
&:hover { color: #fff !important;
background: white;
&:hover {
background: white;
color: black !important; color: black !important;
} }
} }
} }
.article-owner { .article-owner {
text-align: center; text-align: center;
position: relative; position: relative;
z-index: 12; z-index: 12;
.article-infos { .article-infos {
color: black; color: black;
a { a {
color: black; color: black;
} }
.seperator { .seperator {
margin: 0 4px; margin: 0 4px;
color: rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.2);
} }
img.article-avatar {
img.article-avatar {
width: 64px; width: 64px;
margin: -25px 10px 0px 0; margin: -25px 10px 0px 0;
border: 3px solid #fff; border: 3px solid #fff;
display: inline-block; display: inline-block;
border-radius: 50%; border-radius: 50%;
} }
} }
} }
.img-container {
background: black; .img-container {
min-height: 320px;
img { img {
filter: grayscale(10%); filter: grayscale(10%);
} }
&::after { &::after {
content: ""; content: "";
display: block; display: block;
@ -69,19 +83,20 @@
bottom: 0px; bottom: 0px;
width: 100%; width: 100%;
top: 1% !important; top: 1% !important;
background: linear-gradient(to bottom,rgba(0, 0, 0, 0) 0,rgba(0, 0, 0, 0.91) 89%,rgba(0, 0, 0, 0.93) 93%) !important; background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.75) 89%, rgba(0, 0, 0, 0.78) 93%) !important;
transition: .2s all ease-in-out; transition: .2s all ease-in-out;
opacity: .9; opacity: .9;
} }
} }
&:hover {
&:hover {
.img-container { .img-container {
&::after { &::after {
opacity: 1; opacity: 1;
} }
} }
} }
} }
} }
.article-owner { .article-owner {
@ -189,8 +204,9 @@
.img-container { .img-container {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border-radius: 4px; border-radius: 4px;
background: gainsboro;
} }

8
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/blog.css
View File

@ -132,7 +132,7 @@
display: inline-block; display: inline-block;
border-radius: 50%; } border-radius: 50%; }
div.vs-blog .hero-section .hero-articles .img-container { div.vs-blog .hero-section .hero-articles .img-container {
background: black; } min-height: 320px; }
div.vs-blog .hero-section .hero-articles .img-container img { div.vs-blog .hero-section .hero-articles .img-container img {
filter: grayscale(10%); } filter: grayscale(10%); }
div.vs-blog .hero-section .hero-articles .img-container::after { div.vs-blog .hero-section .hero-articles .img-container::after {
@ -143,7 +143,7 @@
bottom: 0px; bottom: 0px;
width: 100%; width: 100%;
top: 1% !important; top: 1% !important;
background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.91) 89%, rgba(0, 0, 0, 0.93) 93%) !important; background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.75) 89%, rgba(0, 0, 0, 0.78) 93%) !important;
transition: .2s all ease-in-out; transition: .2s all ease-in-out;
opacity: .9; } opacity: .9; }
div.vs-blog .hero-section .hero-articles:hover .img-container::after { div.vs-blog .hero-section .hero-articles:hover .img-container::after {
@ -217,7 +217,8 @@
div.vs-blog .img-container { div.vs-blog .img-container {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border-radius: 4px; } border-radius: 4px;
background: gainsboro; }
div.vs-blog .post-detail h1 { div.vs-blog .post-detail h1 {
padding: 0px 0; padding: 0px 0;
line-height: 1.25em; line-height: 1.25em;
@ -309,4 +310,3 @@
div.vs-blog .box-articles .img-container img.portrait { div.vs-blog .box-articles .img-container img.portrait {
width: 100%; width: 100%;
height: auto; } } height: auto; } }

2
modules/blogging/src/Volo.Blogging.Web/Pages/Blog/Shared/Styles/blog.min.css
View File

File diff suppressed because one or more lines are too long

4
modules/blogging/src/Volo.Blogging.Web/compilerconfig.json
View File

@ -6,5 +6,9 @@
{ {
"outputFile": "Pages/Blog/Shared/Styles/_home.css", "outputFile": "Pages/Blog/Shared/Styles/_home.css",
"inputFile": "Pages/Blog/Shared/Styles/_home.scss" "inputFile": "Pages/Blog/Shared/Styles/_home.scss"
},
{
"outputFile": "Pages/Blog/Posts/Index.css",
"inputFile": "Pages/Blog/Posts/Index.scss"
} }
] ]
Write Preview
Loading…
Cancel
Save