Merge remote-tracking branch 'origin/master'

2024-12-23 23:23:06 +11:00 · 2019-12-18 17:46:39 +01:00 · 2019-12-18 17:46:39 +01:00 · 25c1672553
commit 25c1672553
parent b1aad7706a 5358af8390
15 changed files with 184 additions and 85 deletions
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@ -0,0 +1,27 @@
+---
+name: ⚠️ Bug
+about: Report a problem or defect
+---
+
+## Description
+
+<!-- A brief description of the issue -->
+
+## Environment
+
+URL:
+
+<!-- If the issue is browser-specific, include the link from https://whatsmybrowser.org/ -->
+
+## Steps to reproduce
+
+1.
+2.
+3. ...
+
+## Expected result
+
+
+## Actual result
+
+<!-- Include a traceback, screenshot or video if applicable -->
--- a/.github/ISSUE_TEMPLATE/feature.md
+++ b/.github/ISSUE_TEMPLATE/feature.md
@ -0,0 +1,12 @@
+---
+name: ✨ Feature
+about: Request new functionality or modifications to existing functionality
+---
+
+## Description
+
+## Acceptance Criteria
+
+<!-- Concrete steps that can be taken to confirm this works as expected -->
+
+
--- a/.github/ISSUE_TEMPLATE/task.md
+++ b/.github/ISSUE_TEMPLATE/task.md
@ -0,0 +1,8 @@
+---
+name: 👷 Task
+about: Behind-the-scenes work (upgrades, technical debt cleanup, etc.)
+---
+
+## Description
+
+## Reason for task
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@ -1,6 +1,11 @@
 Changelog
 =========

+3.5 (master)
+------------
+
+- Mobile view improvements.
+
 3.4 (2019-12-08)
 ----------------

--- a/2
+++ b/2
@ -35,7 +35,7 @@ css: ## Compile SCSS files

 .PHONY: css-watch
 css-watch: ## Compile JS files
-	npx sass --watch client/scss/dpaste.scss:build/dpaste.css
+	npx sass --watch client/scss/dpaste.scss:dpaste/static/dpaste.css

 .PHONY: js
 js: ## Compile JS files
--- a/client/scss/components/_form.scss
+++ b/client/scss/components/_form.scss
@ -11,14 +11,63 @@
 }

 .snippet-form {
+  box-sizing: border-box;
  background-color: $bgColor;

+  // Desktop Grid
+  @media only screen and (min-width: 700px) {
+    padding: 15px $boxPadding;
+    display: grid;
+    grid-template: "a b c d" "e e e e";
+    grid-template-columns: 1fr 1fr 1fr 10fr;
+    align-items: center;
+
+    .form-textarea {
+      height: 70vh;
+      display: flex;
+      flex-direction: column;
+      align-items: stretch;
+      border-top: 1px solid $borderColor;
+      margin-top: 15px;
+      padding-top: 15px;
+    }
+    .form-action { justify-self: end; }
+  }
+
+  // Mobile Grid
+  @media only screen and (max-width: 699px) {
+    padding: 10px;
+    display: grid;
+    justify-content: space-between;
+    grid-template: "a b" "c c" "e e" "d d";
+    align-items: center;
+    .form-expire select { margin-right: 0; }
+    .form-action { justify-self: start; }
+
+    p { padding: 4px 0; }
+  }
+
+  // ⬇ Layout
+  .form-lexer { grid-area: a;}
+  .form-expire { grid-area: b; }
+  .form-rtl { grid-area: c; white-space: nowrap; }
+  .form-action { grid-area: d; }
+  .form-textarea { grid-area: e; }
+
+  .form-action {
+    .btn {
+      width: auto;
+      padding: 6px 20px;
+    }
+  }
+
+  // ⬇ Form Element Appearance
  label {
    display: none;
    font-size: 13px;
  }

-  .options-rtl label {
+  .form-rtl label {
    display: inline;
  }

@ -58,38 +107,16 @@
    }
  }

-  .options {
-    @include boxPadding(0, 0);
+  textarea {
+    padding: 20px;
+    @include codeTextArea;
+    box-sizing: border-box;
+    width: 100%;
+    height: 100%;
+    border: 1px solid $borderColor;

-    height: 60px;
-    display: flex;
-    align-items: center;
-    border-bottom: 1px solid $borderColor;
-
-    .action {
-      margin-left: auto;
-
-      .btn {
-        width: auto;
-        padding: 6px 20px;
-      }
-    }
-  }
-
-  .content {
-    @include boxPadding(20px, 20px);
-
-    textarea {
-      padding: 20px;
-      @include codeTextArea;
-      min-height: 390px;
-      box-sizing: border-box;
-      width: 100%;
-      border: 1px solid $borderColor;
-
-      &:active, &:focus {
-        border-color: darken($selectBorderColor, 10%)
-      }
+    &:active, &:focus {
+      border-color: darken($selectBorderColor, 10%)
    }
  }
 }
--- a/client/scss/components/_header.scss
+++ b/client/scss/components/_header.scss
@ -73,7 +73,7 @@ ul#snippetOptions {

  display: flex;
  align-items: center;
-  
+
  a:link, a:visited {
    color: $metaTextColor;
    text-decoration: underline;
@ -140,3 +140,9 @@ ul#snippetOptions {
  position: absolute;
  left: -9999px;
 }
+
+// Hide some options on mobile to make up space
+@media only screen and (max-width: 700px) {
+  .option-type, .sep, .option-edit, .option-slim{ display: none; }
+  #copyHeadline { display: none; }
+}
--- a/docs/_static/custom.css
+++ b/docs/_static/custom.css
@ -0,0 +1,4 @@
+.highlight { background-color: #f8f8f8; }
+.highlight pre { font-size: 1em; }
+.sidebar .searchbox { border-top: 1px solid #eaecef;; }
+
--- a/docs/_static/logo.svg
+++ b/docs/_static/logo.svg
--- a/docs/conf.py
+++ b/docs/conf.py
@ -19,8 +19,10 @@

 # -- Project information -----------------------------------------------------

+from datetime import datetime
+
 project = 'dpaste'
-copyright = '2018, Martin Mahner'
+copyright = f'2013—{datetime.now().year}, Martin Mahner'
 author = 'Martin Mahner'

 # The short X.Y version
@ -69,7 +71,7 @@ language = None
 exclude_patterns = ['_build', 'Thumbs.db', '.DS_Store']

 # The name of the Pygments (syntax highlighting) style to use.
-pygments_style = 'sphinx'
+pygments_style = "tango"


 # -- Options for HTML output -------------------------------------------------
@ -79,9 +81,17 @@ pygments_style = 'sphinx'
 #

 try:
-    import sphinx_rtd_theme
-    html_theme = "sphinx_rtd_theme"
-    html_theme_path = ["_themes", ]
+    html_theme = "press"
+    html_css_files = ["custom.css"]
+    html_sidebars = {'**': ['util/sidetoc.html', 'util/searchbox.html']}
+    html_theme_options = {
+      "external_links": [
+          ("🐞 File an issue", "https://github.com/bartTC/dpaste/issues"),
+          ("Github", "https://github.com/bartTC/dpaste"),
+          ("Docker Hub", "https://hub.docker.com/r/barttc/dpaste"),
+          ("dpaste.org", "https://dpaste.org")
+      ]
+    }

 except ImportError:
    html_theme = 'alabaster'
--- a/docs/rtd-requirements.txt
+++ b/docs/rtd-requirements.txt
@ -1 +1,2 @@
 sphinxcontrib-httpdomain
+sphinx_press_theme
--- a/dpaste/apps.py
+++ b/dpaste/apps.py
@ -76,10 +76,10 @@ class dpasteAppConfig(AppConfig):
    #     )
    EXPIRE_CHOICES = (
        ("onetime", _("One-Time snippet")),
-        (3600, _("In one hour")),
-        (3600 * 24 * 7, _("In one week")),
-        (3600 * 24 * 30, _("In one month")),
-        ("never", _("Never")),
+        (3600, _("Expire in one hour")),
+        (3600 * 24 * 7, _("Expire in one week")),
+        (3600 * 24 * 30, _("Expire in one month")),
+        ("never", _("Never Expire")),
    )

    # Default value for ``EXPIRE_CHOICES``
--- a/dpaste/templates/dpaste/details.html
+++ b/dpaste/templates/dpaste/details.html
@ -7,19 +7,20 @@
 {% block body_type %}{%endblock %}

 {% block headline %}
-  <a href="{{ request.build_absolute_uri }}">{{ request.build_absolute_uri }}</a>
-
-  <a href="#" id="copyToClipboard" title="{% trans "Copy URL to clipboard" %}">
-    <svg fill="#FFF" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
-      <path d="M40.965 6c5.137 0 9.273 3.988 9.8 9h1.188c3.14 0 5.809 2.125 6.68 5h2.309c4.39 0 7.988 3.766 7.988 8.188V55h15.98-.004a1.99 1.99 0 0 1 1.574.652c.356.39.543.91.516 1.441A1.995 1.995 0 0 1 84.906 59h-15.98v26.812c0 4.422-3.598 8.188-7.988 8.188h-39.95C16.598 94 13 90.234 13 85.812V28.186C13 23.765 16.598 20 20.99 20h2.308c.871-2.875 3.54-5 6.68-5h1.187c.528-5.012 4.66-9 9.801-9zm0 4a5.968 5.968 0 0 0-5.992 6v1a2 2 0 0 1-2 2h-2.996c-1.696 0-2.996 1.305-2.996 3s1.3 3 2.996 3H51.95c1.695 0 2.996-1.305 2.996-3s-1.301-3-2.996-3h-2.996a1.998 1.998 0 0 1-1.996-2v-1c0-3.336-2.66-6-5.993-6zm19.973 14h-2.309c-.87 2.875-3.539 5-6.68 5H29.978c-3.14 0-5.809-2.125-6.68-5h-2.309c-1.968 0-3.996 2.05-3.996 4.188v57.624c0 2.137 2.024 4.188 3.996 4.188h39.95c1.968 0 3.996-2.05 3.996-4.188v-26.81H46.176l6.117 5.5c.828.742.894 2.015.156 2.843a2.01 2.01 0 0 1-2.84.157l-9.988-9a2 2 0 0 1 0-3l9.988-9a2.005 2.005 0 0 1 1.465-.532 2.002 2.002 0 0 1 1.219 3.532L46.175 55h18.758V28.189c0-2.137-2.027-4.188-3.996-4.188z"/>
-    </svg>
-  </a>
-  <input type="text" id="copyToClipboardField" value="{{ request.build_absolute_uri }}"/>
+  <div id="copyHeadline">
+    <a href="{{ request.build_absolute_uri }}">{{ request.build_absolute_uri }}</a>
+      <a href="#" id="copyToClipboard" title="{% trans "Copy URL to clipboard" %}">
+      <svg fill="#FFF" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+        <path d="M40.965 6c5.137 0 9.273 3.988 9.8 9h1.188c3.14 0 5.809 2.125 6.68 5h2.309c4.39 0 7.988 3.766 7.988 8.188V55h15.98-.004a1.99 1.99 0 0 1 1.574.652c.356.39.543.91.516 1.441A1.995 1.995 0 0 1 84.906 59h-15.98v26.812c0 4.422-3.598 8.188-7.988 8.188h-39.95C16.598 94 13 90.234 13 85.812V28.186C13 23.765 16.598 20 20.99 20h2.308c.871-2.875 3.54-5 6.68-5h1.187c.528-5.012 4.66-9 9.801-9zm0 4a5.968 5.968 0 0 0-5.992 6v1a2 2 0 0 1-2 2h-2.996c-1.696 0-2.996 1.305-2.996 3s1.3 3 2.996 3H51.95c1.695 0 2.996-1.305 2.996-3s-1.301-3-2.996-3h-2.996a1.998 1.998 0 0 1-1.996-2v-1c0-3.336-2.66-6-5.993-6zm19.973 14h-2.309c-.87 2.875-3.539 5-6.68 5H29.978c-3.14 0-5.809-2.125-6.68-5h-2.309c-1.968 0-3.996 2.05-3.996 4.188v57.624c0 2.137 2.024 4.188 3.996 4.188h39.95c1.968 0 3.996-2.05 3.996-4.188v-26.81H46.176l6.117 5.5c.828.742.894 2.015.156 2.843a2.01 2.01 0 0 1-2.84.157l-9.988-9a2 2 0 0 1 0-3l9.988-9a2.005 2.005 0 0 1 1.465-.532 2.002 2.002 0 0 1 1.219 3.532L46.175 55h18.758V28.189c0-2.137-2.027-4.188-3.996-4.188z"/>
+      </svg>
+    </a>
+    <input type="text" id="copyToClipboardField" value="{{ request.build_absolute_uri }}"/>
+  </div>
 {% endblock %}

 {% block options %}
  <ul id="snippetOptions">
-    <li>
+    <li class="option-type">
      <strong>{{ snippet.lexer_name }}</strong>
      {% if snippet.expire_type == 1 %}
        {% blocktrans with date=snippet.expires|timeuntil %}Expires in: {{ date }}{% endblocktrans %}
@ -30,18 +31,18 @@
      {% endif %}
    </li>
    <li class="sep"></li>
-    <li>
+    <li class="option-delete">
      <a href="#delete">{% trans "Delete Now" %}</a>
    </li>
    {% if raw_mode and snippet.expire_type != 3 %}
-      <li><a href="{% url "snippet_details_raw" snippet.secret_id %}">{% trans "Raw" %}</a></li>
+      <li class="option-raw"><a href="{% url "snippet_details_raw" snippet.secret_id %}">{% trans "Raw" %}</a></li>
    {% endif %}
-    <li><a href="{% url "snippet_details_slim" snippet.secret_id %}">{% trans "Slim" %}</a></li>
+    <li class="option-slim"><a href="{% url "snippet_details_slim" snippet.secret_id %}">{% trans "Slim" %}</a></li>
    <textarea id="copySnippetSource">{{ snippet.content }}</textarea>
-    <li><a href="#copy" id="copySnippetToClipboard">{% trans "Copy Snippet" %}</a></li>
-    <li><a href="#edit" id="editSnippet">{% trans "Edit Snippet" %}</a></li>
+    <li class="option-copy"><a href="#copy" id="copySnippetToClipboard">{% trans "Copy Snippet" %}</a></li>
+    <li class="option-edit"><a href="#edit" id="editSnippet">{% trans "Edit Snippet" %}</a></li>
    {% if snippet.lexer != 'text' %}
-      <li>
+      <li class="option-wordwrap">
        <label for="wordwrap">
          <input type="checkbox" id="wordwrap"{% if wordwrap %} checked{% endif %}> Wordwrap
        </label>
--- a/dpaste/templates/dpaste/includes/form.html
+++ b/dpaste/templates/dpaste/includes/form.html
@ -4,39 +4,38 @@
  {% csrf_token %}
  {{ form.non_field_errors }}

-  <div class="options">
-    <p style="display: none;">{{ form.title }}</p> {# Honeypot field #}
+  <p style="display: none;">{{ form.title }}</p> {# Honeypot field #}

-    <p class="options-lexer">
-      <label for="{{ form.lexer.auto_id }}">{% trans "Syntax" %}</label>
-      {{ form.lexer }}
-    </p>
+  <p class="form-lexer">
+    <label for="{{ form.lexer.auto_id }}">{% trans "Syntax" %}</label>
+    {{ form.lexer }}
+  </p>

-    <p class="options-expire">
-      <label for="{{ form.expires.auto_id }}">{% trans "Expires" %}</label>
-      {{ form.expires }}
-    </p>
+  <p class="form-expire">
+    <label for="{{ form.expires.auto_id }}">{% trans "Expires" %}</label>
+    {{ form.expires }}
+  </p>

-    <p class="options-rtl">
-      {{ form.rtl }}
-      <label for="{{ form.rtl.auto_id }}">{% trans "Right-to-Left" %}</label>
-    </p>
+  <p class="form-rtl">
+    {{ form.rtl }}
+    <label for="{{ form.rtl.auto_id }}">{% trans "Right-to-Left" %}</label>
+  </p>

-    <p class="action">
-      <button class="btn" type="submit">
-        {% trans "Paste Snippet" %}
-        <span class="sep"></span>
-        <span class="platform-mac">{% trans "&#8984;+&#9166;" %}</span>
-        <span class="platform-win">{% trans "Ctrl+&#9166;" %}</span>
-      </button>
-    </p>
-  </div>
-
-  <p class="content superenter {% if not object %}autofocus{% endif %} {% if form.content.errors %}error{% endif %}">
+  <p class="form-textarea superenter {% if not object %}autofocus{% endif %} {% if form.content.errors %}error{% endif %}">
      <label for="{{ form.content.auto_id }}">{% trans "Content" %}</label>
    {{ form.content }}
  </p>

+  <p class="form-action">
+    <button class="btn" type="submit">
+      {% trans "Paste Snippet" %}
+      <span class="sep"></span>
+      <span class="platform-mac">{% trans "&#8984;+&#9166;" %}</span>
+      <span class="platform-win">{% trans "Ctrl+&#9166;" %}</span>
+    </button>
+  </p>
+
+
  {{ dpaste_extra_post_form }}
 </form>

--- a/setup.cfg
+++ b/setup.cfg
@ -55,10 +55,10 @@ dev =
    ipdb
    isort
    black
-    django-sslserver
    sphinx
    sphinx-autobuild
    sphinx-rtd-theme
+    sphinx_press_theme
    sphinxcontrib-httpdomain

 [options.packages.find]