OpenWrt/luci-theme-alpha
1
0
Fork 0
mirror of https://github.com/derisamedia/luci-theme-alpha.git synced 2025-01-07 03:06:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

Penyesuaian untuk luci-app-alpha-config

Browse Source 
Ada beberapa penyesuaian dan fix bugs pada update 3.9.2-beta antara lain:

1. Memindahkan lokasi background login dan dasboard LuCI
2. Migrasi dari CSS ke HTML
This commit is contained in:
Hilman Maulana 2024-02-09 00:52:24 +07:00
parent e892cf9f43
commit f3ae2a4c3b
7 changed files with 3809 additions and 3343 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Makefile
View File

@ -10,7 +10,7 @@ THEME_NAME:=alpha
THEME_TITLE:=Alpha THEME_TITLE:=Alpha
PKG_NAME:=luci-theme-$(THEME_NAME) PKG_NAME:=luci-theme-$(THEME_NAME)
PKG_VERSION:=3.9.1-beta PKG_VERSION:=3.9.2-beta
PKG_RELEASE:=9 PKG_RELEASE:=9
include $(INCLUDE_DIR)/package.mk include $(INCLUDE_DIR)/package.mk

0
luasrc/gaya/dashboard.png → luasrc/background/dashboard.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 666 KiB

After

Width:  |  Height:  |  Size: 666 KiB

0
luasrc/style/login.png → luasrc/background/login.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 666 KiB

After

Width:  |  Height:  |  Size: 666 KiB

1329
luasrc/gaya/gaya.css
View File

File diff suppressed because it is too large Load Diff

74
luasrc/style/style.css
View File

@ -1,4 +1,3 @@
/*-------------------- /*--------------------
catatan usahakan untuk mengganti bg pakai format png, kalo jpg ganti aja di bagian body, sesuaikan aja nama formatnya catatan usahakan untuk mengganti bg pakai format png, kalo jpg ganti aja di bagian body, sesuaikan aja nama formatnya
---------------------*/ ---------------------*/
@ -17,12 +16,11 @@ html {
} }
body { body {
background: url('login.png'); height: 100%;
height: 100%; background-position: center;
background-position: center; background-repeat: no-repeat;
background-repeat: no-repeat; background-size: cover;
background-size: cover; background-attachment: fixed;
background-attachment: fixed;
} }
@ -30,7 +28,8 @@ background-attachment: fixed;
Text Text
---------------------*/ ---------------------*/
h2, h3 { h2,
h3 {
font-size: 16px; font-size: 16px;
letter-spacing: -1px; letter-spacing: -1px;
line-height: 20px; line-height: 20px;
@ -139,9 +138,9 @@ Login Box
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
-webkit-box-shadow: 15px -15px 30px rgba(0,0,0,0.32); -webkit-box-shadow: 15px -15px 30px rgba(0, 0, 0, 0.32);
-moz-box-shadow: 15px -15px 30px rgba(0,0,0,0.32); -moz-box-shadow: 15px -15px 30px rgba(0, 0, 0, 0.32);
box-shadow: 15px -15px 30px rgba(0,0,0,0.32); box-shadow: 15px -15px 30px rgba(0, 0, 0, 0.32);
} }
.box-login-title { .box-login-title {
@ -162,29 +161,29 @@ Login Box
z-index: 2; z-index: 2;
-webkit-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
-webkit-border-radius: 20px: -webkit-border-radius: 20px: -moz-border-radius=20px;
-moz-border-radius= 20px;
border-radius: 20px; border-radius: 20px;
-moz-box-shadow: 15px 30px 30px rgba(0,0,0,0.32); -moz-box-shadow: 15px 30px 30px rgba(0, 0, 0, 0.32);
box-shadow: 15px 30px 30px rgba(0,0,0,0.32); box-shadow: 15px 30px 30px rgba(0, 0, 0, 0.32);
} }
.box-info { .box-info {
width: 260px; width: 260px;
top: 60px; top: 60px;
position: absolute; position: absolute;
right: -5px; right: -5px;
padding: 15px 15px 15px 30px; padding: 15px 15px 15px 30px;
background-color: rgba(255,255,255,0.6); background-color: rgba(255, 255, 255, 0.6);
border: 1px solid rgba(255,255,255,0.2); border: 1px solid rgba(255, 255, 255, 0.2);
z-index: 0; z-index: 0;
-webkit-border-radius: 6px; -webkit-border-radius: 6px;
-moz-border-radius: 6px; -moz-border-radius: 6px;
border-radius: 6px; border-radius: 6px;
-webkit-box-shadow: 15px 30px 30px rgba(0,0,0,0.32); -webkit-box-shadow: 15px 30px 30px rgba(0, 0, 0, 0.32);
-moz-box-shadow: 15px 30px 30px rgba(0,0,0,0.32); -moz-box-shadow: 15px 30px 30px rgba(0, 0, 0, 0.32);
box-shadow: 15px 30px 30px rgba(0,0,0,0.32); box-shadow: 15px 30px 30px rgba(0, 0, 0, 0.32);
} }
.line-wh { .line-wh {
@ -193,16 +192,20 @@ Login Box
top: 0px; top: 0px;
margin: 12px auto; margin: 12px auto;
position: relative; position: relative;
border-top: 1px solid rgba(255,255,255,0.3); border-top: 1px solid rgba(255, 255, 255, 0.3);
} }
/*-------------------- /*--------------------
Form Form
---------------------*/ ---------------------*/
a { text-decoration: none; } a {
text-decoration: none;
}
button:focus { outline:0; } button:focus {
outline: 0;
}
.b { .b {
height: 24px; height: 24px;
@ -228,7 +231,8 @@ button:focus { outline:0; }
opacity: 1; opacity: 1;
} }
.b-support, .b-cta { .b-support,
.b-cta {
width: 100%; width: 100%;
padding: 0px 15px; padding: 0px 15px;
font-family: 'Quicksand', sans-serif; font-family: 'Quicksand', sans-serif;
@ -256,7 +260,8 @@ button:focus { outline:0; }
color: #fff; color: #fff;
} }
.b-support:hover, .b-cta:hover { .b-support:hover,
.b-cta:hover {
color: #fff; color: #fff;
background-color: #87314e; background-color: #87314e;
border: #87314e 1px solid; border: #87314e 1px solid;
@ -270,7 +275,7 @@ button:focus { outline:0; }
width: 100%; width: 100%;
display: inline-table; display: inline-table;
padding: 5px 20px; padding: 5px 20px;
margin-bottom:2px; margin-bottom: 2px;
} }
label { label {
@ -295,7 +300,7 @@ input[type=password] {
width: auto; width: auto;
height: 32px; height: 32px;
padding: 0px 10px; padding: 0px 10px;
background-color:rgb(0 0 0 / 28%); background-color: rgb(0 0 0 / 28%);
border: none; border: none;
display: inline; display: inline;
color: #bdbdbd; color: #bdbdbd;
@ -357,8 +362,13 @@ p.field span.i {
Transitions Transitions
---------------------*/ ---------------------*/
.box-form, .box-info, .b, .b-support, .b-cta, .box-form,
input[type=submit], p.field span.i { .box-info,
.b,
.b-support,
.b-cta,
input[type=submit],
p.field span.i {
-webkit-transition: all 0.3s; -webkit-transition: all 0.3s;
-moz-transition: all 0.3s; -moz-transition: all 0.3s;
@ -375,9 +385,9 @@ Credits
width: 100%; width: 100%;
position: absolute; position: absolute;
bottom: 4px; bottom: 4px;
font-family:'Open Sans', 'Helvetica Neue', Helvetica, sans-serif; font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
font-size: 12px; font-size: 12px;
color: rgba(255,255,255,0.1); color: rgba(255, 255, 255, 0.1);
text-align: center; text-align: center;
z-index: -1; z-index: -1;
} }
@ -402,5 +412,5 @@ img.bawah {
.icon-credits a { .icon-credits a {
text-decoration: none; text-decoration: none;
color: rgba(255,255,255,0.2); color: rgba(255, 255, 255, 0.2);
} }

5
template/header.htm
View File

@ -57,12 +57,10 @@
</style> </style>
<% end -%> <% end -%>
</head> </head>
<body class="lang_<%=luci.i18n.context.lang%> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> <% if not (path == "") then %>node-<%= path %><% else %>node-main-login<% end %>" data-page="<%= pcdata(path) %>"> <body class="lang_<%=luci.i18n.context.lang%> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> <% if not (path == "") then %>node-<%= path %><% else %>node-main-login<% end %>" data-page="<%= pcdata(path) %>" style="background-image:url('/luci-static/alpha/background/dashboard.png')">
<header> <header>
<div class="fill"> <div class="fill">
<div class="container"> <div class="container">
<a id="logo" href="<% if luci.dispatcher.context.authsession then %><%=url('admin/status/overview')%><% else %>#<% end %>"> <a id="logo" href="<% if luci.dispatcher.context.authsession then %><%=url('admin/status/overview')%><% else %>#<% end %>">
<img src="<%=media%>/brand.png" alt="OpenWrt"> <img src="<%=media%>/brand.png" alt="OpenWrt">
</a> </a>
@ -95,5 +93,4 @@
<p><%:You must enable JavaScript in your browser or LuCI will not work properly.%></p> <p><%:You must enable JavaScript in your browser or LuCI will not work properly.%></p>
</div> </div>
</noscript> </noscript>
<div id="tabmenu" style="display:none"></div> <div id="tabmenu" style="display:none"></div>

4
template/sysauth.htm
View File

@ -20,10 +20,8 @@
<title>Alpha - Login Dulu</title> <title>Alpha - Login Dulu</title>
</head> </head>
<body class="lang_en node-main-login" data-page=""> <body class="lang_en node-main-login" data-page="" style="background-image:url('/luci-static/alpha/background/dashboard.png')">
<header> <header>
<div class="fill"> <div class="fill">
<div class="container"> <div class="container">
<span class="showSide"></span> <span class="showSide"></span>