Got text ontop of image!
This commit is contained in:
parent
1269a13375
commit
60d218f8b6
|
@ -21,9 +21,13 @@
|
|||
@for (int i = 0; i < 25; i++)
|
||||
{
|
||||
<MudItem>
|
||||
<MudPaper Class="md-8">
|
||||
<MudText Style="position: absolute; z-index: 1" Typo="Typo.h6">@RandomUsernames[random.Next(0, RandomUsernames.Length)]</MudText>
|
||||
<MudImage Style="position: relative" Class="rounded-lg ma-4" Src="@GetRandomImage()" Height="250" Width="250"></MudImage>
|
||||
<MudPaper Class="md-8" Style="position:relative">
|
||||
<MudContainer Style="position:absolute;" Class="mt-4">
|
||||
<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>
|
||||
</MudItem>
|
||||
}
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
|
|
@ -1,10 +1,5 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"mssql2": {
|
||||
"type": "mssql",
|
||||
"connectionId": "ConnectionString",
|
||||
"dynamicId": null
|
||||
},
|
||||
"secrets1": {
|
||||
"type": "secrets",
|
||||
"connectionId": null
|
||||
|
|
|
@ -1,11 +1,5 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"mssql2": {
|
||||
"secretStore": "LocalSecretsFile",
|
||||
"type": "mssql.onprem",
|
||||
"connectionId": "ConnectionString",
|
||||
"dynamicId": null
|
||||
},
|
||||
"secrets1": {
|
||||
"secretStore": null,
|
||||
"resourceId": null,
|
||||
|
|
|
@ -2,24 +2,7 @@
|
|||
|
||||
html, body {
|
||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
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;
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
.content {
|
||||
|
@ -73,6 +56,8 @@ a, .btn-link {
|
|||
width: 8rem;
|
||||
height: 8rem;
|
||||
margin: 20vh auto 1rem auto;
|
||||
background-color: dimgray;
|
||||
border-radius: 5em;
|
||||
}
|
||||
|
||||
.loading-progress circle {
|
||||
|
@ -93,6 +78,7 @@ a, .btn-link {
|
|||
position: absolute;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
color: aliceblue;
|
||||
inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
|
||||
}
|
||||
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
|
||||
</head>
|
||||
|
||||
<body style="background-color:black;">
|
||||
<body>
|
||||
<script src="_content/MudBlazor/MudBlazor.min.js"></script>
|
||||
<div id="app">
|
||||
<svg class="loading-progress">
|
||||
|
|
Loading…
Reference in New Issue