Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-20 12:24:28 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add container tests

Browse Source
This commit is contained in:
Jeremy Thomas
2021-10-30 23:10:31 +01:00
parent 69a991ade1
commit 74b9b1e665
6 changed files with 263 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/_layouts/cypress.html
View File

@@ -10,7 +10,7 @@
<link rel="stylesheet" href="{{ site.url }}/vendor/fontawesome-free-5.15.2-web/css/all.min.css">
<link rel="stylesheet" href="{{ site.url }}/css/bulma.css?v={{ site.time | date: "%Y%m%d%H%M" }}">
</head>
<body style="padding: 1.5rem;">
<body>
{{ content }}
</body>
</html>

28
docs/bulma.scss vendored
View File

@@ -1,2 +1,30 @@
@charset "utf-8";
@import "../bulma";
.yolo {
content: "default";
}
@include tablet {
.yolo {
content: "tablet";
}
}
@include desktop {
.yolo {
content: "desktop";
}
}
@include widescreen {
.yolo {
content: "widescreen";
}
}
@include fullhd {
.yolo {
content: "fullhd";
}
}

28
docs/css/bulma.css vendored
View File

@@ -11788,3 +11788,31 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
background-color: #fafafa;
padding: 3rem 1.5rem 6rem;
}
.yolo {
content: "default";
}
@media screen and (min-width: 769px), print {
.yolo {
content: "tablet";
}
}
@media screen and (min-width: 1024px) {
.yolo {
content: "desktop";
}
}
@media screen and (min-width: 1216px) {
.yolo {
content: "widescreen";
}
}
@media screen and (min-width: 1408px) {
.yolo {
content: "fullhd";
}
}

28
docs/cypress/elements/container.html Normal file
View File

@@ -0,0 +1,28 @@
---
layout: cypress
title: Elements/Container
---
<div id="container" class="container">
I'm a container
</div>
<div id="container-max-desktop" class="container is-max-desktop">
I'm a max desktop container
</div>
<div id="container-max-widescreen" class="container is-max-widescreen">
I'm a max widescreen container
</div>
<div id="container-widescreen" class="container is-widescreen">
I'm a widescreen container
</div>
<div id="container-fullhd" class="container is-fullhd">
I'm a fullhd container
</div>
<div id="container-fluid" class="container is-fluid">
I'm a fluid container
</div>