Add image cover
This commit is contained in:
parent
630d1614b1
commit
4a6654c22d
|
@ -13,6 +13,8 @@
|
|||
[cheshire "5.9.0"]
|
||||
;; Date
|
||||
[clj-time "0.15.2"]
|
||||
;; HTTP client
|
||||
[clj-http "3.12.3"]
|
||||
;; Utils dirs
|
||||
[me.raynes/fs "1.4.6"]
|
||||
;; Parse RSS/Atom feeds
|
||||
|
|
|
@ -24,8 +24,8 @@
|
|||
<!-- CSS -->
|
||||
<link rel="stylesheet" type="text/css" href="static/css/normalize.css">
|
||||
<link rel="stylesheet" href="static/css/main.css">
|
||||
<link rel="stylesheet" href="static/css/desktop.css" media="all and (max-width: 600px)">
|
||||
<link rel="stylesheet" href="static/css/mobile.css" media="all and (min-width: 601px)">
|
||||
<link href="static/css/mobile.css" rel="stylesheet" media="all and (max-width: 600px)">
|
||||
<link href="static/css/desktop.css" rel="stylesheet" media="all and (min-width: 601px)">
|
||||
<!-- End CSS -->
|
||||
</head>
|
||||
<body>
|
||||
|
|
Binary file not shown.
|
@ -0,0 +1,135 @@
|
|||
/* Desktop */
|
||||
.main {
|
||||
display: grid;
|
||||
grid-gap: 1rem;
|
||||
grid-template-columns: repeat(12, 1fr);
|
||||
}
|
||||
|
||||
/* First column. */
|
||||
.feed__article:nth-child(3n-2){
|
||||
grid-column: 9 / 13;
|
||||
}
|
||||
|
||||
/* Second column */
|
||||
.feed__article:nth-child(3n+2){
|
||||
grid-column: 1 / 5;
|
||||
}
|
||||
|
||||
/* Third column */
|
||||
.feed__article:nth-child(3n+3) {
|
||||
grid-column: 5 / 9;
|
||||
}
|
||||
|
||||
.article__title {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.article__feed {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.article__date {
|
||||
font-size: .9rem;
|
||||
color: var(--color-gray);
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__title {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__feed {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) {
|
||||
grid-column: 1 / 9;
|
||||
grid-row: 1 / 4;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 1 / 2;
|
||||
|
||||
}
|
||||
|
||||
.feed__article:nth-child(3) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 2 / 3;
|
||||
|
||||
}
|
||||
|
||||
.feed__article:nth-child(4) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 3 / 4;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__header,
|
||||
.feed__article:nth-child(3) .article__header,
|
||||
.feed__article:nth-child(4) .article__header
|
||||
{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: row-reverse;
|
||||
grid-gap: 1rem;
|
||||
}
|
||||
|
||||
.article__header > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.article__header-img > img {
|
||||
height: var(--height-img);
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__header-img > img,
|
||||
.feed__article:nth-child(2) .article__header-img > img,
|
||||
.feed__article:nth-child(3) .article__header-img > img,
|
||||
.feed__article:nth-child(4) .article__header-img > img
|
||||
{
|
||||
height: initial;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__titles,
|
||||
.feed__article:nth-child(3) .article__titles,
|
||||
.feed__article:nth-child(4) .article__titles,
|
||||
.feed__article:nth-child(2) .article__header-img,
|
||||
.feed__article:nth-child(3) .article__header-img,
|
||||
.feed__article:nth-child(4) .article__header-img
|
||||
{
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__title,
|
||||
.feed__article:nth-child(3) .article__title,
|
||||
.feed__article:nth-child(4) .article__title
|
||||
{
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__feed,
|
||||
.feed__article:nth-child(3) .article__feed,
|
||||
.feed__article:nth-child(4) .article__feed
|
||||
{
|
||||
font-size: 1rem;
|
||||
}
|
||||
.article__main {
|
||||
position: fixed;
|
||||
left: -100%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow-y: auto;
|
||||
|
||||
}
|
||||
.feed__article:nth-child(1) .article__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
.feed__article:nth-child(1) .article__header-img {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.feed__article:first-child img {
|
||||
height: 100%;
|
||||
}
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
@font-face {
|
||||
font-family: Newsreader;
|
||||
src: url("static/fonts/Newsreader-VariableFont_opsz,wght.woff2");
|
||||
src: url("../fonts/Newsreader-VariableFont_opsz,wght.woff2");
|
||||
}
|
||||
|
||||
body {
|
||||
|
@ -15,6 +15,8 @@ body {
|
|||
padding: 0;
|
||||
font-family: Newsreader, serif;
|
||||
color: var(--color-black);
|
||||
background-image: url("../img/background.jpg");
|
||||
background-size: 100%;
|
||||
}
|
||||
img {
|
||||
object-fit: cover;
|
||||
|
|
|
@ -1,131 +1,7 @@
|
|||
/* Desktop */
|
||||
.main {
|
||||
display: grid;
|
||||
grid-gap: 1rem;
|
||||
grid-template-columns: repeat(12, 1fr);
|
||||
.title {
|
||||
font-size: 3rem
|
||||
}
|
||||
|
||||
/* First column. */
|
||||
.feed__article:nth-child(3n-2){
|
||||
grid-column: 9 / 13;
|
||||
}
|
||||
|
||||
/* Second column */
|
||||
.feed__article:nth-child(3n+2){
|
||||
grid-column: 1 / 5;
|
||||
}
|
||||
|
||||
/* Third column */
|
||||
.feed__article:nth-child(3n+3) {
|
||||
grid-column: 5 / 9;
|
||||
}
|
||||
|
||||
.article__title {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.article__feed {
|
||||
.subtitle {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.article__date {
|
||||
font-size: .9rem;
|
||||
color: var(--color-gray);
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__title {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__feed {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) {
|
||||
grid-column: 1 / 9;
|
||||
grid-row: 1 / 4;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 1 / 2;
|
||||
|
||||
}
|
||||
|
||||
.feed__article:nth-child(3) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 2 / 3;
|
||||
|
||||
}
|
||||
|
||||
.feed__article:nth-child(4) {
|
||||
grid-column: 9 / 13;
|
||||
grid-row: 3 / 4;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__header,
|
||||
.feed__article:nth-child(3) .article__header,
|
||||
.feed__article:nth-child(4) .article__header
|
||||
{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: row-reverse;
|
||||
grid-gap: 1rem;
|
||||
}
|
||||
|
||||
.article__header > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.article__header-img > img {
|
||||
height: var(--height-img);
|
||||
}
|
||||
|
||||
.feed__article:nth-child(1) .article__header-img > img,
|
||||
.feed__article:nth-child(2) .article__header-img > img,
|
||||
.feed__article:nth-child(3) .article__header-img > img,
|
||||
.feed__article:nth-child(4) .article__header-img > img
|
||||
{
|
||||
height: initial;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__titles,
|
||||
.feed__article:nth-child(3) .article__titles,
|
||||
.feed__article:nth-child(4) .article__titles,
|
||||
.feed__article:nth-child(2) .article__header-img,
|
||||
.feed__article:nth-child(3) .article__header-img,
|
||||
.feed__article:nth-child(4) .article__header-img
|
||||
{
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__title,
|
||||
.feed__article:nth-child(3) .article__title,
|
||||
.feed__article:nth-child(4) .article__title
|
||||
{
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.feed__article:nth-child(2) .article__feed,
|
||||
.feed__article:nth-child(3) .article__feed,
|
||||
.feed__article:nth-child(4) .article__feed
|
||||
{
|
||||
font-size: 1rem;
|
||||
}
|
||||
.article__main {
|
||||
position: fixed;
|
||||
left: -100%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow-y: auto;
|
||||
|
||||
}
|
||||
.feed__article:nth-child(1) .article__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
.feed__article:nth-child(1) .article__header-img {
|
||||
height: 100%;
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 265 KiB |
12
rsspaper.iml
12
rsspaper.iml
|
@ -14,7 +14,7 @@
|
|||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
<orderEntry type="library" name="Leiningen: cheshire:5.9.0" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: clj-http:3.10.2" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: clj-http:3.12.3" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: clj-rss:0.2.7" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: clj-time:0.15.2" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: clj-tuple:0.2.2" level="project" />
|
||||
|
@ -26,7 +26,7 @@
|
|||
<orderEntry type="library" name="Leiningen: com.rometools/rome-utils:1.15.0" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: com.rometools/rome:1.15.0" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: commons-codec:1.11" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: commons-io:2.6" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: commons-io:2.8.0" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: commons-logging:1.2" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: hiccup:1.0.5" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: joda-time:2.10" level="project" />
|
||||
|
@ -36,11 +36,11 @@
|
|||
<orderEntry type="library" name="Leiningen: nrepl:0.6.0" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.commons/commons-compress:1.8" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpasyncclient:4.1.4" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpclient-cache:4.5.10" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpclient:4.5.10" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpclient-cache:4.5.13" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpclient:4.5.13" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpcore-nio:4.4.10" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpcore:4.4.12" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpmime:4.5.10" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpcore:4.4.14" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.apache.httpcomponents/httpmime:4.5.13" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.clojure/clojure:1.10.3" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.clojure/core.specs.alpha:0.2.56" level="project" />
|
||||
<orderEntry type="library" name="Leiningen: org.clojure/data.codec:0.1.0" level="project" />
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(ns rsspaper.feeds
|
||||
(:require
|
||||
[rsspaper.config :refer [config]]
|
||||
[clj-http.client :as client]
|
||||
[clj-time.core :as t]
|
||||
[clj-time.coerce :as c]
|
||||
[clj-time.format :as f]
|
||||
|
@ -20,7 +21,7 @@
|
|||
(case (:edition config)
|
||||
"daily" (filter (fn [article] (and (not (nil? (:published-date article))) (>= (:published-date article) daily))) articles)
|
||||
"weekly" (filter (fn [article] (and (not (nil? (:published-date article))) (>= (:published-date article) weekly))) articles)
|
||||
:else articles)))
|
||||
articles)))
|
||||
|
||||
(defn add-datetimes-formatter
|
||||
[articles]
|
||||
|
@ -39,11 +40,18 @@
|
|||
;; Add cover to article search first image in description
|
||||
;; Iterate every blog
|
||||
(map (fn [article]
|
||||
(let [url-article (second (re-find #"<img[^>]+src=\"([^\">]+)\"" (str (get-in article [:description :value]))))]
|
||||
(assoc article :cover (if (nil? url-article) (get-in article [:feed :image :url]) url-article)))) articles))
|
||||
(let [url-article (get-in article [:feed :link])
|
||||
html (:body (client/get url-article {:insecure? true}))
|
||||
first-content (second (re-find #"<meta.*content=\"([^\">]+)\".*property=\"og:image(?::url)?\".*>" html))
|
||||
second-content (second (re-find #"<meta.*property=\"og:image(?::url)?\".*content=\"([^\">]+)\".*>" html))
|
||||
first-image (second (re-find #"<img[^>]+src=\"([^\">]+)\"" html))
|
||||
images [first-content second-content first-image]
|
||||
final-image (first (filter (fn [item] (not (nil? item))) images))]
|
||||
(assoc article :cover final-image))) articles))
|
||||
|
||||
(defn order-published
|
||||
[articles]
|
||||
;; Order articles
|
||||
(reverse (sort-by :published-date articles)))
|
||||
|
||||
(defn get-articles
|
||||
|
|
Loading…
Reference in New Issue