many new

2020-06-24 18:56:24 +03:00
parent 9447ee613b
commit 5d4972145b
119 changed files with 5412 additions and 5086 deletions
@@ -0,0 +1,172 @@
+@import "../../Constants"
+
+.Novel
+  .Novel__Main
+    display: flex
+    padding: $primaryPadding
+    background-color: var(--sec-bg-color)
+    border-radius: $borderRadius
+
+    @media (max-width: 600px)
+      flex-direction: column
+
+    &_Left
+      display: flex
+      flex-direction: column
+
+      .Novel__Main_Image
+        max-width: 350px
+        max-height: 200px
+        margin-right: .5rem
+        border-radius: $borderRadius
+
+      .Novel__Main_Status
+        margin-bottom: 1rem
+
+        &_Mark
+          margin-top: .5rem
+          width: 100%
+          display: flex
+          justify-content: space-between
+
+          .Selected
+            background-color: var(--block-sec-color)
+
+          &_Element
+            padding: .5rem
+            background-color: var(--block-color)
+            width: 100%
+            text-align: center
+            cursor: pointer
+
+            &:hover
+              background-color: var(--sec-bg-color)
+
+        &_Primary
+          display: flex
+          justify-content: space-between
+          background-color: var(--block-color)
+          font-size: 1rem
+          margin-top: .5rem
+          padding: .25rem
+
+        &_Extended
+          background-color: var(--block-color)
+          font-size: 1rem
+
+          .Novel__Main_Status_Element
+            padding: .25rem
+            border-top: var(--sec-bg-color) 2px solid
+
+        .Novel__Main_Status_Element
+          cursor: pointer
+
+    .Novel__Info_Title
+      @media (max-width: 600px)
+        margin-top: 1rem
+
+      font-size: 1.7rem
+      font-weight: 600
+      margin-bottom: 1rem
+
+    .Novel__Info_Description
+      margin-top: .5rem
+      @media (min-width: 600px)
+        margin-left: 1rem
+      font-size: 1rem
+
+    .Novel__Info_Genres
+      display: flex
+      align-items: center
+      font-size: 1rem
+
+      .Genre
+        margin: .2rem
+        border: #992222 1px solid
+        padding: .1rem
+        border-radius: 3px
+        font-weight: 300
+
+  .Novel__Comments
+    margin-top: 1rem
+    padding: $primaryPadding
+    background-color: var(--sec-bg-color)
+    border-radius: $borderRadius
+
+    form
+      width: 100%
+      margin-bottom: .5rem
+
+      .Novel__Comments_BBCodes
+        font-size: 1.3rem
+        margin-bottom: .2rem
+
+        svg
+          cursor: pointer
+
+        svg:first-child
+          padding-right: .5rem
+
+        svg:last-child
+          padding-left: .5rem
+
+        svg:not(:first-child):not(:last-child)
+          padding: 0 .5rem
+
+      .Novel__Comments_TextArea
+        width: 100%
+        background-color: var(--block-color)
+        font-size: 1rem
+        padding: .25rem
+        border: none
+        border-radius: $borderRadius
+        box-sizing: border-box
+        min-height: 4rem
+        resize: none
+        margin-bottom: .5rem
+
+      .Novel__Comments_Submit
+        background-color: var(--block-color) !important
+        border-radius: $borderRadius
+        border: none
+        font-size: 1rem
+        padding: .5rem
+
+  .Novel__Characters
+    margin-top: 1rem
+    padding: $primaryPadding 0
+    background-color: var(--sec-bg-color)
+    border-radius: $borderRadius
+
+    .Novel__Characters_Title
+      margin-left: .5rem
+      font-size: 1.2rem
+      font-weight: bold
+
+    .Novel__Characters_List
+      width: 100%
+      display: flex
+      flex-wrap: wrap
+
+      @media (max-width: 600px)
+        justify-content: center
+
+      .Novel__Character
+        box-sizing: border-box
+        width: 150px
+        height: 250px
+        border-radius: $borderRadius
+        background-color: var(--block-color)
+        margin: 0 .5rem
+        padding-bottom: .2rem
+
+        .Novel__Character_Name
+          text-align: center
+
+        .Character_Image
+          border-radius: $borderRadius $borderRadius 0 0
+          width: 100%
+          height: calc(100% - 1.5rem)
+          background-size: cover
+          background-position: center
+          margin-bottom: .2rem