From 43e6e9b37349f8a08b5ac475a049535930536d16 Mon Sep 17 00:00:00 2001 From: infeeeee Date: Tue, 2 Jul 2019 03:46:02 +0200 Subject: [PATCH] worked on a lot of things --- .vscode/globalsnippets.code-snippets | 8 + ChromePhp.php | 446 +++++++++++++++++++++++++++ KÉZIKÖNYV.md | 23 +- _jegyzet.md | 84 +---- _teendők.md | 29 ++ category-esemeny.php | 44 ++- css/base.css | 164 ++++++++-- functions.php | 34 +- header.php | 8 +- js/scripts.js | 45 ++- sass/_font-mixins.scss | 5 +- sass/base.scss | 131 +++++++- 12 files changed, 860 insertions(+), 161 deletions(-) create mode 100644 ChromePhp.php create mode 100644 _teendők.md diff --git a/.vscode/globalsnippets.code-snippets b/.vscode/globalsnippets.code-snippets index f2cb1a5..091f065 100644 --- a/.vscode/globalsnippets.code-snippets +++ b/.vscode/globalsnippets.code-snippets @@ -58,6 +58,14 @@ "?>" ], "description": "HTML: div start and end" + }, + "chromephp-log": { + "scope":"html,php", + "prefix": "log", + "body": [ + "ChromePhp::log($0);" + ], + "description": "Log to js console with Chromephp addin" } diff --git a/ChromePhp.php b/ChromePhp.php new file mode 100644 index 0000000..577b1ce --- /dev/null +++ b/ChromePhp.php @@ -0,0 +1,446 @@ + + */ +class ChromePhp +{ + /** + * @var string + */ + const VERSION = '4.1.0'; + + /** + * @var string + */ + const HEADER_NAME = 'X-ChromeLogger-Data'; + + /** + * @var string + */ + const BACKTRACE_LEVEL = 'backtrace_level'; + + /** + * @var string + */ + const LOG = 'log'; + + /** + * @var string + */ + const WARN = 'warn'; + + /** + * @var string + */ + const ERROR = 'error'; + + /** + * @var string + */ + const GROUP = 'group'; + + /** + * @var string + */ + const INFO = 'info'; + + /** + * @var string + */ + const GROUP_END = 'groupEnd'; + + /** + * @var string + */ + const GROUP_COLLAPSED = 'groupCollapsed'; + + /** + * @var string + */ + const TABLE = 'table'; + + /** + * @var string + */ + protected $_php_version; + + /** + * @var int + */ + protected $_timestamp; + + /** + * @var array + */ + protected $_json = array( + 'version' => self::VERSION, + 'columns' => array('log', 'backtrace', 'type'), + 'rows' => array() + ); + + /** + * @var array + */ + protected $_backtraces = array(); + + /** + * @var bool + */ + protected $_error_triggered = false; + + /** + * @var array + */ + protected $_settings = array( + self::BACKTRACE_LEVEL => 1 + ); + + /** + * @var ChromePhp + */ + protected static $_instance; + + /** + * Prevent recursion when working with objects referring to each other + * + * @var array + */ + protected $_processed = array(); + + /** + * constructor + */ + private function __construct() + { + $this->_php_version = phpversion(); + $this->_timestamp = $this->_php_version >= 5.1 ? $_SERVER['REQUEST_TIME'] : time(); + $this->_json['request_uri'] = $_SERVER['REQUEST_URI']; + } + + /** + * gets instance of this class + * + * @return ChromePhp + */ + public static function getInstance() + { + if (self::$_instance === null) { + self::$_instance = new self(); + } + return self::$_instance; + } + + /** + * logs a variable to the console + * + * @param mixed $data,... unlimited OPTIONAL number of additional logs [...] + * @return void + */ + public static function log() + { + $args = func_get_args(); + return self::_log('', $args); + } + + /** + * logs a warning to the console + * + * @param mixed $data,... unlimited OPTIONAL number of additional logs [...] + * @return void + */ + public static function warn() + { + $args = func_get_args(); + return self::_log(self::WARN, $args); + } + + /** + * logs an error to the console + * + * @param mixed $data,... unlimited OPTIONAL number of additional logs [...] + * @return void + */ + public static function error() + { + $args = func_get_args(); + return self::_log(self::ERROR, $args); + } + + /** + * sends a group log + * + * @param string value + */ + public static function group() + { + $args = func_get_args(); + return self::_log(self::GROUP, $args); + } + + /** + * sends an info log + * + * @param mixed $data,... unlimited OPTIONAL number of additional logs [...] + * @return void + */ + public static function info() + { + $args = func_get_args(); + return self::_log(self::INFO, $args); + } + + /** + * sends a collapsed group log + * + * @param string value + */ + public static function groupCollapsed() + { + $args = func_get_args(); + return self::_log(self::GROUP_COLLAPSED, $args); + } + + /** + * ends a group log + * + * @param string value + */ + public static function groupEnd() + { + $args = func_get_args(); + return self::_log(self::GROUP_END, $args); + } + + /** + * sends a table log + * + * @param string value + */ + public static function table() + { + $args = func_get_args(); + return self::_log(self::TABLE, $args); + } + + /** + * internal logging call + * + * @param string $type + * @return void + */ + protected static function _log($type, array $args) + { + // nothing passed in, don't do anything + if (count($args) == 0 && $type != self::GROUP_END) { + return; + } + + $logger = self::getInstance(); + + $logger->_processed = array(); + + $logs = array(); + foreach ($args as $arg) { + $logs[] = $logger->_convert($arg); + } + + $backtrace = debug_backtrace(false); + $level = $logger->getSetting(self::BACKTRACE_LEVEL); + + $backtrace_message = 'unknown'; + if (isset($backtrace[$level]['file']) && isset($backtrace[$level]['line'])) { + $backtrace_message = $backtrace[$level]['file'] . ' : ' . $backtrace[$level]['line']; + } + + $logger->_addRow($logs, $backtrace_message, $type); + } + + /** + * converts an object to a better format for logging + * + * @param Object + * @return array + */ + protected function _convert($object) + { + // if this isn't an object then just return it + if (!is_object($object)) { + return $object; + } + + //Mark this object as processed so we don't convert it twice and it + //Also avoid recursion when objects refer to each other + $this->_processed[] = $object; + + $object_as_array = array(); + + // first add the class name + $object_as_array['___class_name'] = get_class($object); + + // loop through object vars + $object_vars = get_object_vars($object); + foreach ($object_vars as $key => $value) { + + // same instance as parent object + if ($value === $object || in_array($value, $this->_processed, true)) { + $value = 'recursion - parent object [' . get_class($value) . ']'; + } + $object_as_array[$key] = $this->_convert($value); + } + + $reflection = new ReflectionClass($object); + + // loop through the properties and add those + foreach ($reflection->getProperties() as $property) { + + // if one of these properties was already added above then ignore it + if (array_key_exists($property->getName(), $object_vars)) { + continue; + } + $type = $this->_getPropertyKey($property); + + if ($this->_php_version >= 5.3) { + $property->setAccessible(true); + } + + try { + $value = $property->getValue($object); + } catch (ReflectionException $e) { + $value = 'only PHP 5.3 can access private/protected properties'; + } + + // same instance as parent object + if ($value === $object || in_array($value, $this->_processed, true)) { + $value = 'recursion - parent object [' . get_class($value) . ']'; + } + + $object_as_array[$type] = $this->_convert($value); + } + return $object_as_array; + } + + /** + * takes a reflection property and returns a nicely formatted key of the property name + * + * @param ReflectionProperty + * @return string + */ + protected function _getPropertyKey(ReflectionProperty $property) + { + $static = $property->isStatic() ? ' static' : ''; + if ($property->isPublic()) { + return 'public' . $static . ' ' . $property->getName(); + } + + if ($property->isProtected()) { + return 'protected' . $static . ' ' . $property->getName(); + } + + if ($property->isPrivate()) { + return 'private' . $static . ' ' . $property->getName(); + } + } + + /** + * adds a value to the data array + * + * @var mixed + * @return void + */ + protected function _addRow(array $logs, $backtrace, $type) + { + // if this is logged on the same line for example in a loop, set it to null to save space + if (in_array($backtrace, $this->_backtraces)) { + $backtrace = null; + } + + // for group, groupEnd, and groupCollapsed + // take out the backtrace since it is not useful + if ($type == self::GROUP || $type == self::GROUP_END || $type == self::GROUP_COLLAPSED) { + $backtrace = null; + } + + if ($backtrace !== null) { + $this->_backtraces[] = $backtrace; + } + + $row = array($logs, $backtrace, $type); + + $this->_json['rows'][] = $row; + $this->_writeHeader($this->_json); + } + + protected function _writeHeader($data) + { + header(self::HEADER_NAME . ': ' . $this->_encode($data)); + } + + /** + * encodes the data to be sent along with the request + * + * @param array $data + * @return string + */ + protected function _encode($data) + { + return base64_encode(utf8_encode(json_encode($data))); + } + + /** + * adds a setting + * + * @param string key + * @param mixed value + * @return void + */ + public function addSetting($key, $value) + { + $this->_settings[$key] = $value; + } + + /** + * add ability to set multiple settings in one call + * + * @param array $settings + * @return void + */ + public function addSettings(array $settings) + { + foreach ($settings as $key => $value) { + $this->addSetting($key, $value); + } + } + + /** + * gets a setting + * + * @param string key + * @return mixed + */ + public function getSetting($key) + { + if (!isset($this->_settings[$key])) { + return null; + } + return $this->_settings[$key]; + } +} diff --git a/KÉZIKÖNYV.md b/KÉZIKÖNYV.md index 5d253b2..14815b4 100644 --- a/KÉZIKÖNYV.md +++ b/KÉZIKÖNYV.md @@ -4,7 +4,7 @@ ### function.php -esemény cat-id-t átírni!! +esemény cat-id-t átírni!! (Line 195) ### wp beállítások @@ -24,23 +24,20 @@ dis-bevezeto: ### Események -dis-esemeny-datum +dis-esemeny-datum: + +- Csak az aktuális dátumnál frissebbek jelennek meg, az elmúlt események azonnal eltűnnek +- Formátumnak a következőnek KELL lennie: yyyy.mm.dd. szóközök nélkül. Tehát pl. így: 2019.07.02. +- Ha nem jelenik meg egy esemény az oldalon, annak két oka lehet: rossz a dátumformátum, már elmúlt a dátum. dis-esemeny-link +- Teljes linket kell beilleszteni, http-től kezdve az elején. Általában ha megosztás gombra kattintasz, vagy kimásolod a címsorból, akkor az jó + + ### BE-DO-THINK-LOVE Tagek -A leírást két helyen is szerkeszteni kell: - -1. Ami a hoverre megjelenik azt itt kell szerkeszteni: - - Megjelenés>Menük>tags (Tag menu)>Választás>Menü elem lenyitása. - - Ha nincs ott a leírás menü, akkor fent: - - Mit lássunk?>Mutassa a bővített menü részleteit-Leírás - -2. Ami a listázott oldalon megjelenik azt itt kell szerkeszteni: +A leírást itt kell szerkeszteni: Bejegyzés>Címkék>Szerkesztés diff --git a/_jegyzet.md b/_jegyzet.md index d804550..398e699 100644 --- a/_jegyzet.md +++ b/_jegyzet.md @@ -1,10 +1,6 @@ # Kérdések -## Általános - -lightbox az a mostani designisso-n sincs, ezen legyen? - ## single ha hosszú a cím, akkor mi legyen? kevesbb látszon a cikkből? Lásd I O cikk @@ -19,86 +15,10 @@ Melyik sarokban vannak a képfeliratok, ha 3 elem jelenik meg egymás mellett? v ## asztali single: Követtem a mobilos analógiát: fent nincs szerző, csak lent, felül a kategóriák vannak -Egyedi esemény oldal van, vagy az csak egy link lista? -# Megbeszélés 2019.05.30. - -Kezdőlap: - -~egér változzon lapozósra~ -~két nagy, utána kicsi rácsban~ -~Nincs gradiens~ -~Hover csak a címen~ -~Nyíl, csak az első cikken~ -~cursor módosítás tekerésre~ -Kis ikonok hover: - ~- maszkok bedo alapján~ - ~- némelyik maszkkal alapból, némelyik sima kép, ~ - ~- hoverre eltűnik a kép, és helyette~ - -Nagycímek: - ~- utána margó~ - -~Excerpt a főoldalon hoverre: külön paraméter, nem excerpt!!~ - -og: tag: pluginnal! - -~Dátumot átírni~ - -Szőveg kilóg a margóra! - -szerzőnek is paraméter, és kattinható - -Single: - - - ~Nem kell carousel a felső oldalra~ - - crop thumbnail a fenti képnél - - állókép körbefut a szöveg!!!! - - galéria: mobilon fix 2, column számot lehessen használni asztalin - -Menü: csík küzépen, két részben, két küön menü - - -BEDO kör: forog, - - ~hover, megáll, fekete megjelenik, nagyszüvegre megy a be-kat-ra~ - - kattintás a szóra: - -Kategória lap: első csempe kimarad. - -Kereső: - - ~teljes lábléc magasságban, hosszabban fusson ki~ - - ~ne legyen hover~, - - ~focus~ - -# Kérdések - -## Kezdőlap - - Animációk? - - Kurzor: Nyíl az nem túl halovány? 32x32 pixel lehet maximum - -# jegyzet 2019.06.12 - -## kezdőlap - ~hover: ne nőjjön meg, csak a szín~ - ~a vonal felcsuszás animálva~ - ~a szélek alá is kerüljön szín~ - ~képre is hover, képre is klikk~ - kép pontosabb arány - alapből lehet hogy több látszódjon - maszkok: mindig csak 2-t sorsol, és nem egymás mellettieket, nem egymás alattiakat - nagyképek lógjanak bele az előzőbe - - -## tag: be do: - háttér is a szín szerint - be do ikon a jobb felső sarokba - -## single: - - képen ne legyen cím +## asztali home +nagy képek, metadata ipad: nem férnek be a rublikába ha hosszúak, mi legy, elég-e csak a design felirat? ## bedo magasság: margin: $v-unit-1 => 4rem diff --git a/_teendők.md b/_teendők.md new file mode 100644 index 0000000..ee86a64 --- /dev/null +++ b/_teendők.md @@ -0,0 +1,29 @@ +# Single + +lightbox + +og: tag: pluginnal! + +szerzőnek is paraméter, és kattinható + +crop thumbnail a fenti képnél + +állókép körbefut a szöveg!!!! + +galéria: mobilon fix 2, column számot lehessen használni asztalin + +képen ne legyen cím + +# Esemény oldal + +# Kezdőlap + +felgördülő szövegkivonat -> felülre igazítva +felgördülő alcím -> pozíciója a kép alsó éléhez igazodik + +alapből lehet hogy több látszódjon + +Kurzor: Nyíl az nem túl halovány? 32x32 pixel lehet maximum + +# Kategória oldalak + diff --git a/category-esemeny.php b/category-esemeny.php index 5a28d78..ef22957 100644 --- a/category-esemeny.php +++ b/category-esemeny.php @@ -4,7 +4,7 @@
- +
> @@ -14,18 +14,50 @@ - +
+ -
+
+
+ +
+ + + + → + + +
+
+ +
+
+ +

+ +

+ + Tovább az eseményre +
+ + + + + + + -

- -

+ diff --git a/css/base.css b/css/base.css index b15042a..a914c11 100644 --- a/css/base.css +++ b/css/base.css @@ -68,6 +68,9 @@ button { object { pointer-events: none; } +/* -------------------------------------------------------------------------- */ +/* MEDIA QUERIES */ +/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */ /* GLOBAL VARIABLES */ /* -------------------------------------------------------------------------- */ @@ -287,10 +290,24 @@ object { position: relative; height: 100%; overflow: auto; - padding: 0 4rem; } + padding: 0 4rem; + padding-bottom: 4rem; } @media (min-width: 769px) { .wrapper .header #sidebar .sidebar-wrapper { - padding: 4rem; } } + padding: 4rem; + display: flex; + flex-direction: row; + align-items: center; } } + .wrapper .header #sidebar .sidebar-wrapper .menuseparator { + display: none; } + @media (min-width: 769px) { + .wrapper .header #sidebar .sidebar-wrapper .menuseparator { + display: block; + width: 1px; + height: 70%; + background-color: #fff; + flex: 0 0 auto; + margin: 4rem; } } .wrapper .header #sidebar .sidebar-wrapper ul { margin-block-start: 0; margin-block-end: 0; @@ -299,6 +316,7 @@ object { padding-inline-start: 0; } @media (min-width: 769px) { .wrapper .header #sidebar .sidebar-wrapper ul { + flex: 1 1 50%; display: flex; flex-direction: column; flex-wrap: wrap; @@ -309,7 +327,6 @@ object { padding-top: 2rem; } @media (min-width: 769px) { .wrapper .header #sidebar .sidebar-wrapper li { - width: 50%; padding: 3rem 0; } } .wrapper .header #sidebar .sidebar-wrapper li a { font: 900 4rem "Westeinde Caption"; @@ -323,7 +340,7 @@ object { .wrapper .header #tag-nav { display: none; position: fixed; - right: calc(20rem + 2px); + right: calc(20rem + 4px); top: calc(4rem/ 2); z-index: 1000; } @media (min-width: 769px) { @@ -791,7 +808,8 @@ object { z-index: -1; } } @media (min-width: 769px) { .wrapper main section .misha_loadmore { - width: 10rem; + min-width: 10rem; + width: calc(100vw - ((100vh - 8rem) / 2 * 3) - 20rem); margin-right: 10rem; align-self: stretch; display: flex; @@ -822,7 +840,8 @@ object { -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); - transform: rotate(-90deg); } } + transform: rotate(-90deg); + text-align: center; } } .touchevents .header-scroll { display: none !important; } @@ -842,6 +861,9 @@ object { .archive .wrapper, .home .wrapper { overflow-y: hidden; + width: -moz-max-content; + width: max-content; + width: -moz-fit-content; width: fit-content; } } @media (min-width: 769px) { .archive .wrapper .header .header-scroll, @@ -873,6 +895,9 @@ object { .archive main, .home main { height: 100vh; + width: -moz-max-content; + width: max-content; + width: -moz-fit-content; width: fit-content; position: relative; } } @@ -889,6 +914,9 @@ object { flex-direction: row; margin: 0; height: 100vh; + width: -moz-max-content; + width: max-content; + width: -moz-fit-content; width: fit-content; } } .archive main section article, .home main section article { @@ -936,6 +964,9 @@ object { bottom: 50%; height: 5rem; display: flex; + width: -moz-max-content; + width: max-content; + width: -moz-fit-content; width: fit-content; justify-content: space-around; flex-wrap: nowrap; @@ -1014,6 +1045,9 @@ object { .home main section .home-wrapper-big article .metadata { height: calc(10rem / 2); } } @media (min-width: 769px) { + .archive main section .home-wrapper-big article .metadata.noBottomScrollbar, + .home main section .home-wrapper-big article .metadata.noBottomScrollbar { + height: 11.5rem; } .archive main section .home-wrapper-big article .metadata > div, .home main section .home-wrapper-big article .metadata > div { flex: 1 1 auto; } @@ -1158,22 +1192,30 @@ object { .archive main section .home-wrapper-big.home-wrapper-2 article .metadata .filler, .home main section .home-wrapper-big.home-wrapper-2 article .metadata .filler { order: -1; } - .archive main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper img, - .home main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper img { - left: -5rem; - position: relative; } } + .archive main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper, + .home main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper { + width: calc(60% + 5rem); } + .archive main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper img, + .home main section .home-wrapper-big.home-wrapper-2 article .thumbnailwrapper img { + left: -5rem; + position: relative; } } @media (min-width: 769px) { .archive main section .home-wrapper-small, .home main section .home-wrapper-small { - width: calc(100vw - (10rem * 3)); - height: calc((100vw - (10rem * 3)) / 3 * 2); + max-width: calc(100vw - (10rem * 3)); + max-height: calc((100vw - (10rem * 3)) / 3 * 2); + height: calc(100vh - 8rem); + width: calc((100vh - 8rem) / 2 * 3); flex-shrink: 0; display: flex; flex-direction: row; flex-wrap: wrap; margin: auto 0; } - .archive main section .home-wrapper-small.home-wrapper-s1, - .home main section .home-wrapper-small.home-wrapper-s1 { + .archive main section .home-wrapper-small.home-wrapper-s1:not(.home-wrapper-small), + .home main section .home-wrapper-small.home-wrapper-s1:not(.home-wrapper-small) { + margin-left: 5rem !important; } + .archive main section .home-wrapper-small.home-wrapper-s1.home-wrapper-small, + .home main section .home-wrapper-small.home-wrapper-s1.home-wrapper-small { margin-left: 10rem !important; } .archive main section .home-wrapper-small article, .archive main section .home-wrapper-small .archivetitle, @@ -1208,6 +1250,7 @@ object { .home main section .home-wrapper-small .archivetitle .metadata, .home main section .home-wrapper-small .archivedescription .metadata { width: 100%; + min-width: unset; height: 5rem; position: absolute; bottom: 0; @@ -1277,8 +1320,7 @@ object { .home main section .home-wrapper-small .archivedescription .metadata .categories, .home main section .home-wrapper-small .archivedescription .metadata .postedon { font: bold 1rem "Westeinde Caption"; - color: #000; - padding: 2rem; } } + color: #000; } } @media (min-width: 769px) and (min-width: 769px) { .archive main section .home-wrapper-small article .metadata .categories, .archive main section .home-wrapper-small article .metadata .postedon, @@ -1300,7 +1342,17 @@ object { .home main section .home-wrapper-small article .metadata .categories, .home main section .home-wrapper-small .archivetitle .metadata .categories, .home main section .home-wrapper-small .archivedescription .metadata .categories { - margin-left: 6rem; } } + margin-left: 6rem; + padding: 1.33333rem 0; + flex: 1 1 auto; } + .archive main section .home-wrapper-small article .metadata .postedon, + .archive main section .home-wrapper-small .archivetitle .metadata .postedon, + .archive main section .home-wrapper-small .archivedescription .metadata .postedon, + .home main section .home-wrapper-small article .metadata .postedon, + .home main section .home-wrapper-small .archivetitle .metadata .postedon, + .home main section .home-wrapper-small .archivedescription .metadata .postedon { + padding: 1.33333rem 1rem; + flex: 1 0 auto; } } @media (min-width: 769px) and (min-width: 769px) { .archive main section .home-wrapper-small article h2, .archive main section .home-wrapper-small article h2 a, @@ -1314,9 +1366,23 @@ object { .home main section .home-wrapper-small .archivetitle h2 a, .home main section .home-wrapper-small .archivedescription h2, .home main section .home-wrapper-small .archivedescription h2 a { - font-size: 1.2rem; + font-size: 1.5rem; -webkit-text-stroke: #000 1px; color: transparent; } } + @media (min-width: 769px) and (min-width: 1279px) { + .archive main section .home-wrapper-small article h2, + .archive main section .home-wrapper-small article h2 a, + .archive main section .home-wrapper-small .archivetitle h2, + .archive main section .home-wrapper-small .archivetitle h2 a, + .archive main section .home-wrapper-small .archivedescription h2, + .archive main section .home-wrapper-small .archivedescription h2 a, + .home main section .home-wrapper-small article h2, + .home main section .home-wrapper-small article h2 a, + .home main section .home-wrapper-small .archivetitle h2, + .home main section .home-wrapper-small .archivetitle h2 a, + .home main section .home-wrapper-small .archivedescription h2, + .home main section .home-wrapper-small .archivedescription h2 a { + font-size: 2.2rem; } } @media (min-width: 769px) { .archive main section .home-wrapper-small article h2, .archive main section .home-wrapper-small .archivetitle h2, @@ -1328,15 +1394,39 @@ object { position: absolute; top: 0; background-color: #fff; - height: 100%; } + height: 100%; + padding-left: 4rem; } } + @media (min-width: 769px) and (min-width: 1279px) { + .archive main section .home-wrapper-small article h2, + .archive main section .home-wrapper-small .archivetitle h2, + .archive main section .home-wrapper-small .archivedescription h2, + .home main section .home-wrapper-small article h2, + .home main section .home-wrapper-small .archivetitle h2, + .home main section .home-wrapper-small .archivedescription h2 { + padding: 5rem; } } + @media (min-width: 769px) { .archive main section .home-wrapper-small article h2 a, .archive main section .home-wrapper-small .archivetitle h2 a, .archive main section .home-wrapper-small .archivedescription h2 a, .home main section .home-wrapper-small article h2 a, .home main section .home-wrapper-small .archivetitle h2 a, .home main section .home-wrapper-small .archivedescription h2 a { - top: 50%; - position: absolute; } + bottom: 7rem; + width: calc(100% - 8rem); + height: -moz-max-content; + height: max-content; + height: -moz-fit-content; + height: fit-content; + position: absolute; } } + @media (min-width: 769px) and (min-width: 1279px) { + .archive main section .home-wrapper-small article h2 a, + .archive main section .home-wrapper-small .archivetitle h2 a, + .archive main section .home-wrapper-small .archivedescription h2 a, + .home main section .home-wrapper-small article h2 a, + .home main section .home-wrapper-small .archivetitle h2 a, + .home main section .home-wrapper-small .archivedescription h2 a { + width: calc(100% - 10rem); } } + @media (min-width: 769px) { .archive main section .home-wrapper-small .archivetitle, .home main section .home-wrapper-small .archivetitle { margin: 0; @@ -1447,6 +1537,30 @@ body.category.category-esemeny header { body.category.category-esemeny main { padding-top: 9rem; } + body.category.category-esemeny main article { + height: 50vh; } + body.category.category-esemeny main article .thumbnailwrapper { + height: 50vw; } + body.category.category-esemeny main article .thumbnailwrapper img { + width: 100%; + height: 100%; } + body.category.category-esemeny main article .event-metadata { + display: flex; + flex-direction: column; + padding: 2rem; } + body.category.category-esemeny main article .event-metadata .top-row, body.category.category-esemeny main article .event-metadata .bottom-row { + display: flex; + flex-direction: row; + justify-content: space-between; + height: 50%; + flex: 0 0 auto; } + body.category.category-esemeny main article .event-metadata .top-row h2, body.category.category-esemeny main article .event-metadata .bottom-row h2 { + height: unset; } + body.category.category-esemeny main article .event-metadata .hr { + flex: 0 0 auto; + height: 1px; + width: 100%; + background-color: #000; } /* -------------------------------------------------------------------------- */ /* single */ @@ -1752,7 +1866,7 @@ body.category.category-esemeny main { .tag-be.archive.tag .header-1, .tag-be.archive.tag .header-2 { background-color: #fdff00 !important; } - .tag-be.archive.tag article * { + .tag-be.archive.tag article *:not(.vr) { background-color: #fdff00 !important; } @media (min-width: 769px) { @@ -1808,7 +1922,7 @@ body.category.category-esemeny main { .tag-do.archive.tag .header-1, .tag-do.archive.tag .header-2 { background-color: #3c00ff !important; } - .tag-do.archive.tag article * { + .tag-do.archive.tag article *:not(.vr) { background-color: #3c00ff !important; } @media (min-width: 769px) { @@ -1864,7 +1978,7 @@ body.category.category-esemeny main { .tag-think.archive.tag .header-1, .tag-think.archive.tag .header-2 { background-color: #00ffb8 !important; } - .tag-think.archive.tag article * { + .tag-think.archive.tag article *:not(.vr) { background-color: #00ffb8 !important; } @media (min-width: 769px) { @@ -1920,7 +2034,7 @@ body.category.category-esemeny main { .tag-love.archive.tag .header-1, .tag-love.archive.tag .header-2 { background-color: #ff5f5f !important; } - .tag-love.archive.tag article * { + .tag-love.archive.tag article *:not(.vr) { background-color: #ff5f5f !important; } @media (min-width: 769px) { diff --git a/functions.php b/functions.php index e56899c..f0c9f16 100644 --- a/functions.php +++ b/functions.php @@ -10,6 +10,8 @@ External Modules/Files // Load any external files you have here +//include 'ChromePhp.php'; + /*------------------------------------*\ Theme Support \*------------------------------------*/ @@ -29,7 +31,7 @@ if (function_exists('add_theme_support')) { add_image_size('small', 120, '', true); // Small Thumbnail add_image_size('home-big-thumbnail', 1024, 1024, true); // Custom Thumbnail Size call using the_post_thumbnail('home-thumbnail'); add_image_size('home-small-thumbnail', 256, 256, true); // Custom Thumbnail Size call using the_post_thumbnail('home-thumbnail'); - add_image_size('home-event-thumbnail', 1024, 512, true); + add_image_size('home-event-thumbnail', 1024, 512, true); // Add Support for Custom Backgrounds - Uncomment below if you're going to use /*add_theme_support('custom-background', array( @@ -186,6 +188,7 @@ function dis2019_styles() //remove events from home page // !!!add event cat id to here!!!! +//search keywords: event esemeny esemény category function exclude_category_home($query) { if ($query->is_home) { @@ -197,14 +200,37 @@ function exclude_category_home($query) add_filter('pre_get_posts', 'exclude_category_home'); + + +// order events by date on events page +// !!!add event cat id to here!!!! +//search keywords: event esemeny esemény category +add_action('pre_get_posts', 'dis_2019_order_events_by_date', 1); +function dis_2019_order_events_by_date(&$query) +{ + + //Before anything else, make sure this is the right query... + if (!$query->get('category_name') == 'esemeny') { + return; + } + + $query->set('meta_key', 'dis-esemeny-datum'); + $query->set('orderby', 'meta_value'); + $query->set('order', 'ASC'); + $query->set('meta_value', date("Y.m.d.")); // change to how "event date" is stored + $query->set('meta_compare', '>'); + +} + // Register dis-2019 Navigation function register_dis_menu() { register_nav_menus(array( // Using array to specify more menus if needed - 'header-menu' => __('Header Menu', 'dis2019'), // Main Navigation + 'main-left-menu' => __('Főmenü bal oldal', 'dis2019'), // Main Navigation + 'main-right-menu' => __('Főmenü jobb oldal', 'dis2019'), // Extra Navigation if needed (duplicate as many as you need!) // 'sidebar-menu' => __('Sidebar Menu', 'dis2019'), // Sidebar Navigation - 'tag-menu' => __('Tag Menu', 'dis2019'), // Extra Navigation if needed (duplicate as many as you need!) - 'right-menu' => __('Right Menu', 'dis2019'), // Extra Navigation if needed (duplicate as many as you need!) + 'tag-menu' => __('BE DO THINK LOVE', 'dis2019'), // bedo circle + //'main-right-menu' => __('Header Right Menu', 'dis2019'), // Extra Navigation if needed (duplicate as many as you need!) )); } diff --git a/header.php b/header.php index a714fd4..02c08d7 100644 --- a/header.php +++ b/header.php @@ -113,8 +113,12 @@ diff --git a/js/scripts.js b/js/scripts.js index da6e319..645f76b 100644 --- a/js/scripts.js +++ b/js/scripts.js @@ -23,13 +23,25 @@ const desktophomemargin = $(".header-1")[0].getBoundingClientRect().width + // height of scrollbar at bottom + const bottomScrollHeight = (_ => { + if (wih / vh > 1.5) { + return 0 + } else { + let bs = wih - vh + return bs + } + })() const cssWidths = { vw: vw, wow: wow, wiw: wiw, bw: bw, - desktophomemargin: desktophomemargin + desktophomemargin: desktophomemargin, + wih: wih, + vh: vh, + bottomScrollHeight: bottomScrollHeight } console.log(cssWidths) @@ -75,15 +87,6 @@ } })() - const bottomScrollHeight = (_ => { - if (wih / vh > 1.5) { - return 0 - } else { - let bs = wih - vh - return bs - } - })() - /* ========================================================================== */ @@ -148,7 +151,7 @@ var menuWidth = wow if (!isMobile) { - menuWidth = 420 + menuWidth = 500 } $("#sidebar").simplerSidebar({ @@ -252,6 +255,8 @@ //add bottom scrollbar to div on bottom: if (bottomScrollHeight > 0) { $(".home-wrapper-big .metadata").css({ bottom: bottomScrollHeight }) + } else { + $(".home-wrapper-big .metadata").addClass("noBottomScrollbar") } }//isHome || isArchive end }// !isMobile end @@ -351,7 +356,9 @@ } else { //from the third wrap modify the offset var wNum = parseInt($(nextelem).attr("class").split(" ")[1].split("-")[2]) - if (wNum > 3 || !isHome) { + if (wNum == 3 || !isHome) { + offset = offset - (desktophomemargin / 2) + } else if (wNum > 4 || !isHome) { offset = offset - desktophomemargin } } @@ -609,6 +616,20 @@ }, ".home-small a.thumbnailwrapper") + /* -------------------------------------------------------------------------- */ + /* EVENTS - ESEMÉNYEK */ + /* -------------------------------------------------------------------------- */ + + if (isEsemeny) { + + //add spaces to date + $(".event-metadata .ev-date").each(function () { + let repl = $(this).html().replace(/\.\b/g, ". ") + $(this).html(repl) + }) + } + + /* -------------------------------------------------------------------------- */ /* CIRCULAR TEXT */ /* -------------------------------------------------------------------------- */ diff --git a/sass/_font-mixins.scss b/sass/_font-mixins.scss index 886f268..fe55e26 100644 --- a/sass/_font-mixins.scss +++ b/sass/_font-mixins.scss @@ -61,10 +61,13 @@ @mixin home-title-small { //small titles on desktop on home and archives @media #{$smalldesktop} { - font-size: 1.2rem; + font-size: 1.5rem; -webkit-text-stroke: #000 1px; color: transparent; } + @media #{$bigdesktop} { + font-size: 2.2rem; + } } @mixin archive-tag-description { diff --git a/sass/base.scss b/sass/base.scss index 61defef..620b50e 100644 --- a/sass/base.scss +++ b/sass/base.scss @@ -80,8 +80,9 @@ object { } /* -------------------------------------------------------------------------- */ -/* GLOBAL VARIABLES */ +/* MEDIA QUERIES */ /* -------------------------------------------------------------------------- */ + $only-mobile: only screen and ( max-width: 768px @@ -106,6 +107,10 @@ $verybigdesktop: only screen and min-width: 1919px ); +/* -------------------------------------------------------------------------- */ +/* GLOBAL VARIABLES */ +/* -------------------------------------------------------------------------- */ + //Horizontal units: $h-unit-4: 20rem; $h-unit-2: 10rem; // menuwidth on desktop @@ -117,11 +122,18 @@ $v-unit-2: 8rem; $v-unit-4: 16rem; $v-unit-6: 24rem; - /* -------------------------------------------------------------------------- */ /* other mixins */ /* -------------------------------------------------------------------------- */ +@mixin fit-content($wh) { + #{$wh}: -moz-max-content; + #{$wh}: max-content; + #{$wh}: -moz-fit-content; + #{$wh}: fit-content; + +} + @mixin transition($transition) { -webkit-transition: $transition; -moz-transition: $transition; @@ -365,7 +377,7 @@ $v-unit-6: 24rem; // color: #000; // fill: currentColor; filter: invert(100%); //black - @include transform(rotate(180deg)) // transform: rotate(180deg);;;;;;;;;;;;;;;;;;;;;; + @include transform(rotate(180deg)) // transform: rotate(180deg);;;;;;;;;;;;;;;;;;;;;;;;;;;;; } } } @@ -522,8 +534,23 @@ $v-unit-6: 24rem; height: 100%; overflow: auto; padding: 0 $v-unit-1; + padding-bottom: $v-unit-1; @media #{$smalldesktop} { padding: $v-unit-1; + display: flex; + flex-direction: row; + align-items: center; + } + .menuseparator { + display: none; + @media #{$smalldesktop} { + display: block; + width: 1px; + height: 70%; + background-color: #fff; + flex: 0 0 auto; + margin: $v-unit-1; + } } ul { margin-block-start: 0; @@ -532,6 +559,7 @@ $v-unit-6: 24rem; margin-inline-end: 0px; padding-inline-start: 0; @media #{$smalldesktop} { + flex: 1 1 50%; display: flex; flex-direction: column; flex-wrap: wrap; @@ -544,7 +572,6 @@ $v-unit-6: 24rem; display: block; padding-top: 2rem; @media #{$smalldesktop} { - width: 50%; padding: 3rem 0; } a { @@ -560,7 +587,7 @@ $v-unit-6: 24rem; display: none; position: fixed; - right: calc(#{$h-unit-4} + 2px); + right: calc(#{$h-unit-4} + 4px); top: calc(#{$v-unit-1}/ 2); // this is the top position of the circle!!! @media #{$smalldesktop} { top: 1rem; @@ -695,7 +722,8 @@ $v-unit-6: 24rem; /* -------------------------------- load more ------------------------------- */ .misha_loadmore { @media #{$smalldesktop} { - width: $h-unit-2; + min-width: $h-unit-2; + width: calc(100vw - ((100vh - #{$v-unit-2}) / 2 * 3) - #{$h-unit-4}); margin-right: $h-unit-2; align-self: stretch; display: flex; @@ -712,6 +740,7 @@ $v-unit-6: 24rem; white-space: nowrap; width: 100vh; @include transform(rotate(-90deg)); + text-align: center; } } } @@ -747,7 +776,7 @@ $v-unit-6: 24rem; .wrapper { @media #{$smalldesktop} { overflow-y: hidden; - width: fit-content; + @include fit-content(width); } /* ----------------------------- header on home ----------------------------- */ @@ -785,7 +814,7 @@ $v-unit-6: 24rem; main { @media #{$smalldesktop} { height: 100vh; - width: fit-content; + @include fit-content(width); position: relative; } section { @@ -795,7 +824,7 @@ $v-unit-6: 24rem; flex-direction: row; margin: 0; height: 100vh; - width: fit-content; + @include fit-content(width); } /* --------------------------- home article mobile/default -------------------------- */ @@ -838,7 +867,7 @@ $v-unit-6: 24rem; bottom: 50%; height: $h-unit-1; display: flex; - width: fit-content; + @include fit-content(width); justify-content: space-around; flex-wrap: nowrap; align-items: center; @@ -925,6 +954,10 @@ $v-unit-6: 24rem; height: calc(#{$h-unit-2} / 2); } + &.noBottomScrollbar { + height: $h-unit-2 + 1.5rem; + } + & > div { flex: 1 1 auto; } @@ -1023,6 +1056,7 @@ $v-unit-6: 24rem; } } .thumbnailwrapper { + width: calc(60% + #{$h-unit-1}); img { left: -$h-unit-1; position: relative; @@ -1037,14 +1071,19 @@ $v-unit-6: 24rem; @media #{$smalldesktop} { .home-wrapper-small { - width: calc(100vw - (#{$h-unit-2} * 3)); - height: calc((100vw - (#{$h-unit-2} * 3)) / 3 * 2); + max-width: calc(100vw - (#{$h-unit-2} * 3)); + max-height: calc((100vw - (#{$h-unit-2} * 3)) / 3 * 2); + height: calc(100vh - #{$v-unit-2}); + width: calc((100vh - #{$v-unit-2}) / 2 * 3); flex-shrink: 0; display: flex; flex-direction: row; flex-wrap: wrap; margin: auto 0; - &.home-wrapper-s1 { + &.home-wrapper-s1:not(.home-wrapper-small) { + margin-left: $h-unit-1 !important; + } + &.home-wrapper-s1.home-wrapper-small{ margin-left: $h-unit-2 !important; } @@ -1066,6 +1105,7 @@ $v-unit-6: 24rem; .metadata { width: 100%; + min-width: unset; height: $h-unit-1; position: absolute; @@ -1088,10 +1128,15 @@ $v-unit-6: 24rem; .categories, .postedon { @include home-metadata(); - padding: $v-unit-1 / 2; } .categories { margin-left: $v-unit-1 * 1.5; + padding: $v-unit-1 / 3 0; + flex: 1 1 auto; + } + .postedon { + padding: $v-unit-1 / 3 $v-unit-1 / 4; + flex: 1 0 auto; } } @@ -1106,9 +1151,21 @@ $v-unit-6: 24rem; top: 0; background-color: #fff; height: 100%; + padding-left: $v-unit-1; + @media #{$bigdesktop} { + padding: $h-unit-1; + } + a { - top: 50%; + bottom: $h-unit-1 + $v-unit-1 * 0.5; + + width: calc(100% - #{$v-unit-2}); + @include fit-content(height); position: absolute; + + @media #{$bigdesktop} { + width: calc(100% - #{$h-unit-2}); + } } } } @@ -1177,6 +1234,48 @@ body.category.category-esemeny { } main { padding-top: 5rem + (2rem * 2); + article{ + height: 50vh; + .thumbnailwrapper{ + height: 50vw; + img{ + width: 100%; + height: 100%; + } + } + + .event-metadata{ + display: flex; + flex-direction: column; + padding: 2rem; + + .top-row, .bottom-row{ + display: flex; + flex-direction: row; + justify-content: space-between; + height: 50%; + flex: 0 0 auto; + &>*{ + + } + .ev-date{ + + } + h2{ + height: unset; + + } + + } + .hr{ + flex: 0 0 auto; + height: 1px; + width: 100%; + background-color: #000; + } + + } + } } } @@ -1473,7 +1572,7 @@ body.category.category-esemeny { .header-2 { background-color: $color !important; } - article * { + article *:not(.vr) { background-color: $color !important; } }