Nemcio/Grav-Admin-Plugin
1
0
Fork 0
mirror of https://github.com/getgrav/grav-plugin-admin.git synced 2025-11-04 20:36:03 +01:00
Code Issues Packages Projects Releases Activity

initial columns view styling

Browse Source
This commit is contained in:
Andy Miller
2019-09-09 13:04:01 -06:00
parent 905b57358b
commit faa45b91da
17 changed files with 268 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
themes/grav/css-compiled/preset.css vendored
View File

File diff suppressed because one or more lines are too long

2
themes/grav/css-compiled/preset.css.map
View File

File diff suppressed because one or more lines are too long

2
themes/grav/css-compiled/template.css vendored
View File

File diff suppressed because one or more lines are too long

2
themes/grav/css-compiled/template.css.map
View File

File diff suppressed because one or more lines are too long

8
themes/grav/images/icons/clock-hands.svg Normal file
View File

@@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g>
<path d="M12,13C11.4,13 11,12.6 11,12L11,5C11,4.4 11.4,4 12,4C12.6,4 13,4.4 13,5L13,12C13,12.6 12.6,13 12,13Z" style="fill:white;fill-rule:nonzero;"/>
<path d="M16,17C15.7,17 15.5,16.9 15.3,16.7L11.3,12.7C10.9,12.3 10.9,11.7 11.3,11.3C11.7,10.9 12.3,10.9 12.7,11.3L16.7,15.3C17.1,15.7 17.1,16.3 16.7,16.7C16.5,16.9 16.3,17 16,17Z" style="fill:white;fill-rule:nonzero;"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 854 B

11
themes/grav/images/icons/file-edit.svg Normal file
View File

@@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M12.058,19.588c0.07,-0.245 0.202,-0.468 0.382,-0.648l4.56,-4.561v-8.879c0,-0.133 -0.053,-0.26 -0.146,-0.353l-5,-5c-0.094,-0.094 -0.222,-0.147 -0.354,-0.147h-11c-0.276,0 -0.5,0.224 -0.5,0.5v21c0,0.276 0.224,0.5 0.5,0.5h10.868l0.69,-2.412Zm-1.058,-18.588l5,5h-5v-5Z"></path>
<path d="M14.111,16.234h6.78v4.535h-6.78Z" transform="matrix(0.7071,-0.7071,0.7071,0.7071,-7.9567,17.7936)"></path>
<path d="M23.855,14.646l-2.5,-2.5c-0.195,-0.195 -0.512,-0.195 -0.707,0l-1.647,1.647l3.207,3.207l1.647,-1.646c0.196,-0.195 0.196,-0.512 0,-0.708Z"></path>
<path d="M15.848,23.067l-2.917,-2.917l-0.911,3.226c-0.046,0.168 -0.011,0.353 0.121,0.484c0.131,0.131 0.316,0.166 0.483,0.122l3.224,-0.915Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

10
themes/grav/images/icons/file-home.svg Normal file
View File

@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M12,18.901c-0.576,0.192 -1.256,0.035 -1.652,-0.44c-0.529,-0.636 -0.443,-1.584 0.191,-2.113l6.001,-5c0.137,-0.113 0.294,-0.198 0.46,-0.254v-5.594c0,-0.133 -0.053,-0.26 -0.146,-0.353l-5,-5c-0.094,-0.094 -0.222,-0.147 -0.354,-0.147h-11c-0.276,0 -0.5,0.224 -0.5,0.5v21c0,0.276 0.224,0.5 0.5,0.5h11.5v-3.099Zm-1,-17.901l5,5h-5v-5Z"></path>
<path d="M17.5,14.453l-4.5,3.75v5.297c0,0.276 0.224,0.5 0.5,0.5h8c0.276,0 0.5,-0.224 0.5,-0.5v-5.297l-4.5,-3.75Z"></path>
<path d="M23.18,17.885l-5.68,-4.734l-5.68,4.734c-0.213,0.176 -0.528,0.147 -0.705,-0.065c-0.177,-0.212 -0.148,-0.528 0.064,-0.705l6,-5c0.185,-0.154 0.455,-0.154 0.641,0l6,5c0.212,0.177 0.241,0.492 0.064,0.705c-0.176,0.212 -0.49,0.242 -0.704,0.065Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

2
themes/grav/images/icons/folder-lock.svg → themes/grav/images/icons/file-lock.svg
View File

@@ -2,7 +2,7 @@
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M12,15.5c0,-0.827 0.673,-1.5 1.5,-1.5h0.528c0.25,-2.247 2.16,-4 4.472,-4c0.928,0 1.783,0.292 2.5,0.774v-6.274c0,-0.275 -0.224,-0.5 -0.5,-0.5h-1.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-12.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-5c-0.276,0 -0.5,0.225 -0.5,0.5v15.5c0,1.103 0.897,2 2,2h10v-2.5Zm-9,-11v11.5c0,0.551 -0.449,1 -1,1c-0.551,0 -1,-0.449 -1,-1v-15h4v1.5c0,0.277 0.224,0.5 0.5,0.5h12.5v1h-14.5c-0.276,0 -0.5,0.225 -0.5,0.5Z"></path>
<path d="M12,15.5c0,-0.827 0.673,-1.5 1.5,-1.5h0.528c0.193,-1.734 1.379,-3.165 2.972,-3.731v-4.769c0,-0.133 -0.053,-0.26 -0.146,-0.353l-5,-5c-0.094,-0.094 -0.222,-0.147 -0.354,-0.147h-11c-0.276,0 -0.5,0.224 -0.5,0.5v21c0,0.276 0.224,0.5 0.5,0.5h11.5v-6.5Zm-1,-14.5l5,5h-5v-5Z"></path>
<path d="M23.5,15h-1.5v-0.5c0,-1.929 -1.57,-3.5 -3.5,-3.5c-1.93,0 -3.5,1.571 -3.5,3.5v0.5h-1.5c-0.276,0 -0.5,0.224 -0.5,0.5v8c0,0.276 0.224,0.5 0.5,0.5h10c0.276,0 0.5,-0.224 0.5,-0.5v-8c0,-0.276 -0.224,-0.5 -0.5,-0.5Zm-4.5,4.348v1.652c0,0.276 -0.224,0.5 -0.5,0.5c-0.276,0 -0.5,-0.224 -0.5,-0.5v-1.652c-0.293,-0.175 -0.5,-0.483 -0.5,-0.848c0,-0.551 0.448,-1 1,-1c0.552,0 1,0.449 1,1c0,0.365 -0.207,0.672 -0.5,0.848Zm2,-4.348h-5v-0.5c0,-1.378 1.121,-2.5 2.5,-2.5c1.379,0 2.5,1.122 2.5,2.5v0.5Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

11
themes/grav/images/icons/file-module.svg Normal file
View File

@@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M15,12.5c0,-0.277 0.224,-0.5 0.5,-0.5h1.5v-6.5c0,-0.133 -0.053,-0.26 -0.146,-0.353l-5,-5c-0.094,-0.095 -0.222,-0.147 -0.354,-0.147h-11c-0.276,0 -0.5,0.223 -0.5,0.5v21c0,0.276 0.224,0.5 0.5,0.5h11.5v-3.5c0,-0.277 0.224,-0.5 0.5,-0.5h2.5v-5.5Zm-4,-6.5v-5l5,5h-5Z"></path>
<path d="M23.5,19h-2h-2c-0.276,0 -0.5,0.223 -0.5,0.5v4c0,0.276 0.224,0.5 0.5,0.5h4c0.276,0 0.5,-0.224 0.5,-0.5v-4c0,-0.277 -0.224,-0.5 -0.5,-0.5Z"></path>
<path d="M17.5,19h-2h-2h-0.5v0.5v4c0,0.276 0.224,0.5 0.5,0.5h4c0.276,0 0.5,-0.224 0.5,-0.5v-4c0,-0.277 -0.224,-0.5 -0.5,-0.5Z"></path>
<path d="M21,17.5v-4c0,-0.277 -0.224,-0.5 -0.5,-0.5h-4h-0.5v0.5v4v0.5h0.5h2h2c0.276,0 0.5,-0.224 0.5,-0.5Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

11
themes/grav/images/icons/folder-blocked.svg
View File

@@ -1,11 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M21,14.707l-6.293,6.293c0.77,0.616 1.733,1 2.793,1c2.481,0 4.5,-2.018 4.5,-4.5c0,-1.06 -0.384,-2.023 -1,-2.793Z"></path>
<path d="M20.293,14c-0.77,-0.615 -1.733,-1 -2.793,-1c-2.481,0 -4.5,2.019 -4.5,4.5c0,1.06 0.384,2.023 1,2.793l6.293,-6.293Z"></path>
<path d="M17.5,11c-3.584,0 -6.5,2.915 -6.5,6.5c0,3.584 2.916,6.5 6.5,6.5c3.584,0 6.5,-2.916 6.5,-6.5c0,-3.585 -2.916,-6.5 -6.5,-6.5Zm0,12c-3.033,0 -5.5,-2.467 -5.5,-5.5c0,-3.033 2.467,-5.5 5.5,-5.5c3.033,0 5.5,2.467 5.5,5.5c0,3.033 -2.467,5.5 -5.5,5.5Z"></path>
<path d="M17.5,10c1.264,0 2.454,0.318 3.5,0.872v-6.372c0,-0.275 -0.224,-0.5 -0.5,-0.5h-1.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-12.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-5c-0.276,0 -0.5,0.225 -0.5,0.5v15.5c0,1.103 0.897,2 2,2h8.025c-0.298,-4.393 3.204,-8 7.475,-8Zm-14.5,-5.5v11.5c0,0.551 -0.449,1 -1,1c-0.551,0 -1,-0.449 -1,-1v-15h4v1.5c0,0.277 0.224,0.5 0.5,0.5h12.5v1h-14.5c-0.276,0 -0.5,0.225 -0.5,0.5Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

9
themes/grav/images/icons/folder-check.svg
View File

@@ -1,9 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M17.5,11c-3.584,0 -6.5,2.915 -6.5,6.5c0,3.584 2.916,6.5 6.5,6.5c3.584,0 6.5,-2.916 6.5,-6.5c0,-3.585 -2.916,-6.5 -6.5,-6.5Zm4.097,4.9l-4.096,4.357c-0.198,0.209 -0.521,0.203 -0.712,0.017l-2.926,-2.841c-0.197,-0.19 -0.203,-0.509 -0.01,-0.706c0.191,-0.198 0.508,-0.203 0.707,-0.011l2.561,2.485l3.747,-3.987c0.188,-0.201 0.507,-0.211 0.706,-0.021c0.201,0.19 0.211,0.506 0.023,0.707Z"></path>
<path d="M17.5,10c1.264,0 2.454,0.318 3.5,0.872v-6.372c0,-0.275 -0.224,-0.5 -0.5,-0.5h-1.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-12.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-5c-0.276,0 -0.5,0.225 -0.5,0.5v15.5c0,1.103 0.897,2 2,2h8.025c-0.298,-4.393 3.204,-8 7.475,-8Zm-14.5,-5.5v11.5c0,0.551 -0.449,1 -1,1c-0.551,0 -1,-0.449 -1,-1v-15h4v1.5c0,0.277 0.224,0.5 0.5,0.5h12.5v1h-14.5c-0.276,0 -0.5,0.225 -0.5,0.5Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.1 KiB

10
themes/grav/images/icons/folder-home.svg
View File

@@ -1,10 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M12,16.909c-0.575,0.204 -1.239,0.047 -1.652,-0.449c-0.53,-0.637 -0.444,-1.582 0.192,-2.113l6,-5c0.557,-0.463 1.364,-0.463 1.921,0l2.539,2.117v-6.964c0,-0.275 -0.224,-0.5 -0.5,-0.5h-1.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-12.5v-1.5c0,-0.275 -0.224,-0.5 -0.5,-0.5h-5c-0.276,0 -0.5,0.225 -0.5,0.5v15.5c0,1.103 0.897,2 2,2h10v-1.091Zm-9,-12.409v11.5c0,0.551 -0.449,1 -1,1c-0.551,0 -1,-0.449 -1,-1v-15h4v1.5c0,0.277 0.224,0.5 0.5,0.5h12.5v1h-14.5c-0.276,0 -0.5,0.225 -0.5,0.5Z"></path>
<path d="M17.5,12.453l-4.5,3.75v5.297c0,0.276 0.224,0.5 0.5,0.5h8c0.276,0 0.5,-0.224 0.5,-0.5v-5.297l-4.5,-3.75Z"></path>
<path d="M23.18,15.884l-5.68,-4.733l-5.68,4.733c-0.213,0.176 -0.527,0.148 -0.705,-0.064c-0.177,-0.212 -0.148,-0.528 0.064,-0.705l6,-5c0.185,-0.154 0.455,-0.154 0.641,0l6,5c0.212,0.177 0.241,0.492 0.064,0.705c-0.176,0.212 -0.49,0.242 -0.704,0.064Z"></path>
</g>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

6
themes/grav/images/icons/folder.svg
View File

@@ -1,6 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<path d="M23.5,6h-2.5v-1.5c0,-0.276 -0.224,-0.5 -0.5,-0.5h-12.5v-1.5c0,-0.276 -0.224,-0.5 -0.5,-0.5h-7c-0.276,0 -0.5,0.224 -0.5,0.5v16.5c0,1.654 1.346,3 3,3h17.5c1.93,0 3.5,-1.57 3.5,-3.5v-12c0,-0.276 -0.224,-0.5 -0.5,-0.5Zm-3.5,0h-14.5c-0.276,0 -0.5,0.224 -0.5,0.5v12.5c0,1.103 -0.897,2 -2,2c-1.102,0 -2,-0.897 -2,-2v-16h6v1.5c0,0.276 0.224,0.5 0.5,0.5h12.5v1Z" fill="#FFF"></path>
<path fill="none" d="M0,0h24v24h-24Z"></path>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 665 B

12
themes/grav/images/icons/modular.svg
View File

@@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!--Generated by IJSVG (https://github.com/iconjar/IJSVG)-->
<g fill="#FFF">
<path d="M14.1213,8.21134c1.17157,0.585786 1.17157,1.53553 0,2.12132c-1.17157,0.585786 -3.07107,0.585786 -4.24264,0c-1.17157,-0.585786 -1.17157,-1.53553 0,-2.12132c1.17157,-0.585786 3.07107,-0.585786 4.24264,0"></path>
<path d="M14.1213,2.71134c1.17157,0.585786 1.17157,1.53553 0,2.12132c-1.17157,0.585786 -3.07107,0.585786 -4.24264,0c-1.17157,-0.585786 -1.17157,-1.53553 0,-2.12132c1.17157,-0.585786 3.07107,-0.585786 4.24264,-4.44089e-16"></path>
<path d="M20.6213,5.21134c1.17157,0.585786 1.17157,1.53553 0,2.12132c-1.17157,0.585786 -3.07107,0.585786 -4.24264,0c-1.17157,-0.585786 -1.17157,-1.53553 0,-2.12132c1.17157,-0.585786 3.07107,-0.585786 4.24264,0"></path>
<path d="M8.12132,5.21134c1.17157,0.585786 1.17157,1.53553 0,2.12132c-1.17157,0.585786 -3.07107,0.585786 -4.24264,0c-1.17157,-0.585786 -1.17157,-1.53553 -8.88178e-16,-2.12132c1.17157,-0.585786 3.07107,-0.585786 4.24264,0"></path>
<path d="M0.9,17.492l9.649,4.2l1.93673e-08,8.45257e-09c0.253089,0.110457 0.547801,-0.00516885 0.658258,-0.258258c0.027497,-0.0630035 0.041707,-0.131 0.0417424,-0.199743v-8l1.44047e-08,-9.76842e-06c0.000291622,-0.199081 -0.117547,-0.379366 -0.300009,-0.458994l-10.249,-4.462l1.62231e-09,7.08036e-10c-0.253089,-0.110457 -0.547801,0.00516824 -0.658258,0.258257c-0.0276319,0.0633124 -0.0418447,0.131664 -0.0417421,0.200743v7.344l-5.4731e-08,6.88358e-05c-0.00046088,0.596879 0.353004,1.13723 0.900063,1.37596Z"></path>
<path d="M12.75,13.228v8l-6.74384e-09,-1.34436e-05c0.000134811,0.276142 0.224102,0.499891 0.500244,0.499756c0.0687424,-3.35596e-05 0.136739,-0.0142417 0.199744,-0.041737l9.65,-4.2l-1.25973e-07,5.49792e-08c0.546716,-0.238606 0.90009,-0.778484 0.9,-1.375v-7.33901l1.51191e-08,-1.02496e-05c0.000404505,-0.276142 -0.223125,-0.500327 -0.499267,-0.500732c-0.0690795,-0.000101191 -0.137431,0.014113 -0.200742,0.0417462l-10.25,4.456l2.30392e-08,-1.00564e-08c-0.182451,0.079638 -0.300276,0.259922 -0.299978,0.458996Z"></path>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.2 KiB

101
themes/grav/scss/preset.scss
View File

@@ -2,6 +2,7 @@
@import "configuration/template/base";
@import "template/modules/bourbon_essentials";
@import "template/modules/buttons";
@import "template/colors";
// Logo
$logo-bg: #323640 !default;
@@ -1796,3 +1797,103 @@ body .bootstrap-datetimepicker-widget {
// Range-field
@import "template/modules/input-range";
// Page Column View
#pages-columns {
.fjs-item {
.fjs-icon {
background-color: #999;
box-shadow: 0px 0px 0px 1px #fff;
&.home {
background-color: $color-navy;
}
&.visible {
background-color: darken($color-aqua, 5%);
}
&.lock {
background-color: $color-orange;
}
&.modular {
background-color: $color-purple;
}
&:after {
border: 1px solid $content-bg;
}
&.badge-published:after {
background-color: $color-green;
}
&.badge-unpublished:after {
background-color: $color-red;
}
}
.fjs-info {
> b {
color: darken($page-text, 10%);
}
> em {
color: lighten($page-text, 20%);
}
}
.fjs-action-toggle {
color: $primary-accent-bg;
}
.fjs-action-toggle, .fjs-children {
@include button-color-border(lighten($core-border-color, 5%), lighten($page-text, 20%));
}
> a {
position: relative;
&:hover {
//background-color: darken($content-bg, 2%);
.fjs-info > b {
color: $page-link;
}
.fjs-action-toggle, .fjs-children {
//@include button-color(darken($primary-accent-bg, 5%), $white, true);
//border: 1px solid lighten($primary-accent-bg, 5%);
color: $content-link;
}
}
}
&.active > a {
background-color: darken($content-bg, 4%);
.fjs-info {
//& > b {
// color: $white;
//}
//
//& > em {
// color: rgba($white, 0.7);
//}
}
.fjs-children {
@include button-color(darken($primary-accent-bg, 5%), $white, false);
//border: 1px solid lighten($primary-accent-bg, 5%);
}
}
}
}

163
themes/grav/scss/template/_pages.scss
View File

@@ -1,98 +1,123 @@
#pages-columns {
.fjs-col {
min-width: 300px;
width: 300px;
}
.fjs-item {
&:not(:first-child) {
//border-top: 1px solid $core-border-color;
}
a {
justify-content: flex-start;
padding: 4px 0;
margin: 3px 0;
padding-left: 5px;
& > span {
display: flex;
}
}
.fjs-info {
flex: 2;
padding: 0 1rem;
flex-direction: column;
line-height: 1.2;
.fjs-icon {
position: relative;
display: flex;
justify-content: center;
align-items: center;
overflow: inherit;
width: 34px;
height: 34px;
border-radius: 50%;
> b {
color: #444;
font-size: 110%;
display: block;
&:before {
position: relative;
content: url('../images/icons/file-edit.svg');
flex: 1;
max-width: 20px;
margin-right: -2px;
margin-bottom: -2px;
}
> em {
color: #aaa;
&.modular:before {
content: url('../images/icons/file-module.svg');
}
&.home:before {
content: url('../images/icons/file-home.svg');
}
&.lock:before {
content: url('../images/icons/file-lock.svg');
}
&.root:before {
content: url('../images/icons/root.svg');
}
&.badge-published:after, &.badge-unpublished:after {
content: '';
}
&:after, .badge-clock {
display: block;
position: absolute;
top: -2px;
right: -2px;
height: 12px;
width: 12px;
border-radius: 50%;
}
.badge-clock {
border-radius: 0;
content: url('../images/icons/clock-hands.svg');
z-index: 2;
}
}
.fjs-info {
flex: 2;
padding: 0 5px;
flex-direction: column;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
> b, > em {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
> b {
font-size: 110%;
}
}
.fjs-actions {
align-items: center;
color: #999;
padding-right: 5px;
display: flex;
.fa {
font-size: 0.9rem;
width: 28px;
height: 28px;
display: flex;
justify-content: center;
align-items: center;
&:before {
margin-right: -4px;
}
&.disabled {
opacity: 0;
}
}
}
}
.fjs-action-toggle {
font-size: 150%;
color: $color-blue;
padding: 0 10px;
}
.fjs-icon {
position: relative;
display: flex;
justify-content: center;
align-items: center;
overflow: inherit;
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #999;
&.visible {
background-color: $color-blue;
}
&.modular {
background-color: $color-purple;
}
img {
max-width: 24px;
}
&.badge-published:after {
background-color: $color-green;
}
&.badge-unpublished:after {
background-color: $color-red;
}
&:after {
content: '';
display: block;
position: absolute;
top: -2px;
right: -2px;
height: 14px;
width: 14px;
border-radius: 50%;
background-color: #666;
border: 2px solid #fff;
}
margin-right: 3px;
}
}

28
themes/grav/scss/template/modules/_buttons.scss
View File

@@ -55,3 +55,31 @@
}
}
}
@mixin button-color-border($color, $text:$white, $lighter:null) {
color: $text;
border-radius: $border-radius;
border: 1px solid $color;
@if ($lighter == null) {
$lighter: lightness($color) > 50;
}
@if ($lighter) {
&:hover {
border-color: shade($color,15%);
color: $text;
}
&.dropdown-toggle {
border-left: 1px solid lighten($color, 5%);
}
} @else {
&:hover {
border-color: tint($color,15%);
color: $text;
}
&.dropdown-toggle {
border-left: 1px solid darken($color, 5%);
}
}
}