BOTAlex
/
Otakians
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Got text ontop of image!

This commit is contained in:
BOT Alex 2023-05-10 03:46:11 +02:00
parent 1269a13375
commit 60d218f8b6
6 changed files with 13 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Otakians/Pages/Index.razor
View File

@ -21,9 +21,13 @@
@for (int i = 0; i < 25; i++) @for (int i = 0; i < 25; i++)
{ {
<MudItem> <MudItem>
<MudPaper Class="md-8"> <MudPaper Class="md-8" Style="position:relative">
<MudText Style="position: absolute; z-index: 1" Typo="Typo.h6">@RandomUsernames[random.Next(0, RandomUsernames.Length)]</MudText> <MudContainer Style="position:absolute;" Class="mt-4">
<MudImage Style="position: relative" Class="rounded-lg ma-4" Src="@GetRandomImage()" Height="250" Width="250"></MudImage> <MudText Style="background-color:rgba(0, 0, 0, 0.4); backdrop-filter:blur(2px)" Class="pl-2 rounded-t-lg" Color="Color.Secondary" Typo="Typo.h6">@("@" + RandomUsernames[random.Next(0, RandomUsernames.Length)])</MudText>
</MudContainer>
<MudContainer>
<MudImage Class="rounded-lg my-4" Src="@GetRandomImage()" Height="250" Width="250"></MudImage>
</MudContainer>
</MudPaper> </MudPaper>
</MudItem> </MudItem>
} }

1
Otakians/Pages/Index.razor.css Normal file
View File

@ -0,0 +1 @@


5
Otakians/Properties/serviceDependencies.json
View File

@ -1,10 +1,5 @@
{ {
"dependencies": { "dependencies": {
"mssql2": {
"type": "mssql",
"connectionId": "ConnectionString",
"dynamicId": null
},
"secrets1": { "secrets1": {
"type": "secrets", "type": "secrets",
"connectionId": null "connectionId": null

6
Otakians/Properties/serviceDependencies.local.json
View File

@ -1,11 +1,5 @@
{ {
"dependencies": { "dependencies": {
"mssql2": {
"secretStore": "LocalSecretsFile",
"type": "mssql.onprem",
"connectionId": "ConnectionString",
"dynamicId": null
},
"secrets1": { "secrets1": {
"secretStore": null, "secretStore": null,
"resourceId": null, "resourceId": null,

22
Otakians/wwwroot/css/app.css
View File

@ -2,24 +2,7 @@
html, body { html, body {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
} background-color: black;
h1:focus {
outline: none;
}
a, .btn-link {
color: #0071c1;
}
.btn-primary {
color: #fff;
background-color: #1b6ec2;
border-color: #1861ac;
}
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
} }
.content { .content {
@ -73,6 +56,8 @@ a, .btn-link {
width: 8rem; width: 8rem;
height: 8rem; height: 8rem;
margin: 20vh auto 1rem auto; margin: 20vh auto 1rem auto;
background-color: dimgray;
border-radius: 5em;
} }
.loading-progress circle { .loading-progress circle {
@ -93,6 +78,7 @@ a, .btn-link {
position: absolute; position: absolute;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
color: aliceblue;
inset: calc(20vh + 3.25rem) 0 auto 0.2rem; inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
} }

2
Otakians/wwwroot/index.html
View File

@ -14,7 +14,7 @@
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" /> <link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
</head> </head>
<body style="background-color:black;"> <body>
<script src="_content/MudBlazor/MudBlazor.min.js"></script> <script src="_content/MudBlazor/MudBlazor.min.js"></script>
<div id="app"> <div id="app">
<svg class="loading-progress"> <svg class="loading-progress">