mirror of
https://github.com/duckietm/Nitro-Cool-UI.git
synced 2025-06-21 22:36:58 +00:00
🆙 Small update in credits
This commit is contained in:
duckietm
parent
1949f7c807
commit
d8979b2dc9
BIN
src/assets/images/notifications/nitro.png
Normal file
BIN
src/assets/images/notifications/nitro.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
@ -72,10 +72,142 @@
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.nitro-coolui-logo {
|
||||
.nitro-credits {
|
||||
background: linear-gradient(to bottom, #1a1a1a, #000000);
|
||||
color: #fff;
|
||||
width: 400px;
|
||||
min-height: 400px;
|
||||
max-height: 500px;
|
||||
overflow-y: hidden;
|
||||
border: 2px solid #ffd700;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
|
||||
|
||||
.nitro-card-header {
|
||||
background: #d4d4d4 !important;
|
||||
color: #fff !important;
|
||||
height: 34px;
|
||||
min-height: 34px;
|
||||
line-height: 34px;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
.nitro-card-header-text {
|
||||
color: #000 !important;
|
||||
text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
|
||||
}
|
||||
|
||||
.nitro-card-header-close {
|
||||
background-image: url("@/assets/images/boxes/card/close.png");
|
||||
width: 19px;
|
||||
height: 20px;
|
||||
|
||||
&:hover {
|
||||
background-image: url("@/assets/images/boxes/card/close_hover.png");
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-image: url("@/assets/images/boxes/card/close_click.png");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nitro-card-content {
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
height: calc(100% - 34px);
|
||||
overflow-y: hidden;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.grid {
|
||||
animation: scroll-credits 20s linear infinite;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #ffd700;
|
||||
color: #000000;
|
||||
border: none;
|
||||
transition: transform 0.3s ease;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
background-color: #ffeb3b;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
font-family: 'Arial', sans-serif;
|
||||
text-shadow: 0 0 5px rgba(255, 255, 255, 0.8);
|
||||
&.bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
&.font-size-4 {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
&.font-size-5 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
&.small {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
}
|
||||
|
||||
.nitro-coolui-logo {
|
||||
width: 150px;
|
||||
height: 78px;
|
||||
position: relative;
|
||||
background-image: url("@/assets/images/notifications/coolui.png");
|
||||
background-repeat: no-repeat;
|
||||
filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.7));
|
||||
}
|
||||
|
||||
.nitro-logo-default {
|
||||
width: 300px;
|
||||
height: 150px;
|
||||
background-image: url("@/assets/images/notifications/nitro.png");
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto 20px;
|
||||
filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.7));
|
||||
}
|
||||
|
||||
.credits-divider {
|
||||
width: 80%;
|
||||
height: 1px;
|
||||
background: #000;
|
||||
margin: 10px auto;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
height: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes scroll-credits {
|
||||
0% {
|
||||
transform: translateY(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
10% {
|
||||
transform: translateY(80%);
|
||||
opacity: 1;
|
||||
}
|
||||
90% {
|
||||
transform: translateY(-80%);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(-100%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@ -2,47 +2,85 @@ import { FC } from 'react';
|
||||
import { GetRendererVersion, GetUIVersion, NotificationAlertItem } from '../../../../api';
|
||||
import { Button, Column, Flex, Grid, LayoutNotificationCredits, LayoutNotificationAlertViewProps, Text } from '../../../../common';
|
||||
|
||||
interface NotificationDefaultAlertViewProps extends LayoutNotificationAlertViewProps
|
||||
{
|
||||
interface NotificationDefaultAlertViewProps extends LayoutNotificationAlertViewProps {
|
||||
item: NotificationAlertItem;
|
||||
}
|
||||
|
||||
export const NitroSystemAlertView: FC<NotificationDefaultAlertViewProps> = props =>
|
||||
{
|
||||
export const NitroSystemAlertView: FC<NotificationDefaultAlertViewProps> = props => {
|
||||
const { title = 'Nitro Cool UI Edit', onClose = null, ...rest } = props;
|
||||
|
||||
return (
|
||||
<LayoutNotificationCredits title={ title } onClose={ onClose } { ...rest }>
|
||||
<LayoutNotificationCredits title={title} onClose={onClose} classNames={['nitro-credits']} {...rest}>
|
||||
<Grid>
|
||||
<Column size={ 12 }>
|
||||
<Column alignItems="center" gap={ 0 }>
|
||||
<Text bold fontSize={ 4 }>Nitro React</Text>
|
||||
<Text>v{ GetUIVersion() }</Text>
|
||||
<Column size={12}>
|
||||
<div className="nitro-logo-default"></div>
|
||||
</Column>
|
||||
<Column size={10}>
|
||||
<Column alignItems="center" gap={1}>
|
||||
<Text bold fontSize={5}>Nitro React</Text>
|
||||
<Text>Nitro was created by billsonnn</Text>
|
||||
<div className="spacer"></div>
|
||||
<Text>Nitro Versions</Text>
|
||||
<Text><b>Nitro:</b> {GetUIVersion()}</Text>
|
||||
</Column>
|
||||
<Column alignItems="center">
|
||||
<Text><b>Renderer:</b> v{ GetRendererVersion() }</Text>
|
||||
<Column fullWidth gap={ 1 }>
|
||||
<Button fullWidth variant="success" onClick={ event => window.open('https://discord.nitrodev.co') }>Nitro Discord</Button>
|
||||
<Flex gap={ 1 }>
|
||||
<Button fullWidth onClick={ event => window.open('https://git.krews.org/nitro/nitro-react') }>Nitro Git</Button>
|
||||
<Button fullWidth onClick={ event => window.open('https://git.krews.org/nitro/nitro-react/-/issues') }>Nitro Bug Report</Button>
|
||||
<Text><b>Renderer:</b> v{GetRendererVersion()}</Text>
|
||||
<Column fullWidth gap={1}>
|
||||
<Button fullWidth variant="success" onClick={event => window.open('https://discord.nitrodev.co')}>
|
||||
Nitro Discord
|
||||
</Button>
|
||||
<Flex gap={1}>
|
||||
<Button fullWidth onClick={event => window.open('https://git.krews.org/nitro/nitro-react')}>
|
||||
Nitro Git
|
||||
</Button>
|
||||
<Button fullWidth onClick={event => window.open('https://git.krews.org/nitro/nitro-react/-/issues')}>
|
||||
Nitro Bug Report
|
||||
</Button>
|
||||
</Flex>
|
||||
</Column>
|
||||
</Column>
|
||||
</Column>
|
||||
<div className="mysterytrophy-image"></div>
|
||||
<Column size={12}>
|
||||
<div className="credits-divider"></div>
|
||||
</Column>
|
||||
<Column size={12}>
|
||||
<Flex alignItems="center" gap={2}>
|
||||
{/* Logo on the left */}
|
||||
<Column size={6} justifyContent="start">
|
||||
<div className="nitro-coolui-logo"></div>
|
||||
<Column size={ 10 }>
|
||||
<Column alignItems="left" gap={ 0 }>
|
||||
<Text center bold fontSize={ 5 }>Cool UI</Text>
|
||||
</Column>
|
||||
{/* Text on the right */}
|
||||
<Column size={6} alignItems="left" gap={0}>
|
||||
<Text center bold fontSize={5}>Cool UI</Text>
|
||||
<Text>Was created by Wassehk</Text>
|
||||
<Text>- DuckieTM (Re-Design)</Text>
|
||||
<Text>- Jonas (Contributing)</Text>
|
||||
<Text>- Ohlucas (Sunset resources)</Text>
|
||||
<Text center bold small>v1.5.0</Text>
|
||||
<Button fullWidth onClick={ event => window.open('https://git.krews.org/nitro/nitro-react') }>Cool UI Git</Button>
|
||||
<Button fullWidth onClick={event => window.open('https://github.com/duckietm/Nitro-Cool-UI')}>
|
||||
Cool UI Git
|
||||
</Button>
|
||||
</Column>
|
||||
</Flex>
|
||||
</Column>
|
||||
|
||||
<Column size={12}>
|
||||
<div className="credits-divider"></div>
|
||||
</Column>
|
||||
|
||||
<Column size={10}>
|
||||
<Column alignItems="center" gap={1}>
|
||||
<Text center bold fontSize={5}>Special Thanks</Text>
|
||||
<Text>The whole Discord community !!</Text>
|
||||
<Text>- Billsonnn for creating Nitro.</Text>
|
||||
<Text>- Remco for testing.</Text>
|
||||
<Text>- Object from Atom.</Text>
|
||||
<Text>- Habbo for providing the assets</Text>
|
||||
</Column>
|
||||
</Column>
|
||||
<div className="notification-frank"></div>
|
||||
</Grid>
|
||||
</LayoutNotificationCredits>
|
||||
);
|
||||
}
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user