Docs for the new .core CSS class, refs #2415

docs/custom_templates.rst

@@ -83,6 +83,15 @@ database column they are representing, for example:
         </tbody>
     </table>
 
+.. _customization_css:
+
+Writing custom CSS
+~~~~~~~~~~~~~~~~~~
+
+Custom templates need to take Datasette's default CSS into account. The pattern portfolio at ``/-/patterns`` (`example here <https://latest.datasette.io/-/patterns>`__) is a useful reference for understanding the available CSS classes.
+
+The ``core`` class is particularly useful - you can apply this directly to a ``<input>`` or ``<button>`` element to get Datasette's default form styles, or you can apply it to a containing element (such as ``<form>``) to apply those styles to all of the form elements within it.
+
 .. _customization_static_files:
 
 Serving static files

docs/writing_plugins.rst

@@ -124,7 +124,6 @@ And a Python module file, ``datasette_plugin_demos.py``, that implements the plu
             "random_integer", 2, random.randint
         )
 
-
 Having built a plugin in this way you can turn it into an installable package using the following command::
 
     python3 setup.py sdist
@@ -164,6 +163,8 @@ Where ``datasette_plugin_name`` is the name of the plugin package (note that it
 
 `datasette-cluster-map <https://github.com/simonw/datasette-cluster-map>`__ is a useful example of a plugin that includes packaged static assets in this way.
 
+See :ref:`customization_css` for tips on writing CSS that is compatible with Datasette's default CSS, including details of the ``core`` class for applying Datasette's default form element styles.
+
 .. _writing_plugins_custom_templates:
 
 Custom templates