Added theme "Stargazer"
This commit is contained in:
Julian Prieber
parent
2028862b92
commit
9f8b865a35
|
|
@ -0,0 +1,198 @@
|
|||
/* ************************************************************* */
|
||||
/*
|
||||
/* Use this file to add custom CSS animations.
|
||||
/* Delete this file if you wish to use the default animations.
|
||||
/* If you do not want to have animations in your theme,
|
||||
/* remove or comment them and include this file in your theme.
|
||||
/*
|
||||
/* ************************************************************* */
|
||||
|
||||
|
||||
/* Table of contents
|
||||
––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||
- Entrance animations
|
||||
- Button hover animations
|
||||
- Icon hover animations
|
||||
- Footer hover animations
|
||||
|
||||
*/
|
||||
|
||||
|
||||
|
||||
/* Entrance animations
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
.button-entrance {
|
||||
animation-name: popUp;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode: both;
|
||||
/* Used to start button entrance animation one after another */
|
||||
animation-delay: calc(var(--delay)/10);
|
||||
}
|
||||
|
||||
@keyframes popUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale3d(0.3, 0.3, 0.3);
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fadein {
|
||||
animation-name: fadein;
|
||||
animation-duration: 3s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Button hover animations
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
/* (Also apply to icon) */
|
||||
|
||||
.button-hover{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: perspective(1px) translateZ(0);
|
||||
transform: perspective(1px) translateZ(0);
|
||||
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
|
||||
-webkit-transition-duration: 0.9s;
|
||||
transition-duration: 0.9s;
|
||||
}
|
||||
.button-hover:active,
|
||||
.button-hover:focus,
|
||||
.button-hover:hover{
|
||||
-webkit-transform: scale(1.1);
|
||||
transform: scale(1.1);
|
||||
-webkit-transition-timing-function: cubic-bezier(0.47, 2.7, 0.31, -0.36);
|
||||
transition-timing-function: cubic-bezier(0.47, 2.7, 0.31, -0.36);
|
||||
}
|
||||
|
||||
.credit-hover{
|
||||
display:inline-block;
|
||||
-webkit-transform:perspective(1px) translateZ(0);
|
||||
transform:perspective(1px) translateZ(0);
|
||||
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||
-webkit-transition-duration:.3s;
|
||||
transition-duration:.3s;
|
||||
-webkit-transition-property:transform;
|
||||
transition-property:transform
|
||||
}
|
||||
.credit-hover:active,
|
||||
.credit-hover:focus,
|
||||
.credit-hover:hover{
|
||||
-webkit-transform:scale(1.1);
|
||||
transform:scale(1.1)
|
||||
}
|
||||
|
||||
/* Icon hover animations
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
/* .icon-hover{
|
||||
display:inline-block;
|
||||
-webkit-transform:perspective(1px) translateZ(0);
|
||||
transform:perspective(1px) translateZ(0);
|
||||
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||
-webkit-transition-duration:.3s;
|
||||
transition-duration:.3s
|
||||
}
|
||||
.icon-hover .hvr-icon{
|
||||
-webkit-transform:translateZ(0);
|
||||
transform:translateZ(0)
|
||||
}
|
||||
.icon-hover:active .hvr-icon,.icon-hover:focus .hvr-icon,.icon-hover:hover .hvr-icon{
|
||||
-webkit-animation-name:icon-hover;
|
||||
animation-name:icon-hover;
|
||||
-webkit-animation-duration:1s;
|
||||
animation-duration:1s;
|
||||
-webkit-animation-timing-function:ease-in-out;
|
||||
animation-timing-function:ease-in-out;
|
||||
-webkit-animation-iteration-count:1;
|
||||
animation-iteration-count:1
|
||||
}
|
||||
|
||||
@-webkit-keyframes icon-hover{
|
||||
16.65%{
|
||||
-webkit-transform:translateY(6px);
|
||||
transform:translateY(6px)
|
||||
}
|
||||
33.3%{
|
||||
-webkit-transform:translateY(-5px);
|
||||
transform:translateY(-5px)
|
||||
}
|
||||
49.95%{
|
||||
-webkit-transform:translateY(4px);
|
||||
transform:translateY(4px)
|
||||
}
|
||||
66.6%{
|
||||
-webkit-transform:translateY(-2px);
|
||||
transform:translateY(-2px)
|
||||
}
|
||||
83.25%{
|
||||
-webkit-transform:translateY(1px);
|
||||
transform:translateY(1px)
|
||||
}
|
||||
100%{
|
||||
-webkit-transform:translateY(0);
|
||||
transform:translateY(0)
|
||||
}
|
||||
}
|
||||
@keyframes icon-hover{
|
||||
16.65%{
|
||||
-webkit-transform:translateY(6px);
|
||||
transform:translateY(6px)
|
||||
}
|
||||
33.3%{
|
||||
-webkit-transform:translateY(-5px);
|
||||
transform:translateY(-5px)
|
||||
}
|
||||
49.95%{
|
||||
-webkit-transform:translateY(4px);
|
||||
transform:translateY(4px)
|
||||
}
|
||||
66.6%{
|
||||
-webkit-transform:translateY(-2px);
|
||||
transform:translateY(-2px)
|
||||
}
|
||||
83.25%{
|
||||
-webkit-transform:translateY(1px);
|
||||
transform:translateY(1px)
|
||||
}
|
||||
100%{
|
||||
-webkit-transform:translateY(0);
|
||||
transform:translateY(0)
|
||||
}
|
||||
} */
|
||||
|
||||
|
||||
/* Footer hover animations
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
.footer-hover{
|
||||
display:inline-block;
|
||||
-webkit-transform:perspective(1px) translateZ(0);
|
||||
transform:perspective(1px) translateZ(0);
|
||||
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||
-webkit-transition-duration:.3s;
|
||||
transition-duration:.3s;
|
||||
-webkit-transition-property:transform;
|
||||
transition-property:transform;
|
||||
-webkit-transition-timing-function:ease-out;
|
||||
transition-timing-function:ease-out
|
||||
}
|
||||
.footer-hover:active,.footer-hover:focus,.footer-hover:hover{
|
||||
-webkit-transform:translateY(-8px);
|
||||
transform:translateY(-8px)
|
||||
}
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
|
||||
/* Table of contents
|
||||
––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||
|
||||
- Rounded user avatars
|
||||
- Buttons
|
||||
- Brand Styles
|
||||
|
||||
*/
|
||||
|
||||
|
||||
/* Rounded avatars
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
/* Disable this if you don't want rounded avatars for users */
|
||||
.rounded-avatar {
|
||||
border-radius: 50%;
|
||||
-webkit-box-shadow: 0px 0px 0px 3px #ffffff;
|
||||
box-shadow: 0px 0px 0px 3px #ffffff;
|
||||
background-color: #ffffff !important;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
|
||||
/* Buttons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
:root {
|
||||
/* violet */
|
||||
--primary-color: 111, 76, 255;
|
||||
|
||||
/* white */
|
||||
--text-color: 256, 256, 256;
|
||||
}
|
||||
|
||||
.button {
|
||||
font-family: 'DM Sans', sans-serif;
|
||||
font-size: 18px;
|
||||
padding: 12px 32px;
|
||||
margin: 1rem;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
transition: all 0.3s ease;
|
||||
border-radius: 50px;
|
||||
color: rgba(var(--text-color));
|
||||
border: 2px double transparent;
|
||||
background-image: linear-gradient(rgb(13, 14, 33), rgb(13, 14, 33)), radial-gradient(circle at left top, rgb(1, 110, 218), rgb(217, 0, 192));
|
||||
background-origin: border-box;
|
||||
background-clip: padding-box, border-box;
|
||||
max-width: 300px;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: rgba(var(--primary-color), 0.5) 0px 0px 20px 0px;
|
||||
color: rgba(var(--text-color));
|
||||
opacity: 0.85;
|
||||
}
|
||||
|
||||
|
||||
/* Brand Icons
|
||||
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||
|
||||
.icon {
|
||||
padding: 0px 8px 3.5px 0px;
|
||||
/* position: absolute;
|
||||
left: 20px;
|
||||
top: 15px; */
|
||||
vertical-align: middle;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<?php
|
||||
|
||||
return [
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Theme Config
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| Description.
|
||||
|
|
||||
*/
|
||||
|
||||
// Some themes may not be compatible with custom buttons created by the Button Editor.
|
||||
// If 'false' the default button CSS is used.
|
||||
'allow_custom_buttons' => 'false',
|
||||
|
||||
'open_links_in_same_tab' => 'false',
|
||||
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Custom Code
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| Description.
|
||||
|
|
||||
*/
|
||||
|
||||
'enable_custom_code' => 'false',
|
||||
|
||||
// Disable individual files (only applies if above is 'true').
|
||||
'enable_custom_head' => 'true',
|
||||
'enable_custom_body' => 'true',
|
||||
'enable_custom_body_end' => 'true',
|
||||
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Custom Icons
|
||||
|--------------------------------------------------------------------------
|
||||
|
|
||||
| Description.
|
||||
|
|
||||
*/
|
||||
|
||||
'use_custom_icons' => 'false',
|
||||
|
||||
// Is not set correct this will cause errors.
|
||||
'custom_icon_extension' => '.svg', // (.png, .jpg ...)
|
||||
|
||||
|
||||
|
||||
];
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 141 KiB |
|
|
@ -0,0 +1,26 @@
|
|||
# A LittleLink Custom Theme
|
||||
Find more themes: https://github.com/JulianPrieber/llc-themes
|
||||
|
||||
* Theme Name: Stargazer
|
||||
* Theme Version: 1.1
|
||||
* Theme Date: 2022-09-01
|
||||
* Theme Author: JulianPrieber
|
||||
* Theme Author URI: https://github.com/JulianPrieber
|
||||
* Theme License: GPLv3
|
||||
|
||||
## Preview:
|
||||
|
||||
|
||||
|
||||
### Used assets:
|
||||
* Built using:
|
||||
* https://github.com/dhg/Skeleton
|
||||
* License: MIT
|
||||
|
||||
* Built using:
|
||||
* https://codepen.io/SuneBear/pen/YzVgebG
|
||||
* License: MIT
|
||||
|
||||
* Built using:
|
||||
* https://codepen.io/trishalim/pen/WNEOdWK
|
||||
* License: MIT
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
.share-icon {
|
||||
padding: 0px 8px 3.5px 0px;
|
||||
vertical-align: middle;
|
||||
color: #FFF !important;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.sharediv {
|
||||
position:relative;
|
||||
top: 30px;
|
||||
right: 30px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.toastdiv {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.toastbox {
|
||||
width: 280px;
|
||||
padding: 10px;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
position: fixed;
|
||||
top: 105%;
|
||||
-webkit-transition: transform 0.3s linear;
|
||||
transition: transform 0.3s linear;
|
||||
z-index: 2;
|
||||
text-align: center;
|
||||
}
|
||||
.toastbox.toast-tox--active {
|
||||
-webkit-transform: translateY(-150px);
|
||||
transform: translateY(-150px);
|
||||
}
|
||||
.sharebutton,
|
||||
sharebutton {
|
||||
display: inline-block;
|
||||
/* height: 48px; */
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
width: 24px;
|
||||
/* line-height: 48px; */
|
||||
scale: 2;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
color: #FFF;
|
||||
background-color: rgb(1, 110, 218);
|
||||
background-image: linear-gradient(315deg, rgb(1, 110, 218), rgb(217, 0, 192));
|
||||
}
|
||||
|
||||
sharebutton:hover,
|
||||
.sharebutton:hover {
|
||||
color: #FFF;
|
||||
opacity: 0.85;
|
||||
opacity: 1 !important;
|
||||
filter: alpha(opacity=40);
|
||||
border-color: #888;
|
||||
outline: 0; }
|
||||
.sharebutton.sharebutton-primary {
|
||||
color: #FFFFFF;
|
||||
filter: brightness(90%) }
|
||||
.sharebutton.sharebutton-primary:hover,
|
||||
.sharebutton.sharebutton-primary:focus {
|
||||
color: #FFFFFF;
|
||||
filter: brightness(90%) }
|
||||
|
||||
|
||||
.sharebutton-mb {
|
||||
display: none;
|
||||
}
|
||||
.sharebutton-img {
|
||||
position: relative;
|
||||
left: 5px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue