TerribleDev/DotNetMashup
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix ui

Browse Source
This commit is contained in:
Tommy Parnell
2015-10-08 19:06:41 -04:00
parent 51a41da85c
commit d1f28bbc78
6 changed files with 68 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/DotNetMashup.Web/Views/Home/Index.cshtml
View File

@@ -4,18 +4,14 @@
ViewData["Title"] = "Dot Net Mashups!"; ViewData["Title"] = "Dot Net Mashups!";
} }
@await Html.PartialAsync("Tiles", Model.Posts) @await Html.PartialAsync("Tiles", Model.Posts)
<br /> <br />
<br/> <br />
@if(Model.NextPage.HasValue) @if(Model.NextPage.HasValue)
{ {
<div class="row" style="min-height: 100px"> <div class="row" style="min-height: 100px">
<a asp-action="Index" asp-route-page="@Model.NextPage" class="pill col-md-offset-5 ">Next Page</a> <a asp-action="Index" asp-route-page="@Model.NextPage" class="pill col-md-offset-5 ">Next Page</a>
</div> </div>
} }

2
src/DotNetMashup.Web/Views/Home/Tiles.cshtml
View File

@@ -3,7 +3,7 @@
@{ @{
ViewData["Title"] = "Dot Net Mashups!"; ViewData["Title"] = "Dot Net Mashups!";
} }
<div class="col-sm-12"> <div class="col-sm-offset-1 col-sm-10">
@foreach(var x in Model) @foreach(var x in Model)
{ {

21
src/DotNetMashup.Web/Views/Shared/DisplayTemplates/BlogPostExternalData.cshtml
View File

@@ -1,15 +1,18 @@
@model DotNetMashup.Web.Model.BlogPostExternalData @model DotNetMashup.Web.Model.BlogPostExternalData
<div class="tile"> <div class="tile">
<div class="row"> <div class="container">
<div class="col-md-2"><img class="img-responsive img" src="@Model.Author.ImageUrl" /></div> <div class="row">
<div class="col-md-8"><h2><i class="fa fa-book" style="font-size:32px"></i> @Model.Author.Name </h2></div> <div class="col-md-2"><img class="img-responsive img" src="@Model.Author.ImageUrl" /></div>
</div> <div class="col-md-8"><h2><i class="fa fa-book" style="font-size:32px"></i> @Model.Author.Name </h2></div>
<div class="row"> </div>
<div class="col-md-12"> <div class="row">
<h2><a href="@Model.OriginalLink">@Model.Title</a></h2> <div class="col-md-12">
<p>@Html.Raw(Model.Content)</p> <h2><a href="@Model.OriginalLink">@Model.Title</a></h2>
@Html.Raw(Model.Content)<span>
<a href="@Model.OriginalLink">Read Further</a>
</span>
</div>
</div> </div>
</div> </div>
</div> </div>

14
src/DotNetMashup.Web/Views/Shared/DisplayTemplates/GithubAnnouncement.cshtml
View File

@@ -1,11 +1,13 @@
@model DotNetMashup.Web.Model.GithubAnnouncement @model DotNetMashup.Web.Model.GithubAnnouncement
<div class="tile"> <div class="tile">
<div class="row"> <div class="container">
<div class="col-md-2"><img class="img-responsive img" src="@Model.Author.ImageUrl" /></div> <div class="row">
<div class="col-md-6"><h2><i class="fa fa-github" style="font-size:32px"></i> @Model.Author.Name <a href="@Model.OriginalLink">#@Model.IssueNumber</a> </h2></div> <div class="col-md-2"><img class="img-responsive img" src="@Model.Author.ImageUrl" /></div>
</div> <div class="col-md-6"><h2><i class="fa fa-github" style="font-size:32px"></i> @Model.Author.Name <a href="@Model.OriginalLink">#@Model.IssueNumber</a> </h2></div>
<div class="row"> </div>
<div class="col-md-12"><p>@Html.Raw(@Model.Content)</p></div> <div class="row">
<div class="col-md-12">@Html.Raw(@Model.Content)</div>
</div>
</div> </div>
</div> </div>

4
src/DotNetMashup.Web/Views/Shared/_Layout.cshtml
View File

@@ -10,6 +10,9 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head> </head>
<body> <body>
<div class="headerwrap">
<h2 style="color: #FFFFFF; text-align:center;">ASP.NET News Mashups</h2>
</div>
<div class="container body-content"> <div class="container body-content">
@RenderBody() @RenderBody()
</div> </div>
@@ -26,7 +29,6 @@
<script src="~/js/site.js" asp-append-version="true"></script> <script src="~/js/site.js" asp-append-version="true"></script>
@RenderSection("scripts", required: false) @RenderSection("scripts", required: false)
</body> </body>
</html> </html>

87
src/DotNetMashup.Web/wwwroot/css/site.css
View File

@@ -1,59 +1,58 @@
/* Wrapping element */ .tile {
/* Set some basic padding to keep content from hitting the edges */ border-radius: 5px;
.body-content {
padding-left: 15px;
padding-right: 15px;
}
/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
max-width: 280px;
}
/* Carousel */
.carousel-caption {
z-index: 10 !important;
}
.carousel-caption p {
font-size: 20px;
line-height: 1.4;
}
@media (min-width: 768px) {
.carousel-caption {
z-index: 10 !important;
}
}
.tile {
border-radius: 25px;
border: 1px solid #03A9F4; border: 1px solid #03A9F4;
background-color: #F5F5F5; background-color: #ffffff;
margin-bottom: 5px; margin-bottom: 20px;
padding: 10px; -webkit-box-shadow: 7px 10px 20px -7px rgba(0,0,0,0.75);
white-space: pre-wrap; -moz-box-shadow: 7px 10px 20px -7px rgba(0,0,0,0.75);
box-shadow: 7px 10px 20px -7px rgba(0,0,0,0.75);
padding: 5px;
} }
body { body {
padding-top: 50px; background-color: #f5f8fa;
background-color: #616161;
} }
footer { footer {
width: 100%; width: 100%;
padding: 10px; padding: 10px;
background-color: #F5F5F5; background-color: #ffffff;
position: fixed;
bottom: 0;
} }
.img { .img {
border-radius: 50%; border-radius: 50%;
} }
.pill{
border-radius: 50%; .pill {
background-color: #F5F5F5; border-radius: 50%;
padding: 10px; background-color: #ffffff;
border: 1px solid #03A9F4; padding: 10px;
border: 1px solid #03A9F4;
}
.headerwrap {
background-color: #00BCD4;
width: 100%;
height: 80px;
z-index: 1000;
-webkit-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
}
@media screen and (min-width: 480px) {
.headerwrap {
position: fixed;
top: 0;
}
.body-content {
margin-top: 180px;
}
}
.tile > * > p {
white-space: pre-line;
} }