Test pico css
This commit is contained in:
parent
154fc4103f
commit
dfdaa1e867
4
assets/3rdparty/pico.min.css
vendored
Normal file
4
assets/3rdparty/pico.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -1,20 +1,14 @@
|
|||||||
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
|
||||||
|
|
||||||
.dashboard {
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--error: #ff3700;
|
--error: #ff3700;
|
||||||
--primary: #2a9dd6;
|
--pico-primary: #2a9dd6;
|
||||||
--primary-bg: #1b1529;
|
--pico-primary-background: #1b1529;
|
||||||
--primary-hover: #2489bb;
|
--pico-primary-hover: #2489bb;
|
||||||
--primary-text: #d2d6e5;
|
--pico-color: #d2d6e5;
|
||||||
--secondary-bg: #1a1a1a;
|
--pico-secondary-background: #1a1a1a;
|
||||||
--third-bg: #383838;
|
--dimmer: rgba(0, 0, 0, 0.6);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -26,21 +20,24 @@ body {
|
|||||||
"foot foot foot foot";
|
"foot foot foot foot";
|
||||||
grid-template-rows: min-content 1fr min-content;
|
grid-template-rows: min-content 1fr min-content;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
background: linear-gradient(127deg, var(--secondary-bg), var(--primary-bg)) no-repeat fixed;
|
background: linear-gradient(127deg, var(--pico-secondary-background), var(--pico-primary-background)) no-repeat fixed;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
color: var(--primary-text);
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
font-family: \'Poppins\', sans-serif;
|
font-family: \'Poppins\', sans-serif;
|
||||||
height: 100%;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
min-height: 100vh;
|
|
||||||
min-width: 100vw;
|
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard {
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
body > nav,
|
body > nav,
|
||||||
body > footer {
|
body > footer {
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
background-color: var(--dimmer);
|
||||||
padding: 1.2rem;
|
padding: 1.2rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
@ -52,14 +49,14 @@ body > nav {
|
|||||||
position: relative;
|
position: relative;
|
||||||
z-index: 500;
|
z-index: 500;
|
||||||
grid-area: nav;
|
grid-area: nav;
|
||||||
box-shadow: 0 20px 28px 0 rgba(0, 0, 0, 0.6);
|
box-shadow: 0 20px 28px 0 var(--dimmer);
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
body > footer {
|
body > footer {
|
||||||
grid-area: foot;
|
grid-area: foot;
|
||||||
box-shadow: 0 -20px 28px 0 rgba(0, 0, 0, 0.6);
|
box-shadow: 0 -20px 28px 0 var(--dimmer);
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -74,7 +71,7 @@ header h1 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
header hr {
|
header hr {
|
||||||
border-color: var(--primary);
|
border-color: var(--pico-primary);
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
}
|
}
|
||||||
@ -114,7 +111,6 @@ header {
|
|||||||
}
|
}
|
||||||
|
|
||||||
li a {
|
li a {
|
||||||
color: var(--primary-text);
|
|
||||||
padding-bottom: .45rem;
|
padding-bottom: .45rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
@ -136,20 +132,11 @@ table>tbody,
|
|||||||
table>tbody>tr,
|
table>tbody>tr,
|
||||||
table>tbody>tr>th,
|
table>tbody>tr>th,
|
||||||
table>tbody>tr>td {
|
table>tbody>tr>td {
|
||||||
border: 2px solid var(--primary);
|
border: 2px solid var(--pico-primary);
|
||||||
border-collapse: collapse !important;
|
border-collapse: collapse !important;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
|
||||||
border-radius: 25px;
|
|
||||||
border: 2px solid var(--primary);
|
|
||||||
background: var(--third-bg);
|
|
||||||
color: var(--primary-text);
|
|
||||||
width: 175px;
|
|
||||||
transition-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
table>tbody>tr>td>button {
|
table>tbody>tr>td>button {
|
||||||
border: unset;
|
border: unset;
|
||||||
border-radius: unset;
|
border-radius: unset;
|
||||||
@ -164,8 +151,7 @@ table {
|
|||||||
|
|
||||||
ul.navpage_list {
|
ul.navpage_list {
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
border: 4px solid var(--primary-hover) !important;
|
border: 4px solid var(--pico-primary-hover) !important;
|
||||||
background-color: var(--third-bg);
|
|
||||||
display: none;
|
display: none;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -175,19 +161,12 @@ ul.navpage_list {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.back {
|
.back {
|
||||||
background-color: #2a9dd6;
|
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
color: var(--primary-text);
|
|
||||||
padding: .35rem .65rem;
|
padding: .35rem .65rem;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
transition: all .3s ease;
|
transition: all .3s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.back:hover {
|
|
||||||
background-color: var(--primary-hover);
|
|
||||||
transition: all .3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.feature-list {
|
.feature-list {
|
||||||
display: block;
|
display: block;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@ -205,7 +184,7 @@ ul.navpage_list {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.navsite_item:hover .navpage_list {
|
.navsite_item:hover .navpage_list {
|
||||||
border: 4px solid var(--primary-hover) !important;
|
border: 4px solid var(--pico-primary-hover) !important;
|
||||||
display: flex !important;
|
display: flex !important;
|
||||||
max-height: 200px;
|
max-height: 200px;
|
||||||
width: inherit;
|
width: inherit;
|
||||||
@ -266,7 +245,7 @@ ul.navpage_list {
|
|||||||
}
|
}
|
||||||
|
|
||||||
ul.navpage_list {
|
ul.navpage_list {
|
||||||
border: 4px solid var(--primary-hover) !important;
|
border: 4px solid var(--pico-primary-hover) !important;
|
||||||
display: flex !important;
|
display: flex !important;
|
||||||
max-height: 200px !important;
|
max-height: 200px !important;
|
||||||
width: inherit;
|
width: inherit;
|
||||||
@ -281,10 +260,10 @@ ul.navpage_list {
|
|||||||
/*noinspection CssUnusedSymbol*/
|
/*noinspection CssUnusedSymbol*/
|
||||||
#navsite_list.active {
|
#navsite_list.active {
|
||||||
display: flex;
|
display: flex;
|
||||||
-moz-box-shadow: 0 20px 28px 0 rgba(0, 0, 0, 0.6);
|
-moz-box-shadow: 0 20px 28px 0 var(--dimmer);
|
||||||
-webkit-box-shadow: 0 20px 28px 0 rgba(0, 0, 0, 0.6);
|
-webkit-box-shadow: 0 20px 28px 0 var(--dimmer);
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
background-color: var(--dimmer);
|
||||||
box-shadow: 0 20px 28px 0 rgba(0, 0, 0, 0.6);
|
box-shadow: 0 20px 28px 0 var(--dimmer);
|
||||||
top: 80px;
|
top: 80px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
@ -292,7 +271,7 @@ ul.navpage_list {
|
|||||||
nav {
|
nav {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
background-color: var(--dimmer);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -348,16 +327,11 @@ ul.navpage_list {
|
|||||||
|
|
||||||
header a,
|
header a,
|
||||||
.error-code {
|
.error-code {
|
||||||
color: var(--primary);
|
color: var(--pico-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
input, textarea {
|
input, textarea {
|
||||||
background-color: var(--third-bg);
|
border: 2px solid var(--pico-primary);
|
||||||
border: 2px solid var(--primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
input::placeholder, textarea::placeholder{
|
|
||||||
color: var(--primary-text);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input{
|
input{
|
||||||
@ -368,17 +342,11 @@ textarea{
|
|||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
button:hover {
|
|
||||||
background: var(--primary);
|
|
||||||
transition-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-container input {
|
.form-container input {
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
background: none;
|
background: none;
|
||||||
border: 2px solid var(--primary);
|
border: 2px solid var(--pico-primary);
|
||||||
width: 175px;
|
width: 175px;
|
||||||
color: var(--primary-text);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
header.ye-span:hover + body{
|
header.ye-span:hover + body{
|
||||||
@ -391,11 +359,11 @@ header.ye-span:hover + body{
|
|||||||
|
|
||||||
#articlecreate {
|
#articlecreate {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
border: 5px solid var(--primary);
|
border: 5px solid var(--pico-primary);
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 40px;
|
padding: 40px;
|
||||||
background-color: var(--primary-bg);
|
background-color: var(--pico-primary-background);
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -436,5 +404,5 @@ div#articleslist > article > div.articleinfo{
|
|||||||
}
|
}
|
||||||
|
|
||||||
div#articleslist>article{
|
div#articleslist>article{
|
||||||
border: 4px solid var(--primary);
|
border: 4px solid var(--pico-primary);
|
||||||
}
|
}
|
@ -3,5 +3,5 @@
|
|||||||
<h1 class="error-code">403</h1>
|
<h1 class="error-code">403</h1>
|
||||||
<h3><i class="ri-error-warning-line"></i> Našli sme stránku ktorú hľadáš, ale nemáš práva na ňu pristupovať: <span class="error">__TEMPLATE_PAGE_TITLE__</span>. <i class="ri-error-warning-line"></i></h3>
|
<h3><i class="ri-error-warning-line"></i> Našli sme stránku ktorú hľadáš, ale nemáš práva na ňu pristupovať: <span class="error">__TEMPLATE_PAGE_TITLE__</span>. <i class="ri-error-warning-line"></i></h3>
|
||||||
<!--suppress HtmlUnknownTarget -->
|
<!--suppress HtmlUnknownTarget -->
|
||||||
<a href="__DEFAULT_LINK__" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
<a href="__DEFAULT_LINK__" role="button" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
||||||
</div>
|
</div>
|
@ -3,5 +3,5 @@
|
|||||||
<h1 class="error-code">404</h1>
|
<h1 class="error-code">404</h1>
|
||||||
<h3><i class="ri-error-warning-line"></i> Nenašli sme stránku ktorú hľadáš: <span class="error">__TEMPLATE_PAGE_TITLE__</span>. <i class="ri-error-warning-line"></i></h3>
|
<h3><i class="ri-error-warning-line"></i> Nenašli sme stránku ktorú hľadáš: <span class="error">__TEMPLATE_PAGE_TITLE__</span>. <i class="ri-error-warning-line"></i></h3>
|
||||||
<!--suppress HtmlUnknownTarget -->
|
<!--suppress HtmlUnknownTarget -->
|
||||||
<a href="__DEFAULT_LINK__" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
<a href="__DEFAULT_LINK__" role="button" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
||||||
</div>
|
</div>
|
@ -3,5 +3,5 @@
|
|||||||
<h1 class="error-code">500</h1>
|
<h1 class="error-code">500</h1>
|
||||||
<h3><i class="ri-error-warning-line"></i> Nejaký neschopný vývojár nevedel robiť túto stránku. <i class="ri-error-warning-line"></i></h3>
|
<h3><i class="ri-error-warning-line"></i> Nejaký neschopný vývojár nevedel robiť túto stránku. <i class="ri-error-warning-line"></i></h3>
|
||||||
<!--suppress HtmlUnknownTarget -->
|
<!--suppress HtmlUnknownTarget -->
|
||||||
<a href="__DEFAULT_LINK__" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
<a href="__DEFAULT_LINK__" role="button" class="back"><i class="ri-arrow-left-line"></i> SPÄŤ DOMOV</a>
|
||||||
</div>
|
</div>
|
@ -1,9 +1,10 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="sk">
|
<html lang="sk" data-theme="dark">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link rel="stylesheet" href="/assets/3rdparty/fonts/remixicon/remixicon.css">
|
<link rel="stylesheet" href="/assets/3rdparty/fonts/remixicon/remixicon.css">
|
||||||
|
<link rel="stylesheet" href="/assets/3rdparty/pico.min.css">
|
||||||
<link rel="stylesheet" href="/assets/style.css">
|
<link rel="stylesheet" href="/assets/style.css">
|
||||||
<link rel="icon" href="/assets/images/favicon.png" type="image/png">
|
<link rel="icon" href="/assets/images/favicon.png" type="image/png">
|
||||||
__TEMPLATE__DYNAMIC__SCRIPT__
|
__TEMPLATE__DYNAMIC__SCRIPT__
|
||||||
|
Loading…
Reference in New Issue
Block a user