From c577b1792318dd869d4c846d47e1b66ca5e1e4b9 Mon Sep 17 00:00:00 2001 From: Damian Lasecki Date: Thu, 6 Dec 2018 22:27:25 +0100 Subject: [PATCH 1/2] Wystylizowano widoki w /Home --- Trunk/Server/Forum/Forum/Content/Site.css | 398 ++++++++++++++++-- .../Forum/Forum/Views/Home/AddAnswer.cshtml | 28 +- .../Forum/Forum/Views/Home/AddQuestion.cshtml | 59 +-- .../Forum/Forum/Views/Home/Category.cshtml | 54 ++- .../Forum/Forum/Views/Home/Index.cshtml | 37 +- .../Forum/Forum/Views/Home/Question.cshtml | 37 +- .../Forum/Forum/Views/Shared/_Layout.cshtml | 4 +- 7 files changed, 514 insertions(+), 103 deletions(-) diff --git a/Trunk/Server/Forum/Forum/Content/Site.css b/Trunk/Server/Forum/Forum/Content/Site.css index 6ea5d8f..4a23635 100644 --- a/Trunk/Server/Forum/Forum/Content/Site.css +++ b/Trunk/Server/Forum/Forum/Content/Site.css @@ -1,24 +1,374 @@ -body { - padding-top: 50px; - padding-bottom: 20px; -} - -/* Set padding to keep content from hitting the edges */ -.body-content { - padding-left: 15px; - padding-right: 15px; -} - -/* Override the default bootstrap behavior where horizontal description lists - will truncate terms that are too long to fit in the left column -*/ -.dl-horizontal dt { - white-space: normal; -} - -/* Set width on the form input elements since they're 100% wide by default */ -input, -select, -textarea { - max-width: 280px; -} +body { + padding-top: 15rem; + padding-bottom: 20px; +} + +/* Set padding to keep content from hitting the edges */ +.body-content { + padding-left: 15px; + padding-right: 15px; +} + +/* Override the default bootstrap behavior where horizontal description lists + will truncate terms that are too long to fit in the left column +*/ +.dl-horizontal dt { + white-space: normal; +} + +/* Set width on the form input elements since they're 100% wide by default */ +input, +select + { + max-width: 280px; +} + +.navbar { + background: linear-gradient(#47478f 15%,#4d4794); + height: auto; +} + +.navbar a { + color: #fafafa; +} + +h2{ + margin: 1rem 0; +} + + + + +.navbar-toggle .icon-bar { + background: #b7c5d8; + width: 28px; +} + +.navbar-brand{ + font-size:2.5rem; + font-weight:700; + height:70px; + line-height:4rem; +} + +.navbar-toggle{ + margin-top:18px; +} + +.navbar > .container { + width: 90%; +} + +.nav > li > a:hover, .nav > li > a:focus{ + +background-color:#5a5aa7 ; +} + + +.category-list-wrapper{ + width:80%; + margin:0 auto; + +} + +.category-wrapper > ul { + list-style: none; +} + +.category-list{ + display: grid; + padding:0; + grid-row-gap: 2rem; +} + + .category-list > li { + height: 9rem; + display: flex; + justify-content: center; + align-items: center; + background-color:#bbbbc5; + border-radius: 1rem; + position:relative; + } + +.category-list > li > a { + text-decoration: none; + color: #fafafa; + font-size: 3rem; + display: block; + width: 100%; + height: 100%; + text-align: center; + line-height: 9rem; + overflow: hidden; +} + +.single-category-wrapper{ + padding: 3rem; + background-color: #f2f2f2; + border-radius: 1rem; +} + +.single-category-wrapper > h2 { + margin:1rem 0; +} + +.single-category-wrapper > ul { + padding:0; + list-style: none; +} + +.single-category-wrapper > ul li { + padding: 1.5rem 0; + font-size:1.5rem; +} + + + +.single-category-wrapper > ul li a { + text-decoration: none; + color: #3b3b3b; + +} + +.add-topic { + width: 100%; + border: none; + background: #79bd9b; + padding: 10px; + border-radius: 1rem; + font-size: 1.8rem; + margin-top: 1rem; +} + + +.add-topic > a{ + color: #fafafa; + text-decoration: none; + display:block; + width:100%; + height:100%; +} + + +.form-AddQuestion { + background-color: #f1f1f3; + padding: 3rem; + border-radius: 1rem; +} + +.form-AddQuestion input { + max-width: none; +} + +.form-personal-data{ + display: flex; + flex-direction: column; + width:100%; + justify-content: space-between; + +} + +.form-personal-data .form-group { + width:100%; +} + +.form-AddQuestion input[type=submit], .add-answer input[type=submit] { + border: none; + background: #79bd9b; + padding: 10px; + border-radius: 1rem; + font-size: 1.8rem; + color: #fafafa; + +} + +.form-AddQuestion input[type=submit]{ + margin-top: 1.7rem; +} + +.form-AddQuestion__btn{ + width:100%; + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: center; + +} + +.textarea-wrapper { + width: 50%; + margin: 20px auto; + padding: 5px; /*workaround for textarea margin*/ + background: #FFF; + border: 1px solid #808080; +} + +textarea { + max-width: none; + width: 100%; +} + +.answer-list__question { + background: #dee0eb; + padding: 3rem; + overflow-wrap: break-word; + border-radius: 1rem; + margin-bottom: 5rem; +} + +.answer-list__question h2 { + margin:0; + width: 80%; +} + +.answer-list__info { + display: flex; + justify-content: space-between; + align-items:center; +} + +.answer-list__answer { + list-style: none; + padding:0; +} + +.username { + font-weight: 700; +} + +.answer-list__answer__info { + background: #4d4c4c; + color: #fafafa; + padding: 1rem 2rem; + display: flex; + justify-content: space-between; + border-radius: 1rem; +} + +.answer-list__answer__info--proffesional { + background: #c68585; +} + +.answer-list__single-answer { + border: 1px solid #c0bebe; + border-radius: 1rem; + margin-bottom: 3rem; + border-top: none; +} + +.answer-list__content { + padding: 2rem 2rem; + width: 100%; + overflow-wrap: break-word; +} + +.answer-list__heading { + margin: 2rem 0; +} + +.answer-list__add-btn { + border: none; + background: #79bd9b; + border-radius: 1rem; + font-size: 1.8rem; + color: #fafafa; + width: 20rem; + display: flex; + justify-content:center; + align-items:center; + height: 5rem; + +} + + .answer-list__add-btn a { + text-decoration: none; + display: block; + width: 100%; + height: 100%; + color: white; + text-align: center; + line-height: 5rem; + } + +.add-answer { + background: #f2f2f2; + padding: 3rem; + border-radius: 1rem; +} + + + + + + + +@media (min-width: 768px) { + + + + .navbar > .container { + height: 10rem; + } + + .navbar-header { + height: 100%; + display: flex; + align-items: center; + } + + .navbar-brand { + font-size: 3.5rem; + } + + .navbar-nav { + height: 100px; + display: flex; + align-items: center; + } + + .navbar-nav > li { + height: 50%; + } + + + + .navbar-nav > li > a { + height: 100%; + border-radius: 0.8rem; + } + + .nav > li > a:hover, .nav > li > a:focus { + transition: background-color .1s ease; + } + + .category-list { + grid-template-columns: 1fr 1fr; + grid-column-gap: 2rem; + } + + .single-category-wrapper { + width: 65%; + margin: 0 auto; + } + + .form-AddQuestion__btn { + flex-direction: row; + margin-top: 1rem; + } + .form-personal-data{ + flex-direction: row; + } + + .form-personal-data .form-group { + width: 49%; + } + + .form-AddQuestion input[type=submit] { + margin-top:0; + } + +} + + + diff --git a/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml b/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml index a14fdaa..1e60c73 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml @@ -3,24 +3,34 @@ ViewBag.Title = "AddAnswer"; } -

AddAnswer

+ +
+ +

Dodaj odpowiedź

+ +
@using (Html.BeginForm("AddAnswer", "Home", FormMethod.Post)) {
- @Html.LabelFor(model => model.Nick, new { @class = "label-form" }) - @Html.EditorFor(model => model.Nick, new { htmlAttributes = new { @class = "form-control" } }) -
+ @Html.EditorFor(model => model.Nick, new { htmlAttributes = new { @class = "form-control", placeholder="Nazwa użytkownika" } }) +
+ +
+ + @Html.TextAreaFor(model => model.Content, new { @class = "form-control", @id = "exampleFormControlTextarea3", rows = 7, placeholder = "Odpowiedź" })
+ +
+ + + -
- @Html.LabelFor(model => model.Content, new { @class = "label-form" }) - @Html.EditorFor(model => model.Content, new { htmlAttributes = new { @class = "form-control" } }) -
@Html.HiddenFor(model=>model.QuestionId) - + } + diff --git a/Trunk/Server/Forum/Forum/Views/Home/AddQuestion.cshtml b/Trunk/Server/Forum/Forum/Views/Home/AddQuestion.cshtml index e70c009..2da2c89 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/AddQuestion.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/AddQuestion.cshtml @@ -3,36 +3,47 @@ ViewBag.Title = "AddQuestion"; } -

AddQuestion

+ @using (Html.BeginForm("AddQuestion", "Home", FormMethod.Post)) { + + +
+

Dodaj zapytanie

+
+ + + +
+ @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control", placeholder="Temat" } }) +
+ +
+ + + @Html.TextAreaFor(model => model.Content, new { @class="form-control", @id = "exampleFormControlTextarea3", rows=7, placeholder="Treść zapytania" })
+ +
+
+
+ @Html.EditorFor(model => model.Nick, new { htmlAttributes = new { @class = "form-control", placeholder="Nazwa użytkownika" } }) +
+ +
+ @Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control", placeholder="Adres email" } }) +
+
+ +
+ + + @Html.DropDownListFor(x=>x.CategoryId,new SelectList(Model.Categories,"Id", "CategoryName"), new { @class = "form-control" }) - -
- @Html.LabelFor(model => model.Title, new { @class = "label-form" }) - @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } }) + +
- -
- @Html.LabelFor(model => model.Content, new { @class = "label-form" }) - @Html.EditorFor(model => model.Content, new { htmlAttributes = new { @class = "form-control" } }) -
- -
- @Html.LabelFor(model => model.Nick, new { @class = "label-form" }) - @Html.EditorFor(model => model.Nick, new { htmlAttributes = new { @class = "form-control" } }) -
- -
- @Html.LabelFor(model => model.Email, new { @class = "label-form" }) - @Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } }) -
- - @Html.DropDownListFor(x=>x.CategoryId,new SelectList(Model.Categories,"Id", "CategoryName")) - - } diff --git a/Trunk/Server/Forum/Forum/Views/Home/Category.cshtml b/Trunk/Server/Forum/Forum/Views/Home/Category.cshtml index 15d4085..7a5fa70 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/Category.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/Category.cshtml @@ -1,18 +1,36 @@ -@model Forum.DataAccessLayer.Models.Category - -@{ - ViewBag.Title = Model.CategoryName; -} - -

@Model.CategoryName

- -@Html.ActionLink("Dodaj pytanie", "AddQuestion", "Home",new {category=Model.CategoryName},null) - - +@model Forum.DataAccessLayer.Models.Category + +@{ + ViewBag.Title = Model.CategoryName; +} + + +
+ +

@Model.CategoryName

+ +
+ +
    + @{ + foreach (var question in Model.Questions) + { + string title = question.Title; + if (String.IsNullOrEmpty(title)) + { + title = "Brak tytułu pytania"; + } + +
  • @Html.ActionLink(title, "Question", "Home", new { id = question.Id }, null)
    • + } + } +
+ + +
+ + + diff --git a/Trunk/Server/Forum/Forum/Views/Home/Index.cshtml b/Trunk/Server/Forum/Forum/Views/Home/Index.cshtml index 0cc31d7..8916ded 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/Index.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/Index.cshtml @@ -1,18 +1,19 @@ -@model IEnumerable - -@{ - ViewBag.Title = "Strona Główna"; -} - -
    - - @{ - foreach (var category in Model) - { -
  • - @Html.ActionLink(category.CategoryName,"Category","Home",new{name=category.CategoryName},null) -
    • - } - } -
- +@model IEnumerable + +@{ + ViewBag.Title = "Strona Główna"; +} +
+
    + + @{ + foreach (var category in Model) + { +
  • + @Html.ActionLink(category.CategoryName, "Category", "Home", new { name = category.CategoryName }, null) +
    • + + } +} +
+
diff --git a/Trunk/Server/Forum/Forum/Views/Home/Question.cshtml b/Trunk/Server/Forum/Forum/Views/Home/Question.cshtml index f1803e7..080fecd 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/Question.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/Question.cshtml @@ -4,25 +4,46 @@ ViewBag.Title = @Model.Title; } + +
+ + +
+

@Model.Title

@Model.PostDate -

@Model.Title

+
+
-
+ +
@Model.Content
-
-@Html.ActionLink("Dodaj odpowiedź","AddAnswer",new{id=@Model.Id}) -
+
-Odpowiedzi -
    + +

    Odpowiedzi

    +
      @{ foreach (var answer in Model.Answers) { -
    • @answer.Nick @answer.Date @answer.Content
      • +
    • +
      + @answer.Nick napisał(a) + @answer.Date +
      +
      + @answer.Content +
      +
      • } }
    +
    + +@Html.ActionLink("Dodaj odpowiedź", "AddAnswer", new { id = @Model.Id }) + +
    + diff --git a/Trunk/Server/Forum/Forum/Views/Shared/_Layout.cshtml b/Trunk/Server/Forum/Forum/Views/Shared/_Layout.cshtml index ae31cd1..2870f87 100644 --- a/Trunk/Server/Forum/Forum/Views/Shared/_Layout.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Shared/_Layout.cshtml @@ -9,7 +9,7 @@ -
    +
    - @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" }) + @Html.ActionLink("FORUM", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
      From 38c20d09ecc069d2bac392931b49f2b2d2a162cf Mon Sep 17 00:00:00 2001 From: Damian Lasecki Date: Thu, 6 Dec 2018 22:31:18 +0100 Subject: [PATCH 2/2] Wystylizowano widoki z /home --- Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml b/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml index 1e60c73..d1a71aa 100644 --- a/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml +++ b/Trunk/Server/Forum/Forum/Views/Home/AddAnswer.cshtml @@ -6,7 +6,7 @@
      -

      Dodaj odpowiedź

      +

      Dodaj odpowiedź