moved styles to global css

jeremyknight-me · Dec 23, 2020 · c4f99aa · c4f99aa
1 parent 7716684
commit c4f99aa
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 22 deletions.
diff --git a/PhotoCollageWeb/Components/Photo.razor b/PhotoCollageWeb/Components/Photo.razor
@@ -1,4 +1,3 @@
 <div class="image-wrapper">
     <img class="@this.CssClasses" style="@this.CssStyles" src="@($"data:image/{this.Image.Extension};base64,{this.Image.Data}")" />
 </div>
-
diff --git a/PhotoCollageWeb/Components/Photo.razor.css b/PhotoCollageWeb/Components/Photo.razor.css
diff --git a/PhotoCollageWeb/Components/PhotoFrame.razor.css b/PhotoCollageWeb/Components/PhotoFrame.razor.css
diff --git a/PhotoCollageWeb/Pages/Collage.razor.css b/PhotoCollageWeb/Pages/Collage.razor.css
diff --git a/PhotoCollageWeb/Pages/Index.razor b/PhotoCollageWeb/Pages/Index.razor
@@ -2,4 +2,9 @@
 
 <h1>Hello, world!</h1>
 
-Welcome to your new app.
+<div style="text-align: center;">
+    <NavLink href="collage">
+        Start Collage
+    </NavLink>
+</div>
+
diff --git a/PhotoCollageWeb/wwwroot/css/site.css b/PhotoCollageWeb/wwwroot/css/site.css
@@ -6,6 +6,33 @@ html, body {
     width: 100%;
 }
 
+/* -- Photo Frame Styles ----- */
+
+#collage-wrapper {
+    background-color: #222;
+    height: 100vh;
+    position: absolute;
+    overflow: hidden;
+    width: 100vw;
+    z-index: 0;
+}
+
+.photo-frame {
+    position: absolute;
+}
+
+.bordered {
+    background-color: #eee;
+    filter: drop-shadow(0 0 0.75rem #333);
+    padding: 0.8em;
+}
+
+.photo-frame img {
+    border: 1px solid #222;
+}
+
+/* -- Blazor Styles ----- */
+
 #blazor-error-ui {
     background: lightyellow;
     bottom: 0;