nav+maj
This commit is contained in:
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
@@ -18,22 +18,24 @@ header{
|
||||
& > a {
|
||||
li{
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
&::after{
|
||||
transition: width 0.5s;
|
||||
width: 0%;
|
||||
content: " ";
|
||||
position: absolute;
|
||||
background: rgb(0, 255, 0);
|
||||
width: 0%;
|
||||
height: 10px;
|
||||
margin: auto;
|
||||
z-index: -1;
|
||||
transition: width 0.5s;
|
||||
}
|
||||
}
|
||||
li:hover{
|
||||
position: relative;
|
||||
&::after{
|
||||
transition: width 0.5s;
|
||||
width: 100%;
|
||||
&:hover{
|
||||
li{
|
||||
&::after{
|
||||
width: 100%;
|
||||
transition: width 0.5s;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -42,7 +44,7 @@ header{
|
||||
& > li:nth-child(1){
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin-right: 80px;
|
||||
margin-right: 60px;
|
||||
&:after{
|
||||
content: " ";
|
||||
cursor: pointer;
|
||||
@@ -68,6 +70,8 @@ header{
|
||||
}
|
||||
ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
li{
|
||||
height: 40px;
|
||||
margin-right: 50px;
|
||||
@@ -84,15 +88,15 @@ header{
|
||||
top: 40px;
|
||||
right: 0px;
|
||||
width: auto;
|
||||
border-left: 2px solid black;
|
||||
border-bottom: 2px solid black;
|
||||
z-index: 999;
|
||||
background: white;
|
||||
a{
|
||||
border-left: 2px solid black;
|
||||
border-bottom: 2px solid black;
|
||||
background: white;
|
||||
display: flex;
|
||||
width: auto;
|
||||
height: 50px;
|
||||
margin: 0 20px;
|
||||
padding: 0 20px;
|
||||
li{
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
@@ -44,9 +44,10 @@
|
||||
display: flex;
|
||||
}
|
||||
.media{
|
||||
width: calc((100% / 3) * 2)
|
||||
width: calc((100% / 3) * 2);
|
||||
}
|
||||
.content{
|
||||
width: calc(100% / 3);
|
||||
.txt{
|
||||
position: fixed;
|
||||
right: 0;
|
||||
@@ -59,18 +60,19 @@
|
||||
}
|
||||
}
|
||||
.taxonomy{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: white;
|
||||
padding: 0 10px 0 30px;
|
||||
position:fixed;
|
||||
bottom: 0;
|
||||
border-top: 2px solid black;
|
||||
span{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: auto 0;
|
||||
a{
|
||||
margin-right: 20px;
|
||||
padding: 10px 30px;
|
||||
border-bottom: 2px solid black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -90,6 +90,7 @@ p{
|
||||
&::after{
|
||||
transition: width 0.5s;
|
||||
content: " ";
|
||||
background: rgb(0, 255, 0);
|
||||
position: absolute;
|
||||
width: 0%;
|
||||
height: 10px;
|
||||
@@ -100,9 +101,7 @@ p{
|
||||
}
|
||||
}
|
||||
a:hover{
|
||||
position: relative;
|
||||
&::after{
|
||||
background: rgb(0, 255, 0);
|
||||
transition: width 0.5s;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
images/logo/*
|
||||
@@ -1,3 +1,19 @@
|
||||
# v1.2.1
|
||||
## 08/23/2018
|
||||
|
||||
1. [](#improved)
|
||||
* Added additional "mobile custom logo" support
|
||||
1. [](#bugfix)
|
||||
* Addressed some CSS issues by forcing logo height
|
||||
|
||||
# v1.2.0
|
||||
## 08/23/2018
|
||||
|
||||
1. [](#new)
|
||||
* Added new "custom logo" support [#3](https://github.com/getgrav/grav-theme-quark/issues/3)
|
||||
* Added option JSON feed syndication support in sidebar [#47](https://github.com/getgrav/grav-theme-quark/pull/47)
|
||||
* Added basic form field `array` styling
|
||||
|
||||
# v1.1.0
|
||||
## 07/25/2018
|
||||
|
||||
|
||||
@@ -61,12 +61,27 @@ header-dark: false # Inverts the text/logo to work better on dark bac
|
||||
header-transparent: false # Allows the fixed header to be transparent over the page
|
||||
sticky-footer: true # Causes the footer to be sticky at the bottom of the page
|
||||
blog-page: '/blog' # The route to the blog listing page, useful for a blog style layout with sidebar
|
||||
custom_logo: # A custom logo rather than the default (see below)
|
||||
custom_logo_mobile: # A custom logo to use for mobile navigation
|
||||
```
|
||||
|
||||
To make modifications, you can copy the `user/themes/quark/quark.yaml` file to `user/config/themes/` folder and modify, or you can use the admin plugin.
|
||||
|
||||
> NOTE: Do not modify the `user/themes/quark/quark.yaml` file directly or your changes will be lost with any updates
|
||||
|
||||
## Custom Logos
|
||||
|
||||
To add a custom logo, you should put the log into the `user/themes/quark/images/logo` folder. Standard image formats are support (`.png`,`.jpg`, `.gif`, `.svg`, etc.). Then reference the logo via the YAML like so:
|
||||
|
||||
```yaml
|
||||
custom_logo:
|
||||
- name: 'my-logo.png'
|
||||
custom_logo_mobile:
|
||||
- name: 'my-mobile-logo.png'
|
||||
```
|
||||
|
||||
Alternatively, you can you use the drag-n-drop "Custom Logo" field in the Quark theme options.
|
||||
|
||||
## Page Overrides
|
||||
|
||||
Quark has the ability to allow pages to override some of the default options by letting the user set `body_classes` for any page. The theme will merge the combination of the defaults with any `body_classes` set. For example:
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
name: Quark
|
||||
version: 1.1.0
|
||||
version: 1.2.1
|
||||
description: New Grav Default Theme
|
||||
icon: microchip
|
||||
author:
|
||||
@@ -47,6 +47,26 @@ form:
|
||||
title: Header Defaults
|
||||
underline: true
|
||||
|
||||
custom_logo:
|
||||
type: file
|
||||
label: Custom Logo
|
||||
size: large
|
||||
destination: 'theme://images/logo'
|
||||
multiple: false
|
||||
markdown: true
|
||||
description: Will be used instead of default logo `theme://images/grav-logo.svg`
|
||||
accept:
|
||||
- image/*
|
||||
|
||||
custom_logo_mobile:
|
||||
type: file
|
||||
label: Mobile Custom Logo
|
||||
size: large
|
||||
destination: 'theme://images/logo'
|
||||
multiple: false
|
||||
accept:
|
||||
- image/*
|
||||
|
||||
header-fixed:
|
||||
type: toggle
|
||||
label: Fixed header
|
||||
|
||||
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
@@ -48,11 +48,4 @@
|
||||
@import "spectre/utilities";
|
||||
|
||||
// Extras
|
||||
.search-input {
|
||||
@extend .form-input;
|
||||
}
|
||||
|
||||
.button {
|
||||
@extend .btn;
|
||||
}
|
||||
|
||||
@import "theme/extensions";
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
.search-input, [data-grav-field="array"] input, [data-grav-field="array"] textarea {
|
||||
@extend .form-input;
|
||||
}
|
||||
|
||||
.button {
|
||||
@extend .btn;
|
||||
}
|
||||
@@ -53,11 +53,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
.logo svg {
|
||||
width: 150px;
|
||||
display: inherit;
|
||||
|
||||
@extend .default-animation;
|
||||
.logo {
|
||||
svg, img {
|
||||
height: 42px;
|
||||
display: inherit;
|
||||
@extend .default-animation;
|
||||
}
|
||||
}
|
||||
|
||||
// Fixed Header solution
|
||||
@@ -77,8 +78,10 @@ body.header-fixed.header-animated {
|
||||
height: $header-height-small;
|
||||
}
|
||||
|
||||
.logo svg {
|
||||
width: 100px;
|
||||
.logo {
|
||||
svg, img {
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
~ .mobile-menu .button_container {
|
||||
|
||||
@@ -9,8 +9,8 @@
|
||||
}
|
||||
|
||||
.mobile-logo {
|
||||
svg {
|
||||
max-width: 150px;
|
||||
svg, img {
|
||||
height: 42px;
|
||||
margin-top: .7rem;
|
||||
margin-left: 1.4rem;
|
||||
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
<section class="container {{ grid_size }}">
|
||||
<nav class="navbar">
|
||||
<section class="navbar-section logo">
|
||||
<a href="{{ home_url }}" class="navbar-brand mr-10">{% include('@images/grav-logo.svg') %}</a>
|
||||
{% include 'partials/logo.html.twig' %}
|
||||
</section>
|
||||
<section class="navbar-section">
|
||||
|
||||
@@ -97,7 +97,7 @@
|
||||
<div class="mobile-container">
|
||||
<div class="overlay" id="overlay">
|
||||
<div class="mobile-logo">
|
||||
{% include('@images/grav-logo.svg') %}
|
||||
{% include 'partials/logo.html.twig' with {mobile: true} %}
|
||||
</div>
|
||||
<nav class="overlay-menu">
|
||||
{% include 'partials/navigation.html.twig' with {tree: true} %}
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
{% set logo = theme_var(mobile ? 'custom_logo_mobile' : 'custom_logo') %}
|
||||
<a href="{{ home_url }}" class="navbar-brand mr-10">
|
||||
{% if logo %}
|
||||
{% set logo_file = (logo|first).name %}
|
||||
<img src="{{ url('theme://images/logo/' ~ logo_file) }}" alt="{{ site.name }}" />
|
||||
{% else %}
|
||||
{% include('@images/grav-logo.svg') %}
|
||||
{% endif %}
|
||||
</a>
|
||||
@@ -38,5 +38,6 @@
|
||||
<h4>{{ 'SIDEBAR.SYNDICATE.HEADLINE'|t }}</h4>
|
||||
<a class="btn" href="{{ feed_url }}.atom"><i class="fa fa-rss-square"></i> Atom 1.0</a>
|
||||
<a class="btn" href="{{ feed_url }}.rss"><i class="fa fa-rss-square"></i> RSS</a>
|
||||
{% if config.plugins.feed.enable_json_feed %}<a class="btn" href="{{ feed_url }}.json"><i class="fa fa-rss-square"></i> JSON</a>{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user