infeeeee/dis-2019
1
0
Fork 0
Code Issues 6 Pull Requests Releases 19 Wiki Activity

work on homepage

Browse Source
This commit is contained in:
Péter Gyetvai
2019-06-09 19:55:23 +02:00
parent 647e333a16
commit 027ad5511c
17 changed files with 396 additions and 381 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
_jegyzet.md
View File

@@ -72,14 +72,14 @@ Kezdőlap:
Nincs gradiens Nincs gradiens
Hover csak a címen Hover csak a címen
Nyíl, csak az első cikken Nyíl, csak az első cikken
cursor módosítás tekerésre ~cursor módosítás tekerésre~
Kis ikonok hover: Kis ikonok hover:
- maszkok bedo alapján ~- maszkok bedo alapján~
- némelyik maszkkal alapból, némelyik sima kép, ~- némelyik maszkkal alapból, némelyik sima kép, ~
- hoverre eltűnik a kép, és helyette ~- hoverre eltűnik a kép, és helyette~
Nagycímek: Nagycímek:
- utána margó ~- utána margó~
- az is megnő, minden mint - az is megnő, minden mint
Excerpt a főoldalon hoverre: külön paraméter, nem excerpt!! Excerpt a főoldalon hoverre: külön paraméter, nem excerpt!!
@@ -118,6 +118,8 @@ Kereső:
Animációk? Animációk?
Kurzor: Nyíl az nem túl halovány? 32x32 pixel lehet maximum
# Post-install teendők: # Post-install teendők:

113
css/base.css
View File

@@ -462,24 +462,43 @@ object {
border-bottom: 5rem solid #fff; border-bottom: 5rem solid #fff;
position: absolute; position: absolute;
z-index: -1; } z-index: -1; }
.wrapper main section .misha_loadmore {
font: bold 3rem "Westeinde Caption";
color: #000; }
@media (-webkit-min-device-pixel-ratio: 2.1) {
.wrapper main section .misha_loadmore {
font-size: 2.5rem !important; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.wrapper main section .misha_loadmore { .wrapper main section .misha_loadmore {
font-size: 5rem; } } width: 10rem;
@media (min-width: 769px) { margin-right: 10rem;
.wrapper main section .misha_loadmore {
border-left: #000 1px solid;
padding: 4rem 10rem;
align-self: stretch; align-self: stretch;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
justify-content: space-around; justify-content: center;
align-items: center;
height: 100%; } } height: 100%; } }
.wrapper main section .misha_loadmore a,
.wrapper main section .misha_loadmore p {
font: bold 3rem "Westeinde Caption";
color: #fff;
-webkit-text-stroke: #000 1px; }
@media (-webkit-min-device-pixel-ratio: 2.1) {
.wrapper main section .misha_loadmore a,
.wrapper main section .misha_loadmore p {
font-size: 2rem !important; } }
@media (min-width: 769px) {
.wrapper main section .misha_loadmore a,
.wrapper main section .misha_loadmore p {
font-size: 3rem; } }
@media (min-width: 769px) {
.wrapper main section .misha_loadmore a,
.wrapper main section .misha_loadmore p {
transform-origin: center;
white-space: nowrap;
width: 100vh;
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg); } }
.touchevents .header-scroll {
display: none !important; }
/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */
/* HOMEPAGE */ /* HOMEPAGE */
@@ -570,16 +589,15 @@ object {
padding-top: 4rem; padding-top: 4rem;
border-right: #000 1px solid; border-right: #000 1px solid;
/* -------------------------------- thumbnail and title ------------------------------- */ /* -------------------------------- thumbnail and title ------------------------------- */
/* -------------------------- home article metadata big------------------------- */ } /* -------------------------- home article metadata big------------------------- */
.home main section .home-wrapper-big article::before { /* ------------------------- home article big hover ------------------------- */ }
content: "<hr>";
display: block;
height: 1px;
width: 100%;
background: #000; }
.home main section .home-wrapper-big article .thumbnailwrapper { .home main section .home-wrapper-big article .thumbnailwrapper {
height: calc(100% - 4rem); } height: calc(100% - 4rem);
.home main section .home-wrapper-big article .thumbnailwrapper img.attachment-home-thumbnail { display: flex;
flex-direction: row;
justify-content: flex-start;
border-top: 1px #000 solid; }
.home main section .home-wrapper-big article .thumbnailwrapper img.attachment-home-big-thumbnail {
object-fit: cover; object-fit: cover;
width: 50%; width: 50%;
height: 100%; } height: 100%; }
@@ -636,12 +654,19 @@ object {
display: none; display: none;
display: block; display: block;
border-right: #000 solid 1px; } border-right: #000 solid 1px; }
.home main section .home-wrapper-big article.hovered {
width: calc(100vw - (10rem * 2)); }
.home main section .home-wrapper-big article.hovered h2 > a {
color: #000; }
.home main section .home-wrapper-1 article a.thumbnailwrapper {
justify-content: flex-end; }
.home main section .home-wrapper-2 article { .home main section .home-wrapper-2 article {
border-left: #000 1px solid; } } border-left: #000 1px solid; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.home main section .home-wrapper-small { .home main section .home-wrapper-small {
width: calc(100vw - (10rem * 3)); width: calc(100vw - (10rem * 3));
height: calc((100vw - (10rem * 3)) / 3 * 2); height: calc((100vw - (10rem * 3)) / 3 * 2);
flex-shrink: 0;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
@@ -996,14 +1021,21 @@ object {
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-be.home-big h2 a { .tag-be.home-big h2 a {
color: #00ffb8 !important; } color: #00ffb8; }
.tag-be.home-big.hovered {
background-color: #00ffb8 !important; }
.tag-be.home-small .metadata, .tag-be.home-small .metadata,
.tag-be.home-small .metadata a { .tag-be.home-small .metadata a {
color: #000 !important; } } color: #000 !important; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-be.random .thumbnailwrapper > img { .tag-be.random .thumbnailwrapper > img {
clip-path: url(../img/clip/be_desktop.svg); } } -webkit-mask: url(../img/clip/be_desktop.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100%;
mask: url(../img/clip/be_desktop.svg);
mask-repeat: no-repeat;
mask-size: 100%; } }
.tag-do .metadata { .tag-do .metadata {
color: #ff5f5f !important; } color: #ff5f5f !important; }
@@ -1024,14 +1056,21 @@ object {
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-do.home-big h2 a { .tag-do.home-big h2 a {
color: #ff5f5f !important; } color: #ff5f5f; }
.tag-do.home-big.hovered {
background-color: #ff5f5f !important; }
.tag-do.home-small .metadata, .tag-do.home-small .metadata,
.tag-do.home-small .metadata a { .tag-do.home-small .metadata a {
color: #000 !important; } } color: #000 !important; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-do.random .thumbnailwrapper > img { .tag-do.random .thumbnailwrapper > img {
clip-path: url(../img/clip/do_desktop.svg); } } -webkit-mask: url(../img/clip/do_desktop.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100%;
mask: url(../img/clip/do_desktop.svg);
mask-repeat: no-repeat;
mask-size: 100%; } }
.tag-think .metadata { .tag-think .metadata {
color: #fdff00 !important; } color: #fdff00 !important; }
@@ -1052,14 +1091,21 @@ object {
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-think.home-big h2 a { .tag-think.home-big h2 a {
color: #fdff00 !important; } color: #fdff00; }
.tag-think.home-big.hovered {
background-color: #fdff00 !important; }
.tag-think.home-small .metadata, .tag-think.home-small .metadata,
.tag-think.home-small .metadata a { .tag-think.home-small .metadata a {
color: #000 !important; } } color: #000 !important; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-think.random .thumbnailwrapper > img { .tag-think.random .thumbnailwrapper > img {
clip-path: url(../img/clip/think_desktop.svg); } } -webkit-mask: url(../img/clip/think_desktop.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100%;
mask: url(../img/clip/think_desktop.svg);
mask-repeat: no-repeat;
mask-size: 100%; } }
.tag-love .metadata { .tag-love .metadata {
color: #3c00ff !important; } color: #3c00ff !important; }
@@ -1080,14 +1126,21 @@ object {
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-love.home-big h2 a { .tag-love.home-big h2 a {
color: #3c00ff !important; } color: #3c00ff; }
.tag-love.home-big.hovered {
background-color: #3c00ff !important; }
.tag-love.home-small .metadata, .tag-love.home-small .metadata,
.tag-love.home-small .metadata a { .tag-love.home-small .metadata a {
color: #000 !important; } } color: #000 !important; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.tag-love.random .thumbnailwrapper > img { .tag-love.random .thumbnailwrapper > img {
clip-path: url(../img/clip/love_desktop.svg); } } -webkit-mask: url(../img/clip/love_desktop.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100%;
mask: url(../img/clip/love_desktop.svg);
mask-repeat: no-repeat;
mask-size: 100%; } }
@media (min-width: 769px) { @media (min-width: 769px) {
.single .tag-be .metadata { .single .tag-be .metadata {

26
functions.php
View File

@@ -392,27 +392,28 @@ function misha_my_load_more_scripts()
global $wp_query; global $wp_query;
// In most cases it is already included on the page and this line can be removed // In most cases it is already included on the page and this line can be removed
wp_enqueue_script('jquery'); //wp_enqueue_script('jquery');
// register our main script but do not enqueue it yet // register our main script but do not enqueue it yet
wp_register_script('my_loadmore', get_stylesheet_directory_uri() . '/js/myloadmore.js', array('jquery')); //wp_register_script('my_loadmore', get_stylesheet_directory_uri() . '/js/myloadmore.js', array('jquery'));
// now the most interesting part // now the most interesting part
// we have to pass parameters to myloadmore.js script but we can get the parameters values only in PHP // we have to pass parameters to myloadmore.js script but we can get the parameters values only in PHP
// you can define variables directly in your HTML but I decided that the most proper way is wp_localize_script() // you can define variables directly in your HTML but I decided that the most proper way is wp_localize_script()
wp_localize_script('my_loadmore', 'misha_loadmore_params', array( //wp_localize_script('my_loadmore', 'misha_loadmore_params', array(
wp_localize_script('dis2019scripts', 'misha_loadmore_params', array(
'ajaxurl' => site_url() . '/wp-admin/admin-ajax.php', // WordPress AJAX 'ajaxurl' => site_url() . '/wp-admin/admin-ajax.php', // WordPress AJAX
'posts' => json_encode($wp_query->query_vars), // everything about your loop is here 'posts' => json_encode($wp_query->query_vars), // everything about your loop is here
'current_page' => get_query_var('paged') ? get_query_var('paged') : 1, 'current_page' => get_query_var('paged') ? get_query_var('paged') : 1,
'max_page' => $wp_query->max_num_pages, 'max_page' => $wp_query->max_num_pages,
)); ));
wp_enqueue_script('my_loadmore'); // wp_enqueue_script('my_loadmore');
} }
add_action('wp_enqueue_scripts', 'misha_my_load_more_scripts'); add_action('wp_enqueue_scripts', 'misha_my_load_more_scripts');
function misha_loadmore_ajax_handler() function misha_loadmore_ajax_handler()
{ {
@@ -436,7 +437,6 @@ function misha_loadmore_ajax_handler()
query_posts($args); query_posts($args);
get_template_part('loop'); get_template_part('loop');
die; // here we exit the script and even no wp_reset_query() required! die; // here we exit the script and even no wp_reset_query() required!
} }
@@ -445,19 +445,19 @@ add_action('wp_ajax_nopriv_loadmore', 'misha_loadmore_ajax_handler'); // wp_ajax
/* -------------------- different number of posts on home ------------------- */ /* -------------------- different number of posts on home ------------------- */
add_action('pre_get_posts', 'dis_2019_more_posts_on_home', 1 ); add_action('pre_get_posts', 'dis_2019_more_posts_on_home', 1);
function dis_2019_more_posts_on_home(&$query) { function dis_2019_more_posts_on_home(&$query)
{
//Before anything else, make sure this is the right query... //Before anything else, make sure this is the right query...
if ( ! $query->is_home() ) { if (!$query->is_home()) {
return; return;
} }
//set post_per_page if it's homepage //set post_per_page if it's homepage
if (! $query->is_paged ) { if (!$query->is_paged) {
$query->set('posts_per_page',14); $query->set('posts_per_page', 14);
} } else {
else {
return; return;
} }
} }

BIN
img/arrow-black-left.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 350 B

After

Width:  |  Height:  |  Size: 336 B

63
img/arrow-black-left.svg
View File

@@ -1,63 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="22.553785mm"
height="43.706402mm"
viewBox="0 0 22.553785 43.706401"
version="1.1"
id="svg229"
inkscape:version="0.92.3 (2405546, 2018-03-11)"
sodipodi:docname="arrow-black-left.svg">
<defs
id="defs223" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="2.8"
inkscape:cx="65.998897"
inkscape:cy="91.281272"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="2238"
inkscape:window-height="1373"
inkscape:window-x="567"
inkscape:window-y="39"
inkscape:window-maximized="0"
inkscape:pagecheckerboard="true" />
<metadata
id="metadata226">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(576.91639,-151.73948)">
<path
d="m -554.73679,152.11365 -21.43125,21.4316 0.0476,0.0476 -0.0476,0.0476 21.43125,21.43125"
style="fill:none;stroke:#000000;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
id="path212"
inkscape:connector-curvature="0" />
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.0 KiB

BIN
img/arrow-black-right.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 196 B

After

Width:  |  Height:  |  Size: 337 B

63
img/arrow-black-right.svg
View File

@@ -1,63 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="22.553785mm"
height="43.706402mm"
viewBox="0 0 22.553785 43.706401"
version="1.1"
id="svg229"
inkscape:version="0.92.3 (2405546, 2018-03-11)"
sodipodi:docname="arrow-black-right.svg">
<defs
id="defs223" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="2.8"
inkscape:cx="65.998897"
inkscape:cy="91.281272"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="2238"
inkscape:window-height="1373"
inkscape:window-x="567"
inkscape:window-y="39"
inkscape:window-maximized="0"
inkscape:pagecheckerboard="true" />
<metadata
id="metadata226">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(576.91639,-151.73948)">
<path
d="m -576.54221,152.11365 21.43125,21.4316 -0.0476,0.0476 0.0476,0.0476 -21.43125,21.43125"
style="fill:none;stroke:#000000;stroke-width:1.05833328;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
id="path212"
inkscape:connector-curvature="0" />
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.0 KiB

57
img/clip/be_desktop.svg
View File

@@ -1,50 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg <svg xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#" xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" id="Layer_1" x="0px" y="0px" width="100" height="100" viewBox="0 0 100 99.999997" enable-background="new 0 0 479.621 491.252" xml:space="preserve" sodipodi:docname="be_desktop.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
version="1.1" <metadata id="metadata9">
id="Layer_1" <rdf:RDF>
x="0px" <cc:Work rdf:about="">
y="0px" <dc:format>image/svg+xml</dc:format>
width="479.621px" <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
height="491.252px" </cc:Work>
viewBox="0 0 479.621 491.252" </rdf:RDF>
enable-background="new 0 0 479.621 491.252" </metadata>
xml:space="preserve" <defs id="defs7" />
sodipodi:docname="be_desktop.svg" <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1415" inkscape:window-height="954" id="namedview5" showgrid="false" inkscape:zoom="0.48040515" inkscape:cx="136.7731" inkscape:cy="212.32121" inkscape:window-x="946" inkscape:window-y="216" inkscape:window-maximized="0" inkscape:current-layer="Layer_1" />
inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata <clipPath id="clipper" clipPathUnits="objectBoundingBox">
id="metadata9"><rdf:RDF><cc:Work <path id="svgPath" d="M 77.433483,75.667378 C 54.307747,99.215178 23.63064,107.15327 8.4000886,92.895608 -6.8306716,78.637748 -0.84741189,47.583218 22.278323,24.035208 45.404268,0.48720829 76.49837,-7.0439617 91.728922,7.2138983 106.95947,21.471348 100.55943,52.119578 77.433483,75.667378 Z" />
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type </clipPath>
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs <path id="svgMask" d="M 77.433483,75.667378 C 54.307747,99.215178 23.63064,107.15327 8.4000886,92.895608 -6.8306716,78.637748 -0.84741189,47.583218 22.278323,24.035208 45.404268,0.48720829 76.49837,-7.0439617 91.728922,7.2138983 106.95947,21.471348 100.55943,52.119578 77.433483,75.667378 Z" />
id="defs7" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1581"
inkscape:window-height="894"
id="namedview5"
showgrid="false"
inkscape:zoom="0.48040515"
inkscape:cx="-40.161515"
inkscape:cy="245.62601"
inkscape:window-x="876"
inkscape:window-y="342"
inkscape:window-maximized="0"
inkscape:current-layer="Layer_1" />
<path
d="M371.387,371.718c-110.916,115.679-258.05,154.675-331.099,84.634c-73.05-70.042-44.353-222.598,66.563-338.278 c110.917-115.68,260.051-152.677,333.1-82.635C513,105.479,482.304,256.039,371.387,371.718z"
id="path2"
style="fill:none" />
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

57
img/clip/do_desktop.svg
View File

@@ -1,50 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg <svg xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#" xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" id="Layer_1" x="0px" y="0px" width="100" height="100" viewBox="0 0 99.999999 99.999998" enable-background="new 0 0 480.604 508.191" xml:space="preserve" sodipodi:docname="do_desktop.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
version="1.1" <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1491" inkscape:window-height="1019" id="namedview5" showgrid="false" inkscape:zoom="2.6269996" inkscape:cx="-45.728655" inkscape:cy="12.034621" inkscape:window-x="1337" inkscape:window-y="129" inkscape:window-maximized="0" inkscape:current-layer="Layer_1" />
id="Layer_1" <metadata id="metadata9">
x="0px" <rdf:RDF>
y="0px" <cc:Work rdf:about="">
width="480.604px" <dc:format>image/svg+xml</dc:format>
height="508.191px" <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
viewBox="0 0 480.604 508.191" </cc:Work>
enable-background="new 0 0 480.604 508.191" </rdf:RDF>
xml:space="preserve" </metadata>
sodipodi:docname="do_desktop.svg" <defs id="defs7" />
inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata <clipPath id="clipper" clipPathUnits="objectBoundingBox">
id="metadata9"><rdf:RDF><cc:Work <path id="svgPath" d="M 0,42.689068 4.4951769,69.521499 V 100 H 100 V 69.302881 H 35.776648 L 99.403043,60.64216 95.020641,34.524028 98.399098,34.887474 99.484815,3.8493401 1.5676108,0 0.48230976,31.029082 68.336302,33.427393 Z"/>
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type </clipPath>
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs <path id="svgMask" d="M 0,42.689068 4.4951769,69.521499 V 100 H 100 V 69.302881 H 35.776648 L 99.403043,60.64216 95.020641,34.524028 98.399098,34.887474 99.484815,3.8493401 1.5676108,0 0.48230976,31.029082 68.336302,33.427393 Z"/>
id="defs7" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="2238"
inkscape:window-height="1373"
id="namedview5"
showgrid="false"
inkscape:zoom="0.46439232"
inkscape:cx="240.302"
inkscape:cy="167.96144"
inkscape:window-x="567"
inkscape:window-y="33"
inkscape:window-maximized="0"
inkscape:current-layer="Layer_1" />
<polygon
points="478.128,19.562 7.534,0 2.318,157.687 328.427,169.875 0,216.942 21.604,353.302 21.604,508.191 480.604,508.191 480.604,352.191 171.944,352.191 477.735,308.178 456.673,175.448 472.91,177.295 "
id="polygon2"
style="fill:none" />
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 2.0 KiB

32
img/clip/love_desktop.svg
View File

@@ -1,11 +1,25 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" <svg xmlns:dc="http://purl.org/dc/elements/1.1/"
width="482.14px" height="500.987px" viewBox="0 0 482.14 500.987" enable-background="new 0 0 482.14 500.987" xmlns:cc="http://creativecommons.org/ns#"
xml:space="preserve"> xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
<path d="M482.127,146.707c0-80.767-65.475-146.242-146.242-146.242S189.643,65.939,189.643,146.707 xmlns:svg="http://www.w3.org/2000/svg"
c0,27.829,7.773,53.84,21.267,75.985c-19.588-9.74-41.663-15.227-65.024-15.227c-80.768,0-146.242,65.481-146.242,146.249 xmlns="http://www.w3.org/2000/svg"
C-0.357,434.48,65.295,501,146.063,501c0.164,0-0.102,0,0.063,0H146h336V152.578C482.077,150.629,482.127,148.674,482.127,146.707z" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
/> xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" id="Layer_1" x="0px" y="0px" width="100" height="100" viewBox="0 0 99.999997 100" enable-background="new 0 0 482.14 500.987" xml:space="preserve" sodipodi:docname="love_desktop.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
<metadata id="metadata9">
<rdf:RDF>
<cc:Work rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs id="defs7" />
<sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1633" inkscape:window-height="1080" id="namedview5" showgrid="false" inkscape:zoom="0.66619374" inkscape:cx="412.21122" inkscape:cy="206.63424" inkscape:window-x="1417" inkscape:window-y="87" inkscape:window-maximized="0" inkscape:current-layer="Layer_1" />
<clipPath id="clipper" clipPathUnits="objectBoundingBox">
<path id="svgPath" d="M 99.999996,29.21714 C 99.999996,13.081 86.42957,0 69.689706,0 52.949843,0 39.379417,13.0808 39.379417,29.21714 c 0,5.55985 1.611041,10.75649 4.407823,15.18075 C 39.727409,42.45198 35.152118,41.35575 30.31029,41.35575 13.570219,41.35575 0,54.43795 0,70.57429 -2.0726027e-4,86.71022 13.606904,100 30.346975,100 c 0.034,0 -0.02114,0 0.01306,0 h -0.02611 69.639757 V 30.39008 C 99.989636,30.0007 100,29.61012 100,29.21714 Z" />
</clipPath>
<path id="svgMask" d="M 99.999996,29.21714 C 99.999996,13.081 86.42957,0 69.689706,0 52.949843,0 39.379417,13.0808 39.379417,29.21714 c 0,5.55985 1.611041,10.75649 4.407823,15.18075 C 39.727409,42.45198 35.152118,41.35575 30.31029,41.35575 13.570219,41.35575 0,54.43795 0,70.57429 -2.0726027e-4,86.71022 13.606904,100 30.346975,100 c 0.034,0 -0.02114,0 0.01306,0 h -0.02611 69.639757 V 30.39008 C 99.989636,30.0007 100,29.61012 100,29.21714 Z" />
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 860 B

After

Width:  |  Height:  |  Size: 2.4 KiB

42
img/clip/think_desktop.svg
View File

@@ -1,21 +1,25 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" <svg xmlns:dc="http://purl.org/dc/elements/1.1/"
width="480.604px" height="508.191px" viewBox="0 0 480.604 508.191" enable-background="new 0 0 480.604 508.191" xmlns:cc="http://creativecommons.org/ns#"
xml:space="preserve"> xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
<g> xmlns:svg="http://www.w3.org/2000/svg"
<path d="M157.37,504.649c-21.766,0-40.662-10.704-53.304-30.228c-12.774-19.729-18.128-43.268-15.483-68.074 xmlns="http://www.w3.org/2000/svg"
c4.791-44.932,56.885-110.12,124.885-161.454c-5.11,3.028-58.156,42.543-63.357,44.827c-67.976,29.84-104.094,9.252-123.959-17.361 xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
C5.629,244.871-2.007,211.181,4.647,177.493c9.012-45.631,43.854-87.465,106.52-127.896c40.184-25.926,78.125-42.424,79.721-43.115 xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" id="Layer_1" x="0px" y="0px" width="100" height="100" viewBox="0 0 99.999999 99.999998" enable-background="new 0 0 480.604 508.191" xml:space="preserve" sodipodi:docname="think_desktop.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
c22.336-9.655,46.672,5.25,54.361,33.291c7.689,28.041-4.182,58.598-26.515,68.254c-1.062,0.462-33.673,14.777-67.445,36.43 <metadata id="metadata11">
c-39.336,25.223-56.078,44.983-61.582,54.496c3.782,0.374,14.882-0.415,38.956-14.669c25.422-15.053,58.412-36.367,87.472-57.389 <rdf:RDF>
c31.333-22.667,124.667-89.333,150.499-106.565c15.85-10.573,30.441-13.968,43.533-14.576 <cc:Work rdf:about="">
c22.599-1.048,41.859,10.331,54.311,32.041c10.973,19.134,15.166,41.564,12.127,64.865 <dc:format>image/svg+xml</dc:format>
c-7.918,60.71-140.398,155.558-205.796,214.436c-16.319,14.691-33.007,29.715-48.003,44.228 <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
c8.253-5.712,16.791-11.771,25.524-17.968c72.62-51.53,141.209-100.202,192.188-59.58c28.341,22.584,40.841,65.422,37.151,127.322 </cc:Work>
c-1.764,29.574-22.303,51.751-45.84,49.541c-23.555-2.213-41.221-27.981-39.457-57.555c0.759-12.737,0.373-21.103-0.199-26.279 </rdf:RDF>
c-5.468,1.152-15.214,4.4-31.129,13.242c-21.514,11.953-46.482,29.67-70.628,46.804c-30.807,21.861-59.905,42.509-86.327,55.148 </metadata>
c-17.346,8.299-32.287,12.433-45.676,12.643C158.065,504.646,157.715,504.649,157.37,504.649z"/> <defs id="defs9" />
</g> <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="2074" inkscape:window-height="1062" id="namedview7" showgrid="false" inkscape:zoom="2.56" inkscape:cx="8.39166" inkscape:cy="65.978929" inkscape:window-x="1064" inkscape:window-y="234" inkscape:window-maximized="0" inkscape:current-layer="Layer_1" />
<clipPath id="clipper" clipPathUnits="objectBoundingBox">
<path id="svgPath" d="M 32.576974,100 C 28.004237,100 24.034448,97.863929 21.378539,93.967755 18.694898,90.030672 17.570097,85.333272 18.125775,80.383031 19.132298,71.416483 30.076528,58.407684 44.36239,48.163565 43.288849,48.767827 32.144616,56.653368 31.051958,57.109159 16.771139,63.063975 9.1832453,58.955472 5.0098828,53.64463 0.69828342,48.159174 -0.90593487,41.436059 0.49197876,34.713343 2.3852758,25.607303 9.7050994,17.258986 22.870361,9.1906495 31.312465,4.0169041 39.283346,0.72459317 39.618643,0.58669847 44.311129,-1.3400358 49.423787,1.6343789 51.03914,7.23019 c 1.615353,5.595811 -0.878581,11.69371 -5.570436,13.620644 -0.223112,0.0922 -7.074233,2.948871 -14.169264,7.269905 -8.263951,5.033456 -11.781214,8.976726 -12.937528,10.875123 0.794546,0.07463 3.126502,-0.08282 8.184117,-2.927319 C 31.886841,33.064593 38.817585,28.81121 44.92269,24.616098 51.505321,20.092713 71.113507,6.7889668 76.540454,3.3501802 79.870321,1.2402515 82.935689,0.56275149 85.686137,0.44142011 90.433875,0.23228314 94.480136,2.5030557 97.096129,6.8354639 99.401405,10.65381 100.2823,15.1299 99.643845,19.779805 97.980382,31.894983 70.148161,50.822677 56.408943,62.572264 c -3.428397,2.931709 -6.934315,5.929871 -10.084768,8.826059 1.733841,-1.139876 3.527558,-2.348999 5.36224,-3.585661 15.256461,-10.283233 29.666064,-19.996129 40.376049,-11.889677 5.954053,4.506822 8.580126,13.055496 7.804912,25.408147 -0.370592,5.901734 -4.685552,10.327336 -9.630351,9.886312 -4.948581,-0.441622 -8.659964,-5.583837 -8.289372,-11.485571 0.159455,-2.541772 0.07836,-4.211276 -0.04181,-5.244189 -1.148751,0.229891 -3.196252,0.878056 -6.539774,2.642549 -4.519794,2.385319 -9.765227,5.920891 -14.837968,9.340121 -6.472126,4.362542 -12.585215,8.483019 -18.136113,11.005235 -3.644155,1.656133 -6.783053,2.481107 -9.595897,2.523014 -0.07311,7.98e-4 -0.14664,0.0014 -0.21912,0.0014 z"/>
</clipPath>
<path id="svgMask" d="M 32.576974,100 C 28.004237,100 24.034448,97.863929 21.378539,93.967755 18.694898,90.030672 17.570097,85.333272 18.125775,80.383031 19.132298,71.416483 30.076528,58.407684 44.36239,48.163565 43.288849,48.767827 32.144616,56.653368 31.051958,57.109159 16.771139,63.063975 9.1832453,58.955472 5.0098828,53.64463 0.69828342,48.159174 -0.90593487,41.436059 0.49197876,34.713343 2.3852758,25.607303 9.7050994,17.258986 22.870361,9.1906495 31.312465,4.0169041 39.283346,0.72459317 39.618643,0.58669847 44.311129,-1.3400358 49.423787,1.6343789 51.03914,7.23019 c 1.615353,5.595811 -0.878581,11.69371 -5.570436,13.620644 -0.223112,0.0922 -7.074233,2.948871 -14.169264,7.269905 -8.263951,5.033456 -11.781214,8.976726 -12.937528,10.875123 0.794546,0.07463 3.126502,-0.08282 8.184117,-2.927319 C 31.886841,33.064593 38.817585,28.81121 44.92269,24.616098 51.505321,20.092713 71.113507,6.7889668 76.540454,3.3501802 79.870321,1.2402515 82.935689,0.56275149 85.686137,0.44142011 90.433875,0.23228314 94.480136,2.5030557 97.096129,6.8354639 99.401405,10.65381 100.2823,15.1299 99.643845,19.779805 97.980382,31.894983 70.148161,50.822677 56.408943,62.572264 c -3.428397,2.931709 -6.934315,5.929871 -10.084768,8.826059 1.733841,-1.139876 3.527558,-2.348999 5.36224,-3.585661 15.256461,-10.283233 29.666064,-19.996129 40.376049,-11.889677 5.954053,4.506822 8.580126,13.055496 7.804912,25.408147 -0.370592,5.901734 -4.685552,10.327336 -9.630351,9.886312 -4.948581,-0.441622 -8.659964,-5.583837 -8.289372,-11.485571 0.159455,-2.541772 0.07836,-4.211276 -0.04181,-5.244189 -1.148751,0.229891 -3.196252,0.878056 -6.539774,2.642549 -4.519794,2.385319 -9.765227,5.920891 -14.837968,9.340121 -6.472126,4.362542 -12.585215,8.483019 -18.136113,11.005235 -3.644155,1.656133 -6.783053,2.481107 -9.595897,2.523014 -0.07311,7.98e-4 -0.14664,0.0014 -0.21912,0.0014 z"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 5.2 KiB

62
js/myloadmore.js
View File

@@ -1,40 +1,40 @@
jQuery(function ($) { // use jQuery code inside this to avoid "$ is not defined" error jQuery(function ($) { // use jQuery code inside this to avoid "$ is not defined" error
$('.misha_loadmore').click(function () { // $('.misha_loadmore').click(function () {
var button = $(this), // var button = $(this),
data = { // data = {
'action': 'loadmore', // 'action': 'loadmore',
'query': misha_loadmore_params.posts, // that's how we get params from wp_localize_script() function // 'query': misha_loadmore_params.posts, // that's how we get params from wp_localize_script() function
'page': misha_loadmore_params.current_page // 'page': misha_loadmore_params.current_page
}; // };
button.trigger("moreload-start") // button.trigger("moreload-start")
console.log(misha_loadmore_params) // console.log(misha_loadmore_params)
$.ajax({ // you can also use $.post here // $.ajax({ // you can also use $.post here
url: misha_loadmore_params.ajaxurl, // AJAX handler // url: misha_loadmore_params.ajaxurl, // AJAX handler
data: data, // data: data,
type: 'POST', // type: 'POST',
beforeSend: function (xhr) { // beforeSend: function (xhr) {
button.html('<p>Betöltés...</p>'); // change the button text, you can also add a preloader image // button.html('<p>Betöltés...</p>'); // change the button text, you can also add a preloader image
}, // },
success: function (data) { // success: function (data) {
if (data) { // if (data) {
button.html('<a>Tovább</a>').before(data); // insert new posts // button.html('<a>Mutass többet</a>').before(data); // insert new posts
misha_loadmore_params.current_page++; // misha_loadmore_params.current_page++;
button.trigger("moreload-finish") // button.trigger("moreload-finish")
if (misha_loadmore_params.current_page -1 == misha_loadmore_params.max_page) // if (misha_loadmore_params.current_page -1 == misha_loadmore_params.max_page)
button.remove(); // if last page, remove the button // button.remove(); // if last page, remove the button
// you can also fire the "post-load" event here if you use a plugin that requires it // // you can also fire the "post-load" event here if you use a plugin that requires it
// $( document.body ).trigger( 'post-load' ); // // $( document.body ).trigger( 'post-load' );
} else { // } else {
button.remove(); // if no data, remove the button as well // button.remove(); // if no data, remove the button as well
} // }
} // }
}); // });
}); // });
}); });

104
js/scripts.js
View File

@@ -203,12 +203,6 @@
$(".home-wrapper-small").each(function () { $(".home-wrapper-small").each(function () {
// var rn = randomNumbers()
// for (let i = 0; i < rn.length; i++) {
// var j = rn[i] +1
// $(this).children("article:nth-child(" + j + ")").addClass("random")
// }
// addRandomClass($(this))
$(this).addRandomClasses() $(this).addRandomClasses()
}) })
@@ -242,14 +236,25 @@
nextelem = target nextelem = target
} }
// var offset = ($(nextelem).offset().left) - desktophomemargin
var offset = ($(nextelem).position().left) var offset = ($(nextelem).position().left)
//if loadmore is the next, do not scroll, but load
if ($(nextelem).attr("class") == "misha_loadmore") {
loadmore()
return target
} else {
//from the third wrap modify the offset
var wNum = parseInt($(nextelem).attr("class").split(" ")[1].split("-")[2])
if (wNum > 3) {
offset = offset - desktophomemargin
}
}
console.log("scrolling to: " + nextelem.attr("class") + " - offset: " + offset) console.log("scrolling to: " + nextelem.attr("class") + " - offset: " + offset)
$('html, body').stop().animate({ scrollLeft: offset }, 800); $('html, body, .wrapper').stop().animate({ scrollLeft: offset }, 800);
return nextelem; return nextelem;
} }
//extractDelta(e): extract the scroll length from an event //extractDelta(e): extract the scroll direction and length from an event
function extractDelta(e) { function extractDelta(e) {
if (e.wheelDelta) { if (e.wheelDelta) {
return e.wheelDelta; return e.wheelDelta;
@@ -268,11 +273,12 @@
} }
} }
var currElem = $('article:first-child') const selector = 'main>#content>div'
var currElem = $(selector + ':first-child')
//checking the current scroll location for refresh: //checking the current scroll location for refresh:
if (isHome & !isMobile) { if (isHome & !isMobile) {
var selector = 'main>#content>div'
var articleWidth = $(selector + ':first-child')[0].getBoundingClientRect().width var articleWidth = $(selector + ':first-child')[0].getBoundingClientRect().width
var currscroll = $('html').scrollLeft() var currscroll = $('html').scrollLeft()
var scrollnr = Math.floor(currscroll / articleWidth) + 1 var scrollnr = Math.floor(currscroll / articleWidth) + 1
@@ -333,8 +339,83 @@
currElem = homeScroll(currElem, "next") currElem = homeScroll(currElem, "next")
}) })
/* ----------------------------- loadmore click ----------------------------- */
$('.misha_loadmore').click(function (e) {
e.preventDefault()
loadmore($(this))
});
var noMoreAjax = false
function loadmore(element){
if (noMoreAjax) {
console.log("no more ajax")
return false
}
// var button = $(this),
var button = element || $('.misha_loadmore'),
data = {
'action': 'loadmore',
'query': misha_loadmore_params.posts, // that's how we get params from wp_localize_script() function
'page': misha_loadmore_params.current_page
};
button.trigger("moreload-start")
$.ajax({ // you can also use $.post here
url: misha_loadmore_params.ajaxurl, // AJAX handler
data: data,
type: 'POST',
beforeSend: function (xhr) {
button.html('<p>Betöltés...</p>'); // change the button text, you can also add a preloader image
},
success: function (data) {
if (data) {
if (data.length < 100) {
button.children().remove(); // if last page, remove the button
noMoreAjax = true
return false
}
button.html('<a>Mutass többet</a>').before(data); // insert new posts
misha_loadmore_params.current_page++;
button.trigger("moreload-finish")
console.log(data.length)
// you can also fire the "post-load" event here if you use a plugin that requires it
// $( document.body ).trigger( 'post-load' );
} else {
button.children().remove(); // if no data, remove the button as well
noMoreAjax = true
console.log("no data")
}
}
});
}
/* ------------------------------ hover on home ----------------------------- */ /* ------------------------------ hover on home ----------------------------- */
//hover on big articles
$(".home-big h2>a").hover(function () {
let cc = $(this)
//make width more
cc.parents("article").addClass("hovered")
//change bg
// $(this).parents('article').animate({})
//animate metadata
//show excerpt
}, function () {
let cc = $(this)
//width back to normal
cc.parents("article").removeClass("hovered")
})
//hover on small articles
function showTitle(th) { function showTitle(th) {
$(th).children("h2").show() $(th).children("h2").show()
$(th).children(".metadata").addClass("vis") $(th).children(".metadata").addClass("vis")
@@ -358,6 +439,7 @@
} }
}, '.home-small'); }, '.home-small');
//touch on small articles
$(document).on({ $(document).on({
'touchend': function (e) { 'touchend': function (e) {
e.preventDefault() e.preventDefault()

2
loadmore.php
View File

@@ -3,5 +3,5 @@
// don't display the button if there are not enough posts // don't display the button if there are not enough posts
if ( $wp_query->max_num_pages > 1 ) if ( $wp_query->max_num_pages > 1 )
echo '<div class="misha_loadmore"><a>Tovább</a></div>'; // you can use <a> as well echo '<div class="misha_loadmore"><a>Mutass többet</a></div>'; // you can use <a> as well
?> ?>

2
loop.php
View File

@@ -9,7 +9,7 @@
<!-- post thumbnail --> <!-- post thumbnail -->
<?php if (has_post_thumbnail()): // Check if thumbnail exists ?> <?php if (has_post_thumbnail()): // Check if thumbnail exists ?>
<a class="thumbnailwrapper" href="<?php the_permalink();?>" title="<?php the_title();?>"> <a class="thumbnailwrapper" href="<?php the_permalink();?>" title="<?php the_title();?>">
<?php if(is_home() and $qc < 3): ; <?php if(is_home() and $qc < 3): ; //first two posts are big
the_post_thumbnail('home-big-thumbnail'); the_post_thumbnail('home-big-thumbnail');
else: else:
the_post_thumbnail('home-square-thumbnail'); the_post_thumbnail('home-square-thumbnail');

12
sass/_font-mixins.scss
View File

@@ -25,6 +25,18 @@
} }
} }
@mixin home-more {
font: bold 3rem "Westeinde Caption";
color: #fff;
-webkit-text-stroke: #000 1px;
@media #{$mobile-landscape} {
font-size: 2rem !important;
}
@media #{$smalldesktop} {
font-size: 3rem;
}
}
@mixin home-title-small { @mixin home-title-small {
@media #{$smalldesktop} { @media #{$smalldesktop} {
font-size: 1.2rem; font-size: 1.2rem;

92
sass/base.scss
View File

@@ -310,7 +310,7 @@ $desktop-bottom-margin-double: 4rem;
// color: #000; // color: #000;
// fill: currentColor; // fill: currentColor;
filter: invert(100%); //black filter: invert(100%); //black
@include transform(rotate(180deg)) // transform: rotate(180deg);; @include transform(rotate(180deg)) // transform: rotate(180deg);;;;;;;;;;;
} }
} }
} }
@@ -536,18 +536,24 @@ $desktop-bottom-margin-double: 4rem;
/* -------------------------------- load more ------------------------------- */ /* -------------------------------- load more ------------------------------- */
.misha_loadmore { .misha_loadmore {
@include home-title();
@media #{$smalldesktop} { @media #{$smalldesktop} {
border-left: #000 1px solid; width: $desktop-home-margin;
padding: $desktop-top-margin $desktop-home-margin; margin-right: $desktop-home-margin;
align-self: stretch; align-self: stretch;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
justify-content: space-around; justify-content: center;
align-items: center;
height: 100%; height: 100%;
} }
a { a,
p {
@include home-more();
@media #{$smalldesktop} { @media #{$smalldesktop} {
transform-origin: center;
white-space: nowrap;
width: 100vh;
@include transform(rotate(-90deg));
} }
} }
} }
@@ -555,6 +561,11 @@ $desktop-bottom-margin-double: 4rem;
} }
} //wrapper end } //wrapper end
//no header scroll on touch devices(because it's invisible)
.touchevents .header-scroll {
display: none !important;
}
/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */
/* HOMEPAGE */ /* HOMEPAGE */
/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */
@@ -585,14 +596,12 @@ $desktop-bottom-margin-double: 4rem;
&.header-scroll-left { &.header-scroll-left {
left: $desktop-home-margin; left: $desktop-home-margin;
button { button {
// cursor: url("../img/arrow-black-left.svg"), url("../img/arrow-black-left.png"), w-resize, auto;
cursor: url("../img/arrow-black-left.png"), w-resize; cursor: url("../img/arrow-black-left.png"), w-resize;
} }
} }
&.header-scroll-right { &.header-scroll-right {
right: $desktop-home-margin; right: $desktop-home-margin;
button { button {
// cursor: url("../img/arrow-black-right.svg"), url("../img/arrow-black-right.png"), e-resize, auto;
cursor: url("../img/arrow-black-right.png"), e-resize; cursor: url("../img/arrow-black-right.png"), e-resize;
} }
} }
@@ -673,19 +682,15 @@ $desktop-bottom-margin-double: 4rem;
margin-left: $desktop-home-margin; margin-left: $desktop-home-margin;
padding-top: $desktop-top-margin; padding-top: $desktop-top-margin;
border-right: #000 1px solid; border-right: #000 1px solid;
&::before {
//this is the border on top
content: "<hr>";
display: block;
height: 1px;
width: 100%;
background: #000;
}
/* -------------------------------- thumbnail and title ------------------------------- */ /* -------------------------------- thumbnail and title ------------------------------- */
.thumbnailwrapper { .thumbnailwrapper {
height: calc(100% - #{$desktop-top-margin}); height: calc(100% - #{$desktop-top-margin});
img.attachment-home-thumbnail { display: flex;
flex-direction: row;
justify-content: flex-start;
border-top: 1px #000 solid;
img.attachment-home-big-thumbnail {
object-fit: cover; object-fit: cover;
width: 50%; width: 50%;
height: 100%; height: 100%;
@@ -727,13 +732,22 @@ $desktop-bottom-margin-double: 4rem;
display: block; display: block;
border-right: #000 solid 1px; border-right: #000 solid 1px;
} }
.postedon {
}
} //metadata end } //metadata end
/* ------------------------- home article big hover ------------------------- */
&.hovered {
width: calc(100vw - (#{$desktop-home-margin} * 2));
h2>a{
color: #000;
}
}
} }
} }
.home-wrapper-1 { .home-wrapper-1 {
article { article {
a.thumbnailwrapper {
justify-content: flex-end;
}
} }
} }
.home-wrapper-2 { .home-wrapper-2 {
@@ -749,6 +763,7 @@ $desktop-bottom-margin-double: 4rem;
.home-wrapper-small { .home-wrapper-small {
width: calc(100vw - (#{$desktop-home-margin} * 3)); width: calc(100vw - (#{$desktop-home-margin} * 3));
height: calc((100vw - (#{$desktop-home-margin} * 3)) / 3 * 2); height: calc((100vw - (#{$desktop-home-margin} * 3)) / 3 * 2);
flex-shrink: 0;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
@@ -772,7 +787,6 @@ $desktop-bottom-margin-double: 4rem;
} }
.metadata { .metadata {
width: 100%; width: 100%;
height: 20%; height: 20%;
@@ -789,7 +803,7 @@ $desktop-bottom-margin-double: 4rem;
align-items: stretch; align-items: stretch;
@include triangle-corner-bordered(#{$desktop-bottom-margin-double}, 0, transparent); @include triangle-corner-bordered(#{$desktop-bottom-margin-double}, 0, transparent);
display: none; display: none;
&.vis{ &.vis {
display: flex; display: flex;
} }
} }
@@ -1069,9 +1083,12 @@ $desktop-bottom-margin-double: 4rem;
@media #{$smalldesktop} { @media #{$smalldesktop} {
&.home-big { &.home-big {
h2 a { h2 a {
color: $color !important; color: $color;
} }
} }
&.home-big.hovered{
background-color: $color !important;
}
&.home-small { &.home-small {
.metadata, .metadata,
.metadata a { .metadata a {
@@ -1081,10 +1098,17 @@ $desktop-bottom-margin-double: 4rem;
} }
} }
@mixin tagclip($tag){ @mixin tagclip($tag) {
@media #{$smalldesktop} { @media #{$smalldesktop} {
.thumbnailwrapper>img{ .thumbnailwrapper > img {
clip-path: url(../img/clip/#{$tag}_desktop.svg) -webkit-mask: url(../img/clip/#{$tag}_desktop.svg);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 100%;
// -webkit-clip-path: url(../img/clip/#{$tag}_desktop.svg);
// clip-path: url(../img/clip/#{$tag}_desktop.svg#clipper);
mask: url(../img/clip/#{$tag}_desktop.svg);
mask-repeat: no-repeat;
mask-size: 100%;
} }
} }
} }
@@ -1106,29 +1130,29 @@ $desktop-bottom-margin-double: 4rem;
.tag-be { .tag-be {
@include tagcolors(#00ffb8); @include tagcolors(#00ffb8);
&.random{ &.random {
@include tagclip(be) @include tagclip(be);
} }
} }
.tag-do { .tag-do {
@include tagcolors(#ff5f5f); @include tagcolors(#ff5f5f);
&.random{ &.random {
@include tagclip(do) @include tagclip(do);
} }
} }
.tag-think { .tag-think {
@include tagcolors(#fdff00); @include tagcolors(#fdff00);
&.random{ &.random {
@include tagclip(think) @include tagclip(think);
} }
} }
.tag-love { .tag-love {
@include tagcolors(#3c00ff); @include tagcolors(#3c00ff);
&.random{ &.random {
@include tagclip(love) @include tagclip(love);
} }
} }